Faatomuaga
Независимо от того, являетесь ли вы новичком в программировании или уже опытным разработчиком, в этой отрасли изучение новых концепций и языков/фреймворков является обязательно чтобы успевать за трендами.
Возьмем, к примеру, React — код которого, Facebook открыл всего четыре года назад, он уже стал выбором номер один для разработчиков JavaScript по всему миру.
Vue и Angular, конечно же, также имеют свою законную базу поклонников. И еще есть Svelte и другие универсальные фреймворки, такие как Next.js или Nuxt.js. И Gatsby, и Gridsome, и Quasar… и многое другое.
Если вы хотите проявить себя как опытный разработчик JavaScript, у вас должен быть хотя бы некоторый опыт работы с различными фреймворками и библиотеками — помимо выполнения работы с хорошим старым JS.
Чтобы помочь вам стать мастером фронт-енда в 2020 году, я собрал девять различных проектов, каждый из которых был посвящен разным фреймворкам и библиотекам JavaScript в качестве технического стека, который вы можете создать и добавить в свое портфолио. Помните, что ничто не помогает вам больше, чем на практике создавать вещи, поэтому двигайтесь вперед, включите свой ум и сделайте это возможным
O le tusiga na faaliliuina ma le lagolago a le EDISON Software, lea , faapea foi ma .
Su'esu'e ata tifaga e fa'aaoga ai le React (ma matau)
O le mea muamua e mafai ona e amata i ai o le fatuina o se ata tifaga suʻesuʻe app e faʻaaoga ai le React. Lalo o se ata o le a foliga mai o le talosaga mulimuli:
O le a le mea o le a e aʻoaʻoina
E ala i le fausiaina o lenei app, e te faʻaleleia atili ai ou tomai React e ala i le faʻaogaina o le API fou Hooks. O le faʻataʻitaʻiga o le poloketi e faʻaaogaina vaega React, tele o matau, API fafo, ma o le mea moni o nisi CSS styling.
Tekinolosi faaputuga ma foliga
- Tali atu i matau
- faia-react-app
- JSX
- CSS
A aunoa ma le faʻaaogaina o soʻo se vasega, o nei poloketi e tuʻuina atu ia te oe le tulaga atoatoa e ulufale ai i le React galue ma o le a mautinoa lava e fesoasoani ia te oe i le 2020. e mafai ona e mauaina . Mulimuli i faatonuga pe fai sau oe lava.
Talatala App ma Vue
O le isi poloketi sili mo oe e fai o le fatuina lea o se talatalanoaga e faʻaaoga ai laʻu faletusi JavaScript e sili ona ou fiafia i ai: VueJS. O le talosaga o le a foliga pei o lenei:
O le a le mea o le a e aʻoaʻoina
I totonu o lenei aʻoaʻoga, o le a e aʻoaʻoina ai pe faʻapefea ona fai se Vue app mai le maoaʻe - fatuina o vaega, faʻatautaia tulaga, fatuina o auala, fesoʻotaʻi atu i isi vaega, ma e oʻo lava i le taulimaina o faʻamaoniga.
Tekinolosi faaputuga ma foliga
- Vaʻai
- vuex
- Vue Router
- CLI vaʻai
- Pusher
- CSS
Ose galuega lelei tele lea e amata ai i le Vue pe fa'aleleia ou tomai o iai nei e o'o atu ai ile atina'e ile 2020. e mafai ona e mauaina .
Manaia le tau app ma le Angular 8
O lenei faʻataʻitaʻiga o le a fesoasoani ia te oe e fatuina se ata matagofie o le tau e faʻaaoga ai le Angular 8:
O le a le mea o le a e aʻoaʻoina
O lenei poloketi o le a aʻoaʻoina ai oe i tomai taua i le fausiaina o tusi talosaga mai le amataga - mai le mamanu e oʻo atu i le atinaʻe, o le auala atoa i le faʻapipiʻiina-sauni.
Tekinolosi faaputuga ma foliga
- Tulimanu 8
- Falepuipui
- Fa'asinomaga itu o le server
- CSS ma Grid ma Flexbox
- Feavea'i faauo ma fetuutuunai
- Faiga pogisa
- Matagofie fa'aoga
O le mea e sili ona ou fiafia i ai i lenei galuega fa'akomepiuta uma o lou le su'esu'eina na o mea. Ae, e te aʻoaʻoina le faagasologa atoa o le atinaʻe, mai le mamanu i le faʻatulagaina mulimuli.
To-Do talosaga e faʻaaoga ai Svelte
Svelte e pei o le tamaititi fou i luga o le vaega faʻavae - e tutusa ma React, Vue ma Angular. Ma o se tasi lea o oloa sili ona manaia mo le 2020.
To-Do apps e le o se autu sili ona manaia, ae o le a fesoasoani tele ia te oe e faʻaleleia ou tomai Svelte. O le a pei o lenei:
O le a le mea o le a e aʻoaʻoina
O lenei aʻoaʻoga o le a faʻaali atu ia te oe le auala e fai ai se talosaga e faʻaaoga ai le Svelte 3, mai le amataga seia maeʻa. E te fa'aogaina vaega, sitaili, ma fa'atonu mea
Tekinolosi faaputuga ma foliga
- Svelte 3
- Vaega
- Styling ma CSS
- ES 6 fa'asologa
E le tele ni poloketi amata Svelte lelei, o lea na ou maua ai .
E-fefa'ataua'iga polokalama fa'aoga Next.js
Next.js o le ta'iala sili ona ta'uta'ua mo le fausiaina o talosaga React e lagolagoina le tu'uina atu o le itu-aumau mai le pusa.
O lenei poloketi o le a faʻaali atu ia te oe pe faʻapefea ona fatuina se talosaga e-pisinisi e pei o lenei:
O le a le mea o le a e aʻoaʻoina
I lenei poloketi, o le a e aʻoaʻo ai pe faʻapefea ona atiaʻe ma Next.js—fausia itulau fou ma vaega, faʻapipiʻi faʻamaumauga, ma sitaili ma faʻapipiʻi se isi talosaga.
Tekinolosi faaputuga ma foliga
- Sosoo ai.js
- Vaega ma Itulau
- Fa'ata'ita'iga o fa'amaumauga
- Faʻaaogaina
- Poloketi Fa'atino
- SSR ma SPA
E manaia i taimi uma le i ai o se fa'ata'ita'iga moni i le lalolagi e pei o se e-commerce app e a'oa'o ai se mea fou. E te mafaia .
Blog e tele gagana ma Nuxt.js
Nuxt.js e mo Vue, o le a le Next.js mo React: o se faʻavaa sili mo le tuʻufaʻatasia o le mana o le tuʻuina atu o le itu-aumau ma talosaga e tasi-itulau.
O le talosaga mulimuli e mafai ona e fatuina e pei o lenei:
O le a le mea o le a e aʻoaʻoina
I lenei fa'ata'ita'iga poloketi, o le a e a'oa'o ai pe fa'apefea ona fai se upegatafa'ilagi atoa e fa'aaoga ai Nuxt.js, mai le fa'atulagaina muamua e o'o i le fa'atulagaina mulimuli.
E fa'aogaina ai le tele o foliga matagofie o lo'o ofoina atu e Nuxt, e pei o itulau ma vaega, ma le fa'ailogaina o le SCSS.
Tekinolosi faaputuga ma foliga
- Nuxt.js
- Vaega ma Itulau
- Tala poloka poloka
- Hagfish
- Vuex mo pulega a le setete
- SCSS mo le faiga
- Nuxt middlewares
, lea e aofia ai le tele o mea sili Nuxt.js. Ou te fiafia lava e galulue faatasi ma Nuxt o lea e tatau ai ona e faʻataʻitaʻi aua o le a avea ai foi oe ma se atinaʻe Vue sili.
Blog ma Gatsby
O le Gatsby ose fa'ato'aga fa'aola lelei tele e fa'aaoga ai le React ma le GraphQL. O le taunuuga lea o le poloketi:
O le a le mea o le a e aʻoaʻoina
I lenei aʻoaʻoga, o le a e aʻoaʻoina ai le faʻaogaina o Gatsby e fai ai se blog e te faʻaaogaina e tusi ai au lava tala e faʻaaoga ai le React ma le GraphQL.
Tekinolosi faaputuga ma foliga
- Gatsby
- tali
- GraphQL
- Plugins ma autu
- MDX/Fa'ailo
- Bootstrap CSS
- Mamanu
Afai na e mana'o e amata se blog, i le auala e faʻaogaina ai le React ma le GraphQL.
Ou te le o fai atu o le WordPress o se filifiliga leaga, ae o Gatsby e mafai ona e fausia ni upega tafaʻilagi maualuga e faʻaaoga ai le React - o se tuufaatasiga ofoofogia.
Blog ma Gridsome
Gridsome mo Vue... Ua lelei, ua uma ona tatou maua lenei mea i le Next/Nuxt.
Ae e tutusa lava mo Gridsome ma Gatsby. E fa'aoga uma le GraphQL e fai ma latou fa'amaumauga, ae fa'aaoga e Gridsome VueJS. Ole mea fo'i lea ose fa'atupu fa'amautu fa'amautu lea o le a fesoasoani ia te oe e fatuina ni blogs sili:
O le a le mea o le a e aʻoaʻoina
O lenei poloketi o le a aʻoaʻoina oe pe faʻapefea ona fatuina se blog faigofie e amata ai Gridsome, GraphQL ma Markdown. E aofia ai foʻi le faʻaogaina o se talosaga e ala i Netlify.
Tekinolosi faaputuga ma foliga
- Mata'utia
- Vaʻai
- GraphQL
- Markdown
- Faʻailoa
E mautinoa lava e le o se aʻoaʻoga sili ona atoatoa, ae e aofia ai mataupu faavae o Gridsome ma .
SoundCloud-pei-pei leo fa'aoga le Quasar
Quasar o le isi Vue faʻavae e mafai ona faʻaogaina e fai ai talosaga feaveaʻi. I totonu o lenei poloketi o le ae fatuina se mea faʻalogo leo, mo se faʻataʻitaʻiga:
O le a le mea o le a e aʻoaʻoina
E ui o isi poloketi e taulaʻi tele i luga o upega tafaʻilagi, o le a faʻaali atu ia te oe le auala e fai ai se telefoni feaveaʻi e faʻaaoga ai le Vue ma le Quasar framework.
E tatau ona e faʻaogaina Cordova faʻatasi ma le Android Studio/Xcode configured. Afai e leai, o le tusi lesona o loʻo i ai se fesoʻotaʻiga i le upega tafaʻilagi a Quasar lea latou te faʻaali atu ia te oe le faʻatulagaina o mea uma.
Tekinolosi faaputuga ma foliga
- quasar
- Vaʻai
- Cordova
- WaveSurfer
- Vaega UI
, faʻaalia le gafatia o Quasar mo le fatuina o talosaga feaveaʻi.
puna: www.habr.com