Introduzzjoni
Kemm jekk int ġdid għall-ipprogrammar jew żviluppatur imħawwar, it-tagħlim ta 'kunċetti u lingwi/oqfsa ġodda huwa essenzjali f'din l-industrija biex tlaħħaq mat-tendenzi.
Ħu React, per eżempju, li Facebook ħadet sors miftuħ biss erba 'snin ilu u diġà saret l-għażla numru wieħed għall-iżviluppaturi JavaScript madwar id-dinja.
Vue u Angular, ovvjament, għandhom ukoll il-bażi ta 'fann leġittima tagħhom stess. U mbagħad hemm Svelte u oqfsa universali oħra bħal Next.js jew Nuxt.js. U Gatsby, u Gridsome, u Quasar... u ħafna aktar.
Jekk trid tipprova lilek innifsek bħala żviluppatur ta' JavaScript b'esperjenza, għandu jkollok mill-inqas xi esperjenza b'diversi oqfsa u libreriji - minbarra li tagħmel xogħol ma' JS antik tajjeb.
Biex ngħinek issir kaptan front-end fl-2020, għaqqadt disa' proġetti differenti, kull wieħed jiffoka fuq qafas u librerija JavaScript differenti bħala munzell ta 'teknoloġija li tista' tibni u żżid mal-portafoll tiegħek. Ftakar li xejn ma jgħinek aktar milli fil-fatt toħloq l-affarijiet, għalhekk imxi 'l quddiem, uża moħħok u agħmel dan iseħħ
L-artiklu ġie tradott bl-appoġġ ta 'EDISON Software, li U .
App għat-tfittxija tal-films billi tuża React (bil-ganċijiet)
L-ewwel ħaġa li tista 'tibda biha hija li toħloq app ta' tfittxija ta 'films billi tuża React. Hawn taħt hawn immaġni ta' kif se tidher l-applikazzjoni finali:
X'titgħallem
Billi tibni din l-app, int se ttejjeb il-ħiliet ta' React tiegħek billi tuża l-API Hooks relattivament ġdida. Il-proġett eżempju juża komponenti React, lottijiet ta 'ganċijiet, API esterna, u ovvjament xi stil CSS.
Munzell ta 'teknoloġija u karatteristiċi
- Irreaġixxi bil-ganċijiet
- Oħloq-tirreaġixxi-app
- Jsx
- CSS
Mingħajr ma tuża l-ebda klassijiet, dawn il-proġetti jagħtuk il-punt ta 'dħul perfett f'React funzjonali u żgur li se jgħinuk fl-2020. tista ssib . Segwi l-istruzzjonijiet jew għamilha tiegħek.
Chat App ma Vue
Proġett ieħor kbir għalik li tagħmel huwa li toħloq app chat billi tuża l-librerija favorita tiegħi JavaScript: VueJS. L-applikazzjoni se tidher xi ħaġa bħal din:
X'titgħallem
F'dan it-tutorja, int ser titgħallem kif tagħmel app Vue mill-bidu - toħloq komponenti, timmaniġġja l-istat, toħloq rotot, tikkonnettja ma 'servizzi ta' partijiet terzi, u anke timmaniġġja l-awtentikazzjoni.
Munzell ta 'teknoloġija u karatteristiċi
- Vue
- vuex
- Vue Router
- Vue CLI
- Irmonk
- CSS
Dan huwa proġett tassew kbir biex tibda bil-Vue jew ittejjeb il-ħiliet eżistenti tiegħek biex tidħol fl-iżvilupp fl-2020. tista ssib .
App tat-temp sabiħa b'Angular 8
Dan l-eżempju jgħinek toħloq app tat-temp sabiħa billi tuża Angular 8:
X'titgħallem
Dan il-proġett se jgħallemkom ħiliet siewja fil-bini ta’ applikazzjonijiet mill-bidu – mid-disinn sa l-iżvilupp, sat-triq kollha għal applikazzjoni lesta għall-iskjerament.
Munzell ta 'teknoloġija u karatteristiċi
- Angolari 8
- Firebase
- Rendiment tan-naħa tas-server
- CSS bi Grid u Flexbox
- Mobbli faċli u adattabilità
- Modalità skura
- Interfaċċja sabiħa
Dak li verament inħobb dwar dan il-proġett li jinkludi kollox huwa li ma tistudjax l-affarijiet b'mod iżolat. Minflok, titgħallem il-proċess kollu ta 'żvilupp, mid-disinn sal-iskjerament finali.
To-Do applikazzjoni bl-użu ta 'Svelte
Svelte huwa bħall-kid il-ġdid fuq l-approċċ ibbażat fuq il-komponenti - għall-inqas simili għal React, Vue u Angular. U dan huwa wieħed mill-aktar prodotti ġodda sħan għall-2020.
L-applikazzjonijiet To-Do mhumiex neċessarjament l-aktar suġġett jaħraq, iżda tassew jgħinek ttejjeb il-ħiliet Svelte tiegħek. Se tidher bħal din:
X'titgħallem
Dan it-tutorja jurik kif toħloq applikazzjoni billi tuża Svelte 3, mill-bidu sat-tmiem. Int ser tuża komponenti, stil, u handlers tal-avvenimenti
Munzell ta 'teknoloġija u karatteristiċi
- Svelta 3
- Komponenti
- Styling b'CSS
- ES 6 sintassi
M'hemmx ħafna proġetti tajbin ta 'starter Svelte, għalhekk sibt .
App tal-kummerċ elettroniku li tuża Next.js
Next.js huwa l-aktar qafas popolari għall-bini ta’ applikazzjonijiet ta’ React li jappoġġjaw ir-rendiment min-naħa tas-server barra mill-kaxxa.
Dan il-proġett jurik kif toħloq applikazzjoni tal-kummerċ elettroniku li tidher bħal din:
X'titgħallem
F'dan il-proġett, int ser titgħallem kif tiżviluppa b'Next.js—oħloq paġni u komponenti ġodda, estratti dejta, u stil u tiskjera applikazzjoni Next.
Munzell ta 'teknoloġija u karatteristiċi
- Next.js
- Komponenti u Paġni
- Teħid ta' kampjuni tad-dejta
- Styling
- Skjerament tal-Proġett
- SSR u SPA
Dejjem tajjeb li jkollok eżempju fid-dinja reali bħal app tal-kummerċ elettroniku biex titgħallem xi ħaġa ġdida. Tista .
Blog multilingwi sħiħ b'Nuxt.js
Nuxt.js huwa għal Vue, dak li Next.js huwa għal React: qafas kbir biex tgħaqqad il-qawwa tar-rendiment fuq is-server u applikazzjonijiet b'paġna waħda
L-applikazzjoni finali li tista' toħloq se tidher bħal din:
X'titgħallem
F'dan il-proġett ta 'kampjun, int ser titgħallem kif toħloq websajt kompluta bl-użu ta' Nuxt.js, mis-setup inizjali sal-iskjerament finali.
Huwa jieħu vantaġġ minn ħafna mill-karatteristiċi friski li għandha x'toffri Nuxt, bħal paġni u komponenti, u stil bl-SCSS.
Munzell ta 'teknoloġija u karatteristiċi
- Nuxt.js
- Komponenti u Paġni
- Modulu Storyblock
- Ħagfish
- Vuex għall-ġestjoni tal-istat
- SCSS għall-grafika
- middlewares Nuxt
, li jinkludi ħafna karatteristiċi kbar ta' Nuxt.js. Jien personalment inħobb naħdem ma' Nuxt għalhekk għandek tipprovaha peress li tagħmlek ukoll żviluppatur kbir ta' Vue.
Blog ma' Gatsby
Gatsby huwa ġeneratur ta 'sit statiku eċċellenti li juża React u GraphQL. Dan huwa r-riżultat tal-proġett:
X'titgħallem
F'dan it-tutorja, int ser titgħallem kif tuża Gatsby biex toħloq blog li int ser tuża biex tikteb l-artikoli tiegħek billi tuża React u GraphQL.
Munzell ta 'teknoloġija u karatteristiċi
- gatsby
- Irreaġixxi
- GraphQL
- Plugins u temi
- MDX/Markdown
- Bootstrap CSS
- templates
Jekk qatt xtaqt tibda blog, dwar kif tagħmilha billi tuża React u GraphQL.
Mhux qed ngħid li WordPress hija għażla ħażina, iżda b'Gatsby tista' tibni websajts ta' prestazzjoni għolja billi tuża React - li hija taħlita tal-għaġeb.
Blog ma' Gridsome
Gridsome għal Vue... Okay, diġà kellna dan ma Next/Nuxt.
Iżda l-istess jgħodd għal Gridsome u Gatsby. It-tnejn jużaw GraphQL bħala saff tad-dejta tagħhom, iżda Gridsome juża VueJS. Dan huwa wkoll ġeneratur ta 'sit statiku aqwa li jgħinek toħloq blogs mill-aqwa:
X'titgħallem
Dan il-proġett se jgħallem kif toħloq blog sempliċi biex tibda ma 'Gridsome, GraphQL u Markdown. Tkopri wkoll kif tiskjera applikazzjoni permezz ta' Netlify.
Munzell ta 'teknoloġija u karatteristiċi
- Gridsome
- Vue
- GraphQL
- Markdown
- Netlify
Dan ċertament mhuwiex l-aktar tutorja komprensiva, iżda jkopri l-kunċetti bażiċi ta 'Gridsome u .
Awdjo player bħal SoundCloud li juża Quasar
Quasar huwa qafas Vue ieħor li jista' jintuża biex jinħolqu applikazzjonijiet mobbli. F'dan il-proġett inti se toħloq applikazzjoni tal-awdjo player, pereżempju:
X'titgħallem
Filwaqt li proġetti oħra jiffokaw prinċipalment fuq applikazzjonijiet tal-web, dan jurik kif toħloq applikazzjoni mobbli bl-użu ta' Vue u l-qafas Quasar.
Diġà għandu jkollok Cordova taħdem b'Android Studio/Xcode konfigurat. Jekk le, il-manwal għandu link għall-websajt tal-Quasar fejn juruk kif twaqqaf kollox.
Munzell ta 'teknoloġija u karatteristiċi
- quasar
- Vue
- Cordova
- WaveSurfer
- Komponenti UI
, li juri l-kapaċitajiet ta' Quasar għall-ħolqien ta' applikazzjonijiet mobbli.
Sors: www.habr.com