Söwda robotlary ýazylanda kitaphanany ulanyp, täze başlaýanlar üçin React.JS

Täze başlaýanlar üçin React JS näme, okuw sapaklary, gurnama, resminamalar – söwda robotlary ýazylanda React JS kitaphanasyny nädip gurmaly we ulanmaly. Kompýuter hünärmenleri üçin iş mahabatlarynda köplenç JavaScript kitaphanasynda başarnygyňyz bar diýlen talap tapyp bilersiňiz. Hawa, olar diňe bir programma üpjünçiligini däl, eýsem daşarky dizaýn däl-de, sahypanyň içerki ösüşi bilen meşgullanýan programmistlerdenem React baradaky bilimlere garaşýarlar. Bu nähili kitaphana, işde nähili mümkinçilikler berýär we täze öwrenen adam nireden tanap başlaýar? Geliň, şu makalada düşündireliň.

JavaScript kitaphanasy – Reaksiýa: bu näme

React.JS , saýtlaryň we amaly programmalaryň daşarky gabygyny – ulanyjynyň özara gatnaşygy bolan interfeýsini gowulandyrmak we ýönekeýleşdirmek üçin onlaýn sosial ulgam Facebook tarapyndan döredilen meşhur JavaScript programmirleme diliniň kitaphanasydyr
. Kitaphananyň esasy aýratynlygy komponentler we ştatlardyr. Komponent, dizaýn edilýän ulgamyň belli bir böleginiň peýda bolmagy üçin jogapkär sanly toplumyň bir bölegidir.

Bellik! Şeýle komponent bölekleri höwürtge döredip biler.

Döwlet, interfeýsiň jikme-jiklikleri, şol sanda wekilçilikli görkezilişi ýaly ähli maglumatlaryň ýygyndysydyr. Mysallary ulanyp, nämedigini has jikme-jik we has anyk öwreneris. Aşakdaky suratda käbir möhüm komponentler görkezilýär – onlaýn sosial tora ýerleşdirmek, umumy maglumatly bölüm we suratlar görkezilýär. Her bölek bölekler bolan kiçi bölekleri öz içine alýar. Mysal üçin, neşirde tekst, fotosuratlar, maglumatlary neşir edýän ulanyjynyň ady we ş.m. Surat bölüminde aýratyn suratlar bar, umumy maglumat bölüminde gysga maglumatlar bar.
Bu komponentleriň (komponentleriň) hersiniň ýagdaýy bar. Generalagny, umumy maglumatly bölüm dürli enjamlarda dürli görüner, “halanýan” element basylanda reňkini üýtgeder we halanýanlaryň umumy sanyna jogap berýän san; neşir öz gezeginde teksti gysgaldyp ýa-da doly iberip biler.

Şeýlelik bilen, React.JS-iň çeýeligi aňladylýar – interfeýs komponenti bir gezek ýazylýar we şondan soň ähli mümkin bolan ýagdaýlar berilýär.

React kitaphanasy näme üçin zerur?

React.JS amatly formatda JS ýa-da HTML koduny ýazmak, nusgalaryny döretmek we wizual etmek üçin mümkin bolan wariantlardan biridir. Bu ýerdäki komponentler JavaScript programmirleme diliniň elementlerini we standartlaşdyrylan HTML bellik dilini öz içine alýan ýörite ulgam dilinde – JSX bilen ýazylýar.
JSX-da ýazylan kod gaty anyk. Şeýle hem, web brauzeriniň bu ulgam diline düşünmeli däldigi möhümdir – React.JS kody islendik brauzeriň kynçylyksyz kabul edýän JS-e geçirilmegi. Munuň üçin kitaphanada döredilen zat, has az tanalýan programma dillerindäki kodlary JavaScript wekilçiligine öwürýän ýöriteleşdirilen düzüjilerden (häzirki döwürde iň meşhurlaryndan biri Babel js) geçýär.
Ilki bilen ulanyş ulgamy diýseň manysyz ýaly bolup görünýär, ýöne birneme wagt geçenden soň öwrenişip, mehanizmiň näme üçin beýle döredilendigine düşünýärsiňiz. JavaScript kitaphanasynyň birnäçe güýçli artykmaçlygy bar:

