React.JS għal manikini tal-Bidu, billi tuża l-librerija meta tikteb robots tal-kummerċ

X’inhu React JS għal manikini tal-bidu, x’inhu, tutorials, installazzjoni, dokumentazzjoni – kif tinstalla u tuża l-librerija React JS meta tikteb robots tal-kummerċ. Ħafna drabi f’reklami ta ‘impjieg għal speċjalisti tal-kompjuter, tista’ ssib rekwiżit li jgħid li għandek ħiliet fil-librerija JavaScript. Iva, u jistennew għarfien ta ‘React mhux biss mill-iżviluppaturi tas-softwer, iżda wkoll minn programmaturi li huma involuti fl-iżvilupp intern tas-sit, u mhux disinn estern. X’tip ta’ librerija hija din, x’opportunitajiet tagħti fix-xogħol, u fejn jibda jiffamiljarizza ruħu? Ejja nsemmu f’dan l-artikolu.

Librerija JavaScript – React: x’inhu

React.JS hija librerija tal-
lingwa ta ‘programmar JavaScript popolari , iffurmata min-netwerk soċjali onlajn Facebook sabiex ittejjeb u tissimplifika l-proċess ta’ żvilupp tal-qoxra esterna ta ‘siti u applikazzjonijiet – l-interface li miegħu jinteraġixxi l-utent. Il-karatteristika ewlenija tal-librerija hija l-komponenti u l-istati. Komponent huwa parti minn sett diġitali li huwa responsabbli għad-dehra ta’ ċerta parti tas-sistema li tkun qed tiġi ddisinjata.

Nota! Partijiet komponenti bħal dawn jistgħu jiġu nested.

Stat huwa ġabra tad-dejta kollha dwar id-dettalji ta’ interface, inkluż ir-rappreżentazzjoni rappreżentattiva tagħha. Bl-użu ta ‘eżempji, se nsiru nafu f’aktar dettall u b’mod ċar x’inhu dak. L-immaġni hawn taħt turi xi wħud mill-komponenti l-kbar – l-istazzjonar fuq netwerk soċjali onlajn, taqsima b’informazzjoni ġenerali u turi ritratti. Kull parti tinkludi komponenti iżgħar, li huma l-komponenti. Pereżempju, pubblikazzjoni fiha test, ritratti, l-isem tal-utent li jippubblika l-informazzjoni, eċċ. Is-sezzjoni tal-immaġni tinkludi stampi individwali, u t-taqsima tal-informazzjoni ġenerali fiha informazzjoni qasira.
Kull wieħed minn dawn il-komponenti (komponenti) għandu stat. Jiġifieri, it-taqsima b’informazzjoni ġenerali tidher differenti fuq apparati differenti, l-element “bħal” jibdel il-kulur meta jiġi ppressat u n-numru responsabbli għan-numru totali ta ‘likes; il-pubblikazzjoni, min-naħa tagħha, tista’ tqassar it-test jew tittrażmettih kollu.

Għalhekk, il-flessibilità ta ‘React.JS hija espressa – il-komponent tal-interface jinkiteb darba, u wara dan jingħata l-istati kollha possibbli.

Għaliex hija meħtieġa l-librerija React?

React.JS hija waħda mill-għażliet possibbli biex tikteb kodiċi JS jew HTML f’format konvenjenti, tifforma kopji tagħha u tagħmilha viżwali. Il-komponenti hawn huma miktuba f’lingwa ta’ sistema speċjali – JSX, li tinkludi elementi tal-lingwa ta’ programmar JavaScript u l-lingwa standardizzata tal-marka HTML.
Il-kodiċi miktub f’JSX huwa pjuttost speċifiku. Huwa importanti wkoll li l-web browser ma jkollux għalfejn jifhem din il-lingwa tas-sistema – il-kodiċi React.JS jiġi trasferit għal JS, li kwalunkwe browser jipperċepixxi mingħajr problemi. Biex tagħmel dan, dak li jinħoloq fil-librerija jgħaddi minn kompilaturi speċjalizzati (wieħed mill-aktar popolari llum huwa Babel js), li jikkonvertu kodiċijiet f’lingwi ta ‘programmar inqas magħrufa f’rappreżentazzjonijiet JavaScript.
Għall-ewwel jista ‘jidher li s-sistema ta’ użu hija estremament illoġika, iżda wara ftit tidra u tirrealizza għaliex il-mekkaniżmu huwa ddisinjat hekk. Il-librerija JavaScript għandha numru ta ‘vantaġġi qawwija:

