PACE No
DATE
Ql Oifferent kues oE xeqt Compoents in.
React J9 th eomple S
the building blaes
af Reat1S
appliaHon
e)They halp to break user inerface na sallez,
inh
eLsble chunk,making the codeesier to
malatain qnd mange
Each ype af anponernts plays qn impar
tant oole in building
brilding dyeania and intezehive
dypamic
cueb appliaians.
4A that
Req ct
ehn
cam panenk ia Tavienpt AuoctHon
o React elesaent degembinq bowg
Gechien ot uT qppeachould
5) (am popeots can manage thejr con tk.
Rreraive data ai panpl maakicg pasibk
to create reuade a dbagic. Y elemenks.
ATn sirople \em2 React compeneot iais like
a Taunipt ;ke Iatgaipt functHon that
eturo IMlike cade (7sx) toender ong
hingon wehpagee
Oamponegts in Rech eton a
cade
piece ofTax
hat tellG ubat ghould be renderedon
3crean.
fncHional Caonpocents iaRegehi
React elemeat.
These frekioni my
deolar
Ele iCeabe a fiton conpontot
fueiey ackae.()
calkd udloe
Yelunn <h}Hel lo,
Welsome. to Dubxi 1<h4?3
3
()Clas Commoeol io Recl
0Thecan com popenka Qreq litte more compe that
fntional compormots.
Hda3S component n sho iheitagce, andaccesg
doto ofober ompoento.
(6 Cla,9 (onponep uat ioclhue }he line. Uoehenda
Redct ono porept." to pD dh Goxn one chig (omfon
to anoher.
4)We ao ase
baed compoeots in Reqchi.
casg Demoomponent
exeods
Beant.Companent &
Tetrn
ta> helone Mexsage l2/hA
3
3
B Careg te adss (oropobent called cuelcorme.
claG Weloroe extend s
Yender c)
eturn
2h4 He) lo,Welcome to Duboi!2b4;
EEaet
gtact
N
Grtnce
DATE
cantucusly aliacin& eEitient datn oig
manipalatis and trsfer
The Shesm
abshoesn fr Luerking uth shgminq data.
A steam an abset )
iokface for coking
Accesaina streans constheamE
Aoonteosi
aTm ient e can
hge aNut ah memag before paceing.
fä.crebe hream C.
ob Are boh,con ad andia dats
QH fplain promiles io fsa aith example.
kt () romisei are a Luy to implemeot ayncton
aypchnys
Programming in Joeot Cs&al8a calied.asEcASipts.
APromis ack oa capkape fr kukie elese
S) Letg explain coith gnethor
anowelame onine.
Aotou
Bi0lou crder m
Alter apur drder (s plbced you meNe aript
of order.
ATht recipt is frome that ke Order
cotllbe delivered tuyoue
D The reipt iao dhcabalder fr fetirs
qlue mmely
mmely te camee
fomi'sel wsedip dayeript for aynnoul
pgning for ey Jauqsanpt use calbgcki byt
ther is apoblem usng caqllbrk uwbich is a Ramia
S6 Promíse. ceill sirnphy aveid al! te
usin4 tbe
problemi gociatedcith thecallbcka
ES6 omiges
Aledt
Refecked
Ponaing
Seted
Lisener
Promie
states Pronéseain fG6
DATE
Need of Promiseg,
O The allbacks
great cten detlng with
OBt ctbile devebping.ueb pplioton ubere yau
have a otof ode, call bgcks an be yeat bouble.
Tn ainple. cuods, hauin_muliple. callbela
in
ig code ingeses the camplty ofthe code in
Lerns o
Lother em
meadablityeiecutabili ky,and man
This exesaive. nesting of call bacla is often
terned Caltbak Hell.
Erample g- Callbck Helle
faX, fncion )
F3cy, functon Ca)
30
AA Dame bggets sa Pronile. is elther kapbor
bxoken
atea af Preseli
aAledi- Action melakd to promise aICCee ded.
nejeceds- Aetior related to prome failed. 7et
a pendingí- ronise is ail
Hll penaínq or notgejeckd.
seltted Promise hms been Ifilled or gejecked.
Anta
const pooi3e. =neco.
Arornise (resole, mejecked)e>. );
PAGE lo
DATE
ARROW funcion in ES6:
Ans )ES6 Arro Anctions enable u9 to erite funcion
ith npler gad shorter syrkox &mnake cade nore
readable. and ogaoiSed
Am0 fuctto cg provides ore precise
approch to contng Java Seápt Funchioma.
0re fnetions cuithmut a_pam8 Qnd not bound hyañ
ideniAen.
4) fmw Aincons do pob rehirn
he funchon
an value
Eeyeierd.The
and con
ari
be declared cutthous
'also clled Laobda fochhns.
GAtrro0
G finciong do rot have te potntupe poper
ty like hiaoroe ota ,or Super.
Aeus functiong Cant be used esith the peco ee
tord ond a cantreuctors
rhingla Atgumagti
letfunchon nome =
angumenti=)
exiregaen.
far muliple Argumeaka
let tunchon mes
Cargumenb, angument,))erpresaion.
This ode USes the tadibonal a Ot
fin cion,&
delining
II Normal Aicion or mulipliation of tuo no
fun clionmulipl Casb)
en
3
Qnsole .log Cmul biply C3, 5));
Output- 15
bBelo) code usea Arreo fincbon o perfom
multiplicatisn in single line.
JLArrow Auncten or authplpng oo noS
value = (a,b) = ab
onsole tg Cvalue C3, 5));
Autpusi- 15
culth ul Bple lines
Arouw fuocbiona
nutnber (a,b)e>£
retn (a+b)*c:
conscle.log(number (2, 9));
Qutputi- 25.
ArroDfocion eith n0 pargmeters.
const sting= () y "bold f2;
conaale loCsting5 Autpubi Cfaretén: sting
1fCmA Soript ia Lroderrackedlfome Srigt is trrceraad
Seriptig
deck ,gge
languoge aporificolir
definediotenaHoglThe
aipirg angunge speitinim
2.Tt cUO in boducedin 9ocA
neeo priccibye dok
Supports painitiye dotr GuppotS
typeg are cting,IO, nutl ype'symbol'for uciaue valuek
4 De fined byuing vaL he
letand onc
s Ha a laner perfomonte a t hai a hiaber pafmanlt.
sobjeet manipulatin id ime-Cbjectmacipulahsn is lasa
conumlg ns-can9lirtáng
1Fincin &Tehrn kagord are Ao amosfochon isanec
LJed todefioe a fincion feohte inbredCad in Ag6
B Praidealorge ronge of LProvides a less ranàe af
coMmuniby han £G6 commuoity than f5
QeÉ)Nodeja prngram for.
demejs
const fs=equie s);
II1-Creahe aneu) Aleand add data into it
fs. m befile ChoelData.bt,Thie ia iai Hal a te for
hotel mnaogement ystem2, Cerr):)L
Rle cheated aod date cote):,
cohsale. log
l2. Bpnend moe dato
to aae
fle at endafeaistig
fseappendAle Chotel Databat,InAdditiona! hobel
beoking data appended', (err)=>
ieer) Ehre;
console. leg ('Additiönaf data appended:
R.
Ig.Bead Gle dat cuithauk geting bufc data
fsneadFle ('hotelata.bt,tf-sCemt, data)
ifCerr) thoco er
cenole leg Ale(contentea&):
conaole. lo Cdata),
4.Rename he file.
fs.rename ('hotelDatasbt,boking Oatasbt(en)
ifterr) hree) err.
eonele.leg (Rlerengmed);
W5. Dele be the file.
fs.unlink(bookirgala.btl, Cerr)-)
ifer) Ehrew errj
congale «log ('File deletzd'):
3):
DAYE
rite a prognin Reach15 to paint"Hella harld'agbrusk
Pxognn
import feact from'react';
imsrt Reactpom fom 'react-dom':
funcion Hellolorldot
retern
cdiw
Lh4>Hello, lWorldl4Jb1>
4/div
ReactDor.render CeHe lio lbdexrid/, doatroentaqetflemeotytd('not)
B) Step-by-Glep Prooesa to Greate'Hello dorldApp in RecttT3.
1Instal Create Aeqct Appi
Run npx create-reach-app hello-world-app to
Gcaffalda React qpplication stucture
bash
cd hello-twordd-app
App Compolent in Appjsi
Z
.
Madif
Open'App.jo' and re place ita content euitbo
'Hello orla
simple "Hel
javascriph
funcion App
h1>
) worldlcn4
return Hello,
expot defult app:
4Rus the Applicatin
bash
npm gbrt
• Openg app in bcal gerver ChHp:11 localhst:9ood]=
disploying "Helle,
sarla
5 Explarakink
'Reactrender o'method renders tbe Apo
component cuhich autpute me szage in anzh4
tag n browser
Q8) TX
Argi- )The fll fom a TN Jouysoipt xNLeuhich is
an directy coite HL in Rect eitth Jaeaipt md
Rect ten defioe an inte fee
ookef
the
Simplife contigand cundeskandig
code and is alO faster G as it pe ùmnsaee
Heeo cubile enlaen.
yaiaxi
Const element =
Lhi welcome to Duba. lh4;
Chaaitedshegi
OTSX allaua coning expressin in Y can be gny
React Js ereisien ar vnble.
b) Jis faleus XMLle an d produce s Tect
elemenb.
JSX uses comelcage nteitieo for nanng HIMLattibuk
far exi tabiodex in HTML Ia used as tabTndex in Ta
a TSX make i casier to wite ordd HTL in Regct
6 19X can egiil conlert Htm toe to ect elenenis.
I is faster than megular Tava Geipb.
OOiaaantagsai
an emar íf HIML is not ceecth
TeHnL elementa qre b properly closed g4x
uill give
Obfect notation ia
stoodg for avgdeiot
drsi )1SON
in terchonge
fomat to maintoin
datn
a teybosed
gtnrture, of dato. the XmL data
echange
is
of
TsoN Teplaumenk
fomab in N. J0 like mays &ebects
strehres
3 pporta daty on server
hat cre pidl exeuted mgt
Lanqage Tndependent
ATE is also
ts.
that is_derived from
Chanchene ticg
ondwite.
TSON ís egs to read
interchan ge fmat cuhich can
6TE ia bext- based
& i9e.
any kindo data eg videoy audio
store
and 3upported byalmest
Ois light-ueiçhted
eleny language
Qol0) HTML vg XmL
HTMLCHypertex XML(exLensible Martap
Feature
marp Language) Langua qe)
Ptpa seOesigned fcdiaplay Oesiond r 3tonig &
da te
inq data in breserbrang Porttag
Tag e9.'divy','p, U sed deAned l
golf Cosina eg(2br ),
Tags
Eroor Brrvgergcon render sietles- denciment
HTML oh emOrs
Hond lina
Case Tags
Sensibvi sengiive
Exn mplesfommg ,Hyperlnk enote, note
DExolinHTP and HTTs.
Aos_i-HTTP:
OTP sthods for Huoertet TorsRy
Tronspr Prhtoal uhich is caed
The AP gmmml an he used to trer the dhta iate
m of oloin bert bpertet,audin,video, ond so on
. Cacnetnn lass Pranod Cient Sends the reguESt to Serer od
Nledio Tooensosnthi
Sbsless framra iect serVer da ngt retain onu inforra
in bs hean Variaus Yeauests and Yespense.
Dan Th
Ch tp:|yoritom Page No,
WebServer
T ARMIET
ALAMURI
RATNAMALA
10INSTITUTE OF ENGINEERING AND TECHNOLOGY
Alomuri Rotnamala (Run by Koti Vidya Charitable Trust)
Ad Techrlogy
hsta dEngnceing
(A Hindi Linguistic Minority institute)
Data Gu ch ga o User p9ssad and user ID,is visibe
toanuone
HTTPa: Prancal sears
HTIPs slands for Hùperhext Transfr
ncnybion and dectyptton.
Aucb:as edit 'aYd detalsi hankar Ct infmoonek
The prstocol aža asymmebie apotaaraphy
public ke amd prvnte ke.
-aGeckre d Dtth 55
metst
Data Gavelrppni
foge the P
Gectred
(https:l
webvE
CUGer
Page No,
yser TD, i5encrype to anyone.
Explan React Ts componen hkyck.
eReach Canganent lifecucle;
The ecele É keact compoent can be Oiyikd io
Each pha Page No,
hesephas
Mountiae
OThic ia the phass cuhena conponenh.is,heingcreatd and
nserste d into the
canatauehox):- alied before the campantt is ounjed
used to iaiahzé atade & bind event
hane
qetDeivedStatefomPrega );
9Invoked riqht be fore
Stats based
objoct tatypdake
render)This method rehno the Ja Componenfs ÚZ.
0TPA eqired forah Regct componenta,
a aled afer he campopent fa ende re dgnd insachdinto fom
fPT cals arset4psubs caiphons
Opdating: Companens pdate, cshen therelg achange
inatte
Alga caled duing, updahs to updak ataba fompop
shoudaeponentpate)
ODeternmne uhethar a the Carna rent ghbauld zendetedalsgit
hna
e a booleon yaluecuhich can dpHmže petformance
ender )2-Re-rendexa coponet to efect tahstatah apos.
ocalled
to the
befye
DOM.
the changg fam virua 0M grt-applicd
OTtcphes iafoma tfon Ccqy SKAO l) position). befYe the
updakd
Page No,
T9 ARMIET
ALAMUR RATNAMALA
INSTITUTE OFENGINEERING AND TECHNOLOGY
(ywiie Chtiable tiist)
(AARNi LAustie Mitoity lnstitute)
Oampunt
NToeked nediately a ampaent'a
plaa er DoM nnipuhians
nmnun tighisphse is coben o conpopent a being
D
O catled igbt betore tha camponent js unmoun kd and
deshye
OLremove eVent lis te nes.
Assiqnment No:-O6 D.:
p Eplain REPL uith adímple sample
Ans-REPL:
O BEPL stands fy Readfva-Priot. loop.cuhieh s an ntve.
shell paided auith Nodes Hhgt peses sinale i of javg
aiakelysThis fate increatbe katiog debgg
andperímentahon
(B) Wging REPL:
LOReod The RFPL rds the users laput
L Fal:-The input s evaluatd Cexecuted).
APaiat The
Lop- This repeati
Stzstíng the RÉPLi
Open he taninal or ommand pompt
andAg Fater to atast the No des REPL
Ofrpmple in REpL:
sconsh qreed (name)>'Hello, $lmme?l'
nde Aned
To ths e xqnnple he RpL enluat he expeson o+2,defio
a fnction Qrert, o0d then callg the fuoco_cuith he
g.o) Explain euting in fzpran I onith an.eganal,
hoanapglka
Hon's ened palbts (uPL) çeipond to client equt.
ghauld be
bnded
by dhe
bandlersond ensrng the qpplcatton me pandi corsocti
providey qohust xoutfog coschaniso o bandle
6) This gkesit eg34 to de Ppe.otte banjes for
different epdpoin
Tnstall Bprass
9)O pen syoc termi ond mun te follouing
commond npm ingtal epres
LOHere2gan PxCmple demehahating basto
ouing
in Expresa 13:
Impot the epres poakg
C'avore):
Canat eupreis= require
ALAMURI RATNAMALA
INSTITUTE OF ENGINEERING AND
Alomuri Ratnomolo
TECHNOLOGY
(Run by Koti Vidya Charitable Trust)
(A Hindi Linguistic Minority Institute)
L Geale an instanea. of expres9S
ConstappseprB0
ene aroute far the root RL cMy')
res. seo (Helle oxld
Defne a gte_for tho "abat URL
appget cghout,Creayrea)-<
Tetsend (About Paqe
|3)
OeAne aroute ortbe"con taaueL
(on toot, Cregjnas)=21.
res.Gand Cantoct Page,
Start the. SeTVeTand lisen en port 000
const PD RT =3OO0
Lapp.listen CPORT Co=>f
conanle.lg laever ia munning anpost $lPORT