• ulgam programmirleme dilini belli JavaScript-den tanamak has aňsat we şonuň üçin kody goldamak we ondaky ýalňyşlyklary ýok etmek üçin birnäçe esse az wagt gerek bolar (täze kodlary we programmalary ýazmagyň tizligi şoňa görä ýokarlanar);
• dörediji elementleriň amatly we amaly ulgamy bu ýerde gurulýar – koduň dürli ýazuw tapgyrlarynda we dürli programmalarda ulanylýan böleklerini gaýtalamak, şeýle hem kontekste baglylykda üýtgemegi;
• her bir element diňe öz ýagdaýyna tabyn , şonuň üçin işinde birden ýalňyşlyk tapylsa koddaky kemçilikleri düzetmek has aňsat; nädogry pursatlar ýüzüp geçýär: dogry işleýän element bu re inimde durnukly işlemegini dowam etdirer, elbetde, oňa degişlilikde nädogry ýagdaý ulanylmasa.

Şeýlelikde, React.JS kitaphanasy köp wagt tygşytlap, kody has anyklaşdyryp, yzygiderliligi dogry tertipläp we uly bloklary gaýtadan ulanyp biler diýen netijä gelip bileris. Bu artykmaçlyklar ulanyjy interfeýslerini döretmek prosesiniň bahasyny azaltmaga, şeýle hem bu prosesiň wagtyny çaltlaşdyrmaga mümkinçilik berýär. JS we HTML programmirleme dilini ulanmak endiklerine eýe bolmak, JSX ulgamyny ulanmagy öwrenmek aňsat – ony özleşdirmek üçin birnäçe gün.

Bellik! Uly taslamalar bilen işleýän wagtyňyz, köp sanly dinamiki sahypa ýazmak zerur bolanda kitaphanany ulanmak paýhaslydyr. Kiçijik bir iş sahypasyna beýle çylşyrymlylyk gerek däl.

JS-iň esasy kursuny A-dan Z-a çenli reaksiýa beriň: https://youtu.be/GNrdg3PzpJQ

Täze başlanlar üçin tanyşlyk: esasy düşünjeler

Salam Dünýä!

Kitaphananyň birinji sahypasyna gireniňizde, ulanyjy kiçijik mysal hökmünde “Salam dünýä!” Atly hoş sözbaşy görer.

JSX ulgam diliniň esaslary

JSX ulgamlaýyn programma dili, belli JavaScript-iň giňelmesi. Iki diliň utgaşmasyny öz içine alýar – JA programmirleme we standart HTML bellik dili. Döredijiler, ulanyjy interfeýsiniň nähili bolmalydygyny takyk görkezmek üçin düşünjäni sazlamak üçin ulanýarlar. JSX kitaphananyň “böleklerini” döredýär.

JSX näme?

“React” kitaphanasy görkezişiň düýp manysynyň ulanyjy interfeýsiniň logikasy bilen gönüden-göni baglanyşyklydygyny görkezýär: wakalaryň nähili işlenýändigi, döwletiň belli bir döwürde üýtgemegi we maglumatyň görkezilişine nähili taýýarlanýandygy. JS kitaphanasyny ulgam dili bolmazdan ulanyp bolýar, ýöne JavaScript kodundan döredilen ulanyjy interfeýsi bilen işlän mahaly köp sanly işläp düzüjisi, aýdyňlygy we takyklygy sebäpli ony gymmatly hasaplaýar. Mundan başga-da, giňeltme, React-a nädogry pursat we ýalňyşlyk habarnamalaryny döretmegi aňsatlaşdyrýar.

Ulgam dilinde aňlatmalaryň emele gelmegi

JSX, bir prosesde egrilen ýaýlaryň içindäki islendik gowy ýazylan JavaScript aňlatmalaryny ulanmaga mümkinçilik berýär.

JSX şeýle hem aňlatma Çeşme kody kodlanansoň, islendik JSX aňlatmasy JavaScript kategoriýasyny nyşana alýan adaty JS funksiýa çagyryşyna öwrülýär. Bulardan resmi programmirleme diliniň ulgam giňelmesiniň gollanma we döwür üçin ulanylyp bilinjekdigine düşünmek bolýar.

JSX obýektler Giňeldiş bilen görkezilen obýektlere React elementleri diýilýär. Öndürijiniň ekranda görmek isleýän netijesini aýdyňlaşdyrýarlar. Kitaphana bu obýektleri tanadýar we Resminamanyň obýekt modelini döretmek we goldamak işinde ulanýar.

Jikme-jik görkezme

Jikme-jiklikler “React” programmalaryny düzýän köp sanly gurluşyk bloklarydyr.
Jikme-jiklikler, taýýarlaýjynyň ahyrynda monitorda görmek isleýän suratydyr. Resminamanyň obýekt modeli elementleri bilen deňeşdirilende, kitaphananyň elementleri ýönekeý we köp çeşme sarp etmeýär. Elementler komponentleriň düzüm bölekleridir.