• il-lingwa ta ‘programmar tas-sistema hija aktar faċli biex tirrikonoxxi mill-JavaScript magħruf, u konsegwentement, se tieħu bosta drabi inqas ħin biex tappoġġja l-kodiċi u telimina l-iżbalji fuqu (il-veloċità tal-kitba ta’ kodiċijiet u programmi ġodda se tiżdied kif xieraq);
• sistema konvenjenti u prattika ta ‘elementi kostitwenti hija mibnija hawn – tirrepeti partijiet tal-kodiċi li huma użati fi stadji differenti tal-kitba u fi programmi differenti, u jinbidlu wkoll skont il-kuntest;
• kull element kostitwenti huwa subordinat biss għall-istat tiegħu , għalhekk huwa aktar faċli li jiġu kkoreġuti nuqqasijiet fil-kodiċi jekk jinstab żball f’daqqa fix-xogħol tiegħu fil-prattika; mumenti skorretti jgħumu fil-wiċċ: element li jiffunzjona sew se jkompli jaħdem b’mod stabbli f’dan il-mod, sakemm, ovvjament, ma jintużax l-istat ħażin fir-rigward tiegħu.

Għalhekk, nistgħu nikkonkludu li l-librerija React.JS tista ‘tiffranka ħafna ħin, tagħmel il-kodiċi aktar speċifiku, torganizza s-sekwenza fl-ordni korretta, u terġa’ tuża blokki kbar. Dawn il-vantaġġi jagħmluha possibbli li titnaqqas l-ispiża tal-proċess tal-ħolqien ta ‘interfaces tal-utent, kif ukoll iħaffef il-ħin ta’ dan il-proċess stess. Li jkollok il-ħiliet biex tuża l-lingwa ta ‘programmar JS u HTML, titgħallem tuża s-sistema JSX huwa faċli – ftit jiem biss biex tikkontrollaha.

Nota! Huwa razzjonali li tuża l-librerija meta taħdem ma ‘proġetti kbar, meta jkun meħtieġ li tikteb numru kbir ta’ paġni dinamiċi. Sit ta ‘negozju żgħir m’għandux bżonn kumplessitajiet bħal dawn.

Irreaġixxi kors fundamentali ta’ JS minn A sa Z: https://youtu.be/GNrdg3PzpJQ

Konoxxenza għal jibdew: kunċetti bażiċi

Hello dinja!

Meta jaċċessa l-ewwel paġna tal-librerija, l-utent se jara intestatura merħba bħala eżempju żgħir – “Hello world!”.

Fundamenti tal-lingwa tas-sistema JSX

JSX hija lingwa ta ‘programmar tas-sistema, estensjoni tal-JavaScript magħruf. Jinkludi taħlita ta ‘żewġ lingwi – programmar JA u l-lingwa standardizzata ta’ markup HTML. L-iżviluppaturi jużawha biex jaġġustaw il-kunċett biex juru React eżattament kif għandha tidher l-interface tal-utent. JSX joħloq il-“partijiet” tal-librerija.

X’inhu JSX?

Il-librerija React taderixxi mal-loġika li l-essenza tar-rendi hija direttament relatata mal-loġika tal-interface tal-utent: kif jiġu pproċessati l-avvenimenti, kif l-istat jinbidel f’ċertu perjodu, u kif l-informazzjoni hija ppreparata għall-preżentazzjoni. Il-librerija JS tista ‘tintuża mingħajr il-lingwa tas-sistema tagħha, iżda numru kbir ta’ żviluppaturi jsibuha siewja minħabba ċ-ċarezza u l-konkretezza tagħha meta jaħdmu ma ‘interface tal-utent iġġenerat mill-kodiċi JavaScript. Barra minn hekk, l-estensjoni tagħmilha aktar faċli għal React biex tiġġenera notifiki ta ‘mumenti u żbalji invalidi.