Komponentler we reklamalar

Komponentler UI-ni aýratyn böleklere bölmek mümkinçiligini berýär, aýratyn işlemek has aňsat. Olary birleşdirip, birnäçe gezek ulanyp bolýar. Komponentleriň işleýşi, köplenç JavaScript programmirleme diliniň işleýşine meňzeýär. Teklip diýilýän giriş maglumatlary alýarlar we işläp düzüjiniň monitorda görmek isleýän ösüş modelini görkezýän React elementlerini yzyna alýarlar.

Komponentleriň dürli görnüşleri: funksional we synp

Funksiýa hökmünde kitaphananyň düzümine ýüzlenmek iň aňsat.
Komponentleri ES6 synp görnüşinde hem görkezip bolýar.

Gyzykly! React kitaphanasy bu iki görnüşi birmeňzeş kesgitleýär.

reklamalar

Teklipler diňe okalýan üýtgewsiz zatlar. Şonuň üçin bir komponent haýsy görnüşe degişlidigine garamazdan reklamalaryna hiç zat ýazmaly däldir.

Döwlet we ýaşaýyş sikli

Ilki bilen, işde döwleti nädip dogry ulanmalydygyny öwreneliň. Komponentleriň ýagdaýy barada bilmeli üç möhüm zat bar:

1. Döwleti gönüden-göni üýtgetmäň, setState usulyny ulanyň. Döwleti gönüden-göni üýtgedip boljak ýeke-täk meýdanyň konstruktordygyny ýadyňyzdan çykarmaň.
2. Döwlet täzelenmeleri sinhron bolup bilmez.
3. Maglumat akymynyň bir ugry bar. Komponent gurluşygynda, olaryň hiç biri döwletiň başga bir komponente bellenendigini ýa-da ýokdugyny bilmeýär. Bu ýa-da şol garaşsyz funksional elementiň nädip emele gelendigi möhüm däl – funksional ýa-da klassifikasiýa guralyny ulanmak. Muňa “aşak akym” maglumat akymy diýilýär. Döwlet hemişe käbir elementler üçin kesgitlenýär we bu döwletiň gurluş birleşikleri diňe iýerarhiki tertipde “aşakda” ýerleşýän böleklere täsir edip biler.

Adatça, döwlete “ýerli”, “içerki” ýa-da gizlin diýilýär. Diňe işleýän elementiň özüne görünýär we React-yň beýleki böleklerine görünmeýär. Kitaphana programmalarynda, garaşsyz funksional elementiň belli bir döwlete eýe bolandygyna ýa-da ýokdugyna, wagtyň geçmegi bilen üýtgäp bilýän bu bölegiň içerki ösüşi. Şeýle hem eserde komponentleri döwlet bilen we birleşdirip bilersiňiz.

Waka derňewi

Wakalary “React” komponentlerinde derňemek prosesi resminama obýekt model elementlerinde bolup geçen wakalara meňzeýär. Şeýle-de bolsa, olary biri-birinden tapawutlandyrýan birnäçe aýratynlyk bar:

1. JavaScript kitaphanasyndaky wakalar adaty görnüşden tapawutly stilde atlandyrylýar.
2. Ulgam giňeldilen programmirleme dilini ulanyp, dörediji setiriň ýerine hadysany dolandyryjy hökmünde subroutini geçirýär.

Elementleriň şertli görkezilmegi

JavaScript kitaphanasy ösýän elementleriň logikasyny garaşsyz komponentlere bölmäge mümkinçilik berýär. Olary häzirki wagtda haýsy ýagdaýa baglydygyna baglylykda umumy görkezmek ýa-da gizlemek üçin görkezip bolýar. Elementleriň şertli görkezilmegi JavaScript programmirleme diline esaslanýan şertli aňlatmalar bilen birmeňzeş işleýär. Käwagt kitaphanada döwletiň käbir elementleriň gizlenmegine ýa-da görkezilmegine nähili täsir edýändigi barada düşündiriş talap edilýär. Bu ýerde şertli JS kömekçisini ýa-da şuňa meňzeş aňlatmalary ulanmak has mantykly.

Komponentleri üýtgetmek

Reaktiw kitaphana elementlerini üýtgeýänlere goşup bolýar. Käbir şert komponentiň bir böleginiň çyzylmalydygyny ýa-da manysynyň ýokdugyny görkezýän mahaly amaly çözgüt, galan bölegi üýtgemän galýar.

Sanawlar we açarlar

Bu bölüm birnäçe komponentleri öz içine alýar:

1. Birnäçe elementi çyzmak . Ulanyjy elementleriň toplumyny emele getirip, egri ýaýlary ulanyp, ulgam programmirleme diline ornaşdyryp biler.
2. Elementleriň başlangyç sanawy . Köplenç ulanyjylar we işläp düzüjiler sanawlary gönüden-göni komponent böleginde düzýärler.

Düwmeler

React JavaScript kitaphanasyndaky açar, komponentleriň sanawy döredilende girizilmeli ýöriteleşdirilen guraly aňladýar. Düwmeler JavaScript kitaphanasyna haýsy elementleriň düzedilendigini, goşulandygyny ýa-da aýrylandygyny kesgitlemäge kömek edýär. React belli bir wagt geçenden soň gurluş maglumatlarynyň böleklerini baglanyşdyryp biler ýaly bellemek möhümdir.

Formalar

JS kitaphanasynda standartlaşdyrylan bellik dil elementleri resminamanyň obýekt modeliniň böleklerinden birneme üýtgeşik işleýär, sebäbi forma elementleri başda gizlin ýagdaýda bolýar.

Dolandyrylýan zatlar

Standartlaşdyrylan bellik dilinde giriş, saýlamak, tekst ýaly görnüşler öz ýagdaýyny saklamaga we dörediji täze maglumatlary girizeninde täzelenmäge ýykgyn edýär. React.js ýagdaýy dolandyrylýan kompozisiýa elementindäki giriş meýdanlarynyň bahasyny hemişe kesgitleýär. Bu, ulanyjynyň berlen koddan has az ýazmalydygyny görkezýän bolsa-da, indi bu bahany ulanyjy interfeýsiniň beýleki böleklerine geçirmek mümkin.

Döwletiň ösmegi

Döwlet götermek, her bir işläp düzüjiniň bilmeli we iş döwründe ulanyp bilýän standartlaşdyrylan şablon. Ony ulanmak çylşyrymly we adatça peýdasyz döwlet dolandyryş usullaryny ýok eder.

Döwletiň ösmegine gözegçilik etmek näme üçin beýle zerur?

Statehli elementleriň döwlete gatnaşyp bilmegi üçin zerur bolan şol bölekler üçin döwleti öňki komponentleriň derejesine çykarmak zerurdyr. Durnukly döwlet derejesi, oňa bil baglaýan ähli komponentleriň arasynda paýlamagy aňsatlaşdyrar.

Kompozisiýa vs Miras

React.js güýçli kompozisiýa modelini öz içine alýar, şonuň üçin elementleriň arasynda öň ýazylan kody gaýtadan ulanmak üçin mirasyň ýerine böleklerden bölek gurmak prosesini ulanmak maslahat berilýär. Şeýlelik bilen, reklamalar we komponent böleklerinden ýekeje kompozisiýa döretmek ukyby, elementi gabygyny we özüni alyp barşyny belli we ygtybarly usulda döretmek üçin zerur çeýeligi üpjün edijä üpjün edýär.

Inderatlatma! Komponent bölekleri baglanyşyksyz reklamalary, şol sanda kitaphanalary ýa-da funksiýalary düzýän başlangyç bölekleri alyp biler.

Komponentler bilen ikinji ýa-da üçünji gezek işlemek üçin görünmeýän funksiýany ulanmaly bolsaňyz, ony aýratyn JS modulyna çykaryň. Bir komponente geçiriň we döredilen funksiýany hasam giňeltmän ulanyň. Reaksiýa ýa-da Vue ýa-da burç, näme saýlamaly: https://youtu.be/Nm8GpLCAgwk

React.js iplesörelgeleri

JavaScript kitaphanasynyň tutuş pelsepesi React gollanmasynda gizlenendir. Bu uzyn we beýle möhüm däl ýaly bolup görünýär, ýöne köp ulanyjylar hemme zady okandan soň ýerbe-ýer bolandygyny öňe sürýärler. Resminamalar gaty köne, ýöne şonda-da möhüm ähmiýete eýe –
https://ru.reactjs.org/docs/thinking-in-react.html . Js gollanmasyna reaksiýa beriň https://ru.reactjs.org/tutorial/tutorial.html

React.js kitaphanasynyň işleýşi

JavaScript kitaphanasyny ulanyp, ulanyjy ähli ünsüni UI ösüş prosesine we programmanyň böleklerine gönüden-göni üns bermäge mümkinçilik alýar, iň bolmanda ýazuw kodunyň emele gelmegi we bolup biläýjek kemçilikleri bilen ünsüni sowýar. Kitaphana size programmalary has çalt ösdürmäge mümkinçilik berýär, komponentleri we tutuş taslama prosesini düzmegi we redaktirlemegi aňsatlaşdyrýar. Şeýlelikde, React.js global ulgamda aragatnaşyk, UI, programma döwlet gözegçiligi we beýleki çylşyrymly meseleleri çözmek ukyby üçin jogapkär elementleri öz içine alýar. Şeýle hem kitaphanada aşakdaky funksional aýratynlyklar bar:

1. Amaly . React.js kiçeldilen formatda elýeterlidir. Bu ykjam bukjany anyk düzmek zerurlygy ýok. Onda eýýäm sahypanyň brauzer wersiýasyny açmak üçin wagty azaldýan kod bölmek aýratynlygy bar, sebäbi bu opsiýa komponentleriň şol bir wagtda görkezilmeginiň öňüni alýar.
2. Nasosly ekosistema we laýyklyk . Ulanyja islendik maksat bilen täze çylşyrymly programmalary döretmäge mümkinçilik berýän beýleki saýtlar tarapyndan goldanýan kitaphanada köp sanly gural bar.
3. Doly işlemek . JavaScript kitaphanasynyň esasy artykmaçlygy, platformanyň ähli täze wersiýalarynyň köne talaplara laýyk gelmegidir, şonuň üçin köne we täzelenen wersiýany ulanyp bilersiňiz, olaryň hemmesi goldanýar we şu güne çenli aktual. Öň çykan wersiýalar soňky täzelenmelerden soň könelmeýär.

Amaly ulanmak

Kitaphananyň esasy sahypasynda, ulanyjylar üçin görkezmelerde, React-i iş ýüzünde ulanmagyň birnäçe aýdyň mysallary bar. Olary el bilen düzedip, işletmäge synanyşyp bilersiňiz. Täze ulanyjy bolsaňyz we kitaphananyň düýp manysyna we logikasyna düşünmeseňizem, kody isleýşiňize görä sazlaň we netijäni görüň.

JavaScript-de söwda robotlary ýazylanda React-yň amaly ulanylyşy

Bir döredijiniň JS programmirlemeýändigini, ýöne skriptleri (skriptleri) ýazýandygyna düşünmek möhümdir. şonuň üçin kitaphanany ulanyp, bir dörediji söwda maksady bilen ulanylýan indiki söwda roboty üçin kod ýazyp biler we daşky görnüşini bu platforma esasynda dizaýn etmegini dowam etdirer. Aslynda, söwda üçin söwda roboty hem React.js ulanyp köp sanly işlenip düzülen programma. Şeýle-de bolsa, käbir funksiýalar we botyň içki bölegi munuň üçin amatly gurallary üpjün edýän beýleki saýtlarda edilmeli bolar.

GitHub we React.js

GitHub taslamalaryň ähli wersiýalaryny ýerleşdirýän platforma. Ulanyjy hosting birikdirýär, resmi GitHub web sahypasynda hasaba alyş prosedurasyndan geçýär we soňra Git-den ähli faýllary geçirýän onlaýn ammar döredýär.
Git häzirki wagtda iň meşhur we degişli taslama wersiýasyna gözegçilik hyzmaty, GitHub bolsa uzakdaky kod ammarydyr.

Salgylanma! Diňe rugsady bilen degişli baglanyşygy alan ulanyjylara faýllary redaktirlemäge we göçürip alyp bilerler.

Resminamalar

JavaScript kitaphanasy bilen baglanyşykly ähli okuw gollanmalary we iň täze materiallar iň täze täzelenme bilen täzelenýär. Şeýle hem, döredijiler kitaphananyň aýratyn sahypasynda ýerleşdirilen resminamalaryň köne wersiýalaryny umumy okamak üçin düzýärler we iberýärler. Şonuň üçin täze başlanlar üçin sahypany dolandyrmak endiklerini özleşdirmek has aňsat bolar: köne we täze material – hemme zat şu ýerde, giriş hemmeler üçin mugt.

Bellik! Gollanmalary okamagy ýatdan çykarmaň. Iň bärkisi göz aýlaň – düşünip bolmajak ýaly zatlaryň köpüsi eýýäm ýerine düşer.

React kitaphanasy häzirki wagtda meşhur we degişli platforma. Köpugurlylygy döredijilere has ýokary hilli we az wagtyň içinde taslamalary döretmäge mümkinçilik berýär. Mundan başga-da, platformany bilmek we ony ulanmak endiklerine eýe bolmak, zähmet bazarynda hünärmeni has köp talap edýär.