Formazzjoni ta’ espressjonijiet fil-lingwa tas-sistema

JSX jippermettilek tuża kwalunkwe espressjoni JavaScript miktuba tajjeb ġewwa ċineg kaboċċi fi proċess.

JSX huwa wkoll espressjoni Ladarba l-kodiċi tas-sors ikun bytecoded, kwalunkwe espressjoni JSX tinbidel f’sejħa ta ‘funzjoni JS standard li timmira l-kategorija JavaScript. Minn dan jista ‘jinftiehem li l-estensjoni tas-sistema tal-lingwa ta’ programmar uffiċjali tista ‘tintuża ġewwa l-manwal if u għal perjodi.

JSX huwa Oġġetti L-oġġetti rappreżentati mill-estensjoni jissejħu elementi React. Jiċċaraw ir-riżultat li l-iżviluppatur irid jara fuq il-wiri. Il-librerija tagħraf dawn l-oġġetti u tużahom fil-proċess tal-ġenerazzjoni u ż-żamma tal-Mudell tal-Oġġetti tad-Dokument.

Rendiment tad-dettall

Id-dettalji huma l-ħafna elementi żgħar li jiffurmaw il-programmi React.
Id-dettalji huma l-istampa li l-iżviluppatur irid jara fl-aħħar fuq il-monitor. Meta mqabbla mal-elementi tal-Mudell tal-Oġġetti tad-Dokument, l-elementi tal-librerija huma sempliċi u ma jieħdux ħafna riżorsi. L-elementi huma l-kostitwenti tal-komponenti.

Komponenti u props

Il-komponenti jagħmluha possibbli li l-UI tinqasam f’partijiet indipendenti, li huma aktar faċli biex jaħdmu fuqhom separatament. Jistgħu jiġu kkombinati u użati diversi drabi. Fil-biċċa l-kbira, il-funzjonalità tal-komponenti hija simili għall-funzjonalità tal-lingwa ta ‘programmar JavaScript innifsu. Huma jieħdu l-informazzjoni tal-input, li tissejjaħ props, u jirritornaw elementi React li jindikaw il-mudell ta ‘żvilupp li l-iżviluppatur irid jara fuq il-monitor.

Varjetajiet ta ‘komponenti: funzjonali u ta’ klassi

Huwa eħfef li tirreferi għal komponent tal-librerija bħala funzjoni.
Il-komponenti jistgħu wkoll ikunu rappreżentati fil-format tal-klassi ES6.

Interessanti! Il-librerija React tiddefinixxi dawn iż-żewġ tipi ta ‘komponenti bħala simili.

props

Props huma oġġetti immutabbli li jinqraw biss. Għalhekk, komponent m’għandux jikteb xejn fir-riffieda tiegħu, irrispettivament minn liema tip jappartjeni għalih.

Stat u ċiklu tal-ħajja

L-ewwel, ejja nsemmu kif tapplika sew l-istat fuq ix-xogħol. Hemm tliet affarijiet importanti li għandek tkun taf dwar l-istat tal-komponent:

1. Tibdilx l-istat direttament, uża l-metodu setState. Ftakar li l-unika żona fejn tista ‘tbiddel l-istat direttament hija l-kostruttur.
2. L-aġġornamenti tal-istat jistgħu ma jkunux sinkroniċi.
3. Il-fluss ta ‘informazzjoni għandu direzzjoni waħda. Fil-kostruzzjoni tal-komponenti, ħadd minnhom ma jaf jekk l-istat huwiex assenjat għal komponent ieħor. Ma jimpurtax kif dan jew dak l-element funzjonali indipendenti ġie ffurmat – bl-użu ta ‘għodda funzjonali jew ta’ klassifikazzjoni. Dan jissejjaħ fluss tad-dejta “downstream”. Stat huwa dejjem definit għal xi element, u l-assoċjazzjonijiet strutturali ta ‘dan l-istat jistgħu jaffettwaw biss partijiet li jinsabu “taħt” fl-ordni ġerarkika.

Tipikament, l-istat jissejjaħ “lokali”, “intern”, jew moħbi. Huwa viżibbli biss għall-element funzjonali nnifsu u inviżibbli għal partijiet oħra ta ‘React. Fil-programmi tal-librerija, jekk element funzjonali indipendenti huwiex mogħni b’ċertu stat jew le huwa żvilupp intern ta ‘din il-parti, li jista’ jinbidel maż-żmien. Huwa wkoll interessanti li fix-xogħol tista ‘tgħaqqad komponenti bi u mingħajr stat.

Analiżi tal-avveniment

Il-proċess tal-parsing tal-avvenimenti fil-komponenti React huwa simili għall-immaniġġjar tal-avvenimenti fl-elementi tal-mudell tal-oġġett tad-dokument. Madankollu, hemm diversi karatteristiċi li jiddistingwuhom minn xulxin:

1. L-avvenimenti fil-librerija JavaScript huma msemmija fi stil differenti minn dak standard.
2. Bl-użu tal-Lingwa ta’ Programmazzjoni Estiża tas-Sistema, l-iżviluppatur jgħaddi subrutina bħala handler tal-avvenimenti minflok string.

Rendiment kondizzjonali ta’ elementi

Il-librerija JavaScript tagħmilha possibbli li tkisser il-loġika tal-iżvilupp ta ‘elementi f’komponenti indipendenti. Jistgħu jintwerew għal wiri ġenerali jew moħbija, skont liema stat huma mogħnija bih bħalissa. Ir-rendiment kondizzjonali ta’ elementi jaħdem fuq l-istess prinċipju bħall-espressjonijiet kondizzjonali bbażati fuq il-lingwa ta’ programmar JavaScript. Xi drabi jiġri li l-librerija teħtieġ spjegazzjoni ta ‘kif l-istat jaffettwa l-ħabi jew ir-rendiment ta’ xi elementi. Hawnhekk huwa aktar loġiku li tuża helper JS kondizzjonali jew espressjonijiet simili għal if.

Komponenti li jinbidlu

Elementi tal-librerija React jistgħu jiġu miżjuda mal-varjabbli. Din hija soluzzjoni prattika meta xi kundizzjoni tindika jekk xi parti tal-komponent għandhiex tinġibed, jew ma tagħmilx sens, filwaqt li l-bqija tal-parti tibqa ‘mhux mibdula.

Listi u Ċwievet

Din it-taqsima tinkludi diversi komponenti:

1. Tpinġija ta ‘ elementi multipli . L-utent jista ‘jifforma sett ta’ elementi u jintegrah fil-lingwa ta ‘programmar tas-sistema billi juża ċineg kaboċċi.
2. Lista elementari ta’ elementi . Ħafna drabi, l-utenti u l-iżviluppaturi jaġġustaw il-listi direttament fi ħdan parti komponent.

Ċwievet

Ċavetta fil-librerija React JavaScript tindika għodda speċjalizzata li trid tiddaħħal meta tiġġenera lista ta ‘komponenti. Iċ-ċwievet jgħinu lill-librerija JavaScript biex tidentifika liema oġġetti ġew aġġustati, miżjuda jew imneħħija. Huwa importanti li timmarkahom sabiex React tkun tista’ tikkorrelata l-komponenti tad-dejta strutturali wara li jkun għadda ċertu ammont ta ‘żmien.

Formoli

Fil-librerija JS, l-elementi tal-lingwa tal-markup standardizzati jaħdmu ftit differenti mill-komponenti tal-mudell tal-oġġett tad-dokument, minħabba li l-elementi tal-forma inizjalment għandhom stat moħbi.

Oġġetti Immaniġġjati

F’lingwa ta’ markup standardizzata, forom bħal input , select , textarea għandhom tendenza li jżommu l-istat tagħhom stess u jaġġornawh meta l-iżviluppatur idaħħal informazzjoni ġdida. L-istat React.js dejjem jiddefinixxi l-valur tal-oqsma ta ‘input f’element ta’ kompożizzjoni ġestit. Għalkemm dan jindika li l-utent irid jikteb ftit aktar mill-kodiċi oriġinali mogħti, issa huwa possibbli li jgħaddi dan il-valur lil partijiet oħra tal-interface tal-utent.

Iż-żieda tal-istat

L-irfigħ tal-istat huwa mudell standardizzat li kull żviluppatur għandu jkun konxju minnu u jkun kapaċi japplika fil-proċess tax-xogħol. L-użu tiegħu se jelimina mudelli ta ‘ġestjoni tal-istat kumplessi u ġeneralment inutli.

Għaliex huwa tant meħtieġ li jiġi kkontrollat ​​iż-żieda tal-istat?

Jgħollu l-istat għal-livell tal-komponenti tal-passat għal dawk il-partijiet li jeħtieġu dan huwa meħtieġ sabiex l-elementi kollha jkunu jistgħu jipparteċipaw fl-istat. Livell stabbli ta ‘stat jagħmilha aktar faċli biex jitqassam fost il-komponenti kollha li jiddependu fuqu.

Kompożizzjoni vs Wirt

React.js jinkludi mudell ta ‘kompożizzjoni b’saħħtu, għalhekk huwa rakkomandat li tuża l-proċess ta’ bini sħiħ minn partijiet minflok wirt biex terġa ‘tintuża kodiċi miktub qabel bejn l-elementi. Għalhekk, props u l-abbiltà li tinħoloq kompożizzjoni sħiħa waħda minn partijiet komponenti, jipprovdu lill-iżviluppatur bil-flessibilità meħtieġa biex joħloq il-qoxra u l-imġieba tal-element b’mod speċifiku u sikur.

Tifkira! Partijiet komponenti jistgħu jieħdu props mhux relatati, inklużi partijiet elementari li jiffurmaw libreriji jew funzjonijiet.

Fil-każ li għandek bżonn tuża funzjoni bla ħarsa biex taħdem ma ‘komponenti għat-tieni jew it-tielet darba, iġbedha f’modulu JS separat. Mexxiha f’komponent u uża l-funzjoni ġġenerata mingħajr aktar espansjoni. React jew Vue jew Angular, x’tagħżel: https://youtu.be/Nm8GpLCAgwk

React.js Prinċipji

Il-filosofija kollha tal-librerija JavaScript hija moħbija fil-gwida React. Jidher li dan huwa twil u mhux ta ‘importanza daqshekk kbira, madankollu, ħafna utenti jsostnu li wara l-qari kollox waqa’ f’posthom. Id-dokumentazzjoni hija pjuttost antika, iżda għadha ta ‘valur u rilevanza kbira –
https://ru.reactjs.org/docs/thinking-in-react.html . React js tutorja https://ru.reactjs.org/tutorial/tutorial.html

Funzjonalità tal-librerija React.js

Bl-użu tal-librerija JavaScript, l-utent ikollu l-opportunità li jagħti l-attenzjoni kollha tiegħu direttament lill-proċess ta ‘żvilupp tal-UI u l-komponenti tal-applikazzjoni, l-inqas distratt mill-formazzjoni u n-nuqqasijiet possibbli tal-kodiċi bil-miktub. Il-librerija tippermettilek tiżviluppa programmi aktar malajr, tagħmilha aktar faċli biex tikkonfigura u teditja l-komponenti u l-proċess tal-proġett kollu kollu kemm hu. Għalhekk, React.js fih elementi responsabbli għall-komunikazzjoni fin-netwerk globali, UI, kontroll tal-istat tal-programm u l-abbiltà li ssolvi kwistjonijiet kumplessi oħra. Il-librerija għandha wkoll il-karatteristiċi funzjonali li ġejjin:

1. Prattiċità . React.js huwa disponibbli f’format minifikat. Dan il-pakkett kompatt m’għandux għalfejn jiġi kkonfigurat b’mod ċar. Diġà tinkludi karatteristika ta ‘qsim tal-kodiċi li tnaqqas iż-żmien li tieħu biex tiftaħ il-verżjoni tal-browser tas-sit, peress li din l-għażla tipprevjeni lill-komponenti milli jirrendu fl-istess ħin.
2. Ekosistema ppumpjata u konformità . Numru kbir ta ‘għodod huma disponibbli fil-librerija, appoġġjati minn siti oħra, li jippermetti lill-utent jiżviluppa programmi kumplessi ġodda għal kwalunkwe skop.
3. Funzjonalità sħiħa . Il-vantaġġ ewlieni tal-librerija JavaScript huwa li l-verżjonijiet ġodda kollha tal-pjattaforma jissodisfaw ir-rekwiżiti ta ‘dawk qodma, sabiex tkun tista’ tuża kemm il-verżjoni l-qadima kif ukoll dik aġġornata, kollha kemm huma appoġġjati u huma rilevanti sal-lum. Verżjonijiet rilaxxati qabel ma jsirux skaduti wara l-aħħar aġġornamenti.

Użu prattiku

Fil-paġna ewlenija tal-librerija, fl-istruzzjonijiet għall-utenti, hemm bosta eżempji illustrattivi tal-użu ta’ React fil-prattika. Tista’ tikkoreġihom manwalment u tipprova tmexxihom. Anke jekk inti utent ġdid u ma tifhimx l-essenza u l-loġika tal-librerija, aġġusta l-kodiċi kif tixtieq tiegħek u ara r-riżultat.

Applikazzjoni prattika ta ‘React meta tikteb robots tal-kummerċ f’JavaScript

Huwa importanti li tirrealizza li żviluppatur ma jipprogrammax JS, iżda jikteb skripts (skripts). għalhekk, bl-użu tal-librerija, żviluppatur jista ‘jikteb kodiċi għal robot kummerċjali sussegwenti użat għal skopijiet ta’ kummerċ, u jkompli wkoll jiddisinja d-dehra tiegħu abbażi ta ‘din il-pjattaforma. Fil-fatt, robot tal-kummerċ għall-kummerċ huwa wkoll applikazzjoni, li numru kbir tagħha qed jiġu żviluppati bl-użu ta ‘React.js. Madankollu, xi funzjonijiet u l-parti interna tal-bot xorta se jkollhom isiru fuq siti oħra li jipprovdu għodod adattati għal dan.

GitHub u React.js

GitHub hija pjattaforma li tospita l-verżjonijiet kollha tal-proġetti. L-utent jgħaqqad l-hosting, jgħaddi mill-proċedura ta ‘reġistrazzjoni fuq il-websajt uffiċjali ta’ GitHub, u mbagħad joħloq repożitorju onlajn fejn jittrasferixxi l-fajls kollha minn Git.
Git huwa s-servizz tal-kontroll tal-verżjoni tal-proġett l-aktar popolari u rilevanti llum, u GitHub huwa repożitorju remot tal-kodiċi.

Referenza! Dawk l-utenti biss li rċevew il-link xieraq bil-permess għandhom aċċess għall-editjar u t-tniżżil ta’ fajls.

Dokumentazzjoni

It-tutorials u l-materjali aġġornati kollha dwar il-librerija JavaScript huma aġġornati bl-aħħar aġġornament. L-iżviluppaturi wkoll jiġbru u jpoġġu għall-qari ġenerali verżjonijiet qodma tad-dokumentazzjoni, mibgħuta fuq paġna separata tal-librerija. Għalhekk, se jkun aktar faċli għall-jibdew biex jaħtfu l-ħiliet tal-ġestjoni tas-sit: kemm materjal antik kif ukoll ġdid – kollox jinsab hawn, l-aċċess huwa b’xejn għal kulħadd.

Nota! Tinsiex taqra l-manwali. Mill-inqas agħti ħarsa – diġà ħafna minn dak li deher inkomprensibbli se jidħol fis-seħħ.

Il-librerija React hija pjattaforma popolari u rilevanti llum. Il-versatilità tagħha tippermetti lill-iżviluppaturi jagħmlu proġetti ta ‘kwalità aħjar u f’inqas ħin. Barra minn hekk, li tkun taf il-pjattaforma u li jkollha l-ħiliet biex tużaha tagħmel speċjalista aktar fid-domanda fis-suq tax-xogħol.