fampidirana
Na vaovao amin'ny fandaharana ianao na mpamorona efa za-draharaha, dia tsy maintsy mianatra hevi-baovao sy fiteny/rafitra vaovao amin'ity indostria ity mba haharaka ny fironana.
Raiso ny React, ohatra, izay navoakan'ny Facebook efa-taona lasa izay ary efa lasa safidy voalohany ho an'ny mpamorona JavaScript manerana izao tontolo izao.
Ny Vue sy Angular, mazava ho azy, dia manana ny mpankafy ara-dalΓ na ihany koa. Ary avy eo dia misy Svelte sy ireo rafitra manerantany hafa toa ny Next.js na Nuxt.js. Ary Gatsby, ary Gridsome, ary Quasar... sy ny maro hafa.
Raha te hanaporofo ny tenanao ho mpamorona JavaScript za-draharaha ianao dia tokony hanana traikefa farafaharatsiny amin'ny rafitra sy tranomboky isan-karazany - ankoatra ny fanaovana asa miaraka amin'ny JS taloha tsara.
Mba hanampiana anao ho lasa tompon'andraikitra voalohany amin'ny taona 2020, dia nanangona tetikasa sivy samihafa aho, izay samy mifantoka amin'ny rafitra JavaScript sy tranomboky hafa ho toy ny stack teknolojia azonao amboarina sy ampidirina ao amin'ny portfolio-nao. Tsarovy fa tsy misy manampy anao mihoatra noho ny famoronana zavatra, koa mandrosoa, ampiasao ny sainao ary ataovy izany
Nadika tamin'ny fanohanan'ny EDISON Software ny lahatsoratra, izay , ary koa .
Fampiharana fikarohana sarimihetsika mampiasa React (miaraka amin'ny hooks)
Ny zavatra voalohany azonao atomboka dia ny mamorona rindranasa fikarohana sarimihetsika mampiasa React. Ity ambany ity ny sarin'ny ho endriky ny fampiharana farany:
Inona no hianaranao
Amin'ny fananganana ity fampiharana ity dia hanatsara ny fahaizanao React ianao amin'ny fampiasana ny API Hooks vaovao. Ny tetik'asa ohatra dia mampiasa singa React, hooks maro, API ivelany, ary mazava ho azy fa misy styling CSS.
Tech stack sy endri-javatra
- Mihetsika amin'ny farango
- mamorona-Maneho Hevitra Momba-fampiharana
- JSX
- CSS
Raha tsy mampiasa kilasy, ireo tetikasa ireo dia manome anao ny fidirana tonga lafatra amin'ny React miasa ary tena hanampy anao amin'ny 2020. afaka mahita ianao . Araho ny toromarika na ataovy ho anao manokana.
Chat App miaraka amin'ny Vue
Tetikasa lehibe iray hafa azonao atao ny mamorona rindranasa chat amin'ny fampiasana ny tranomboky JavaScript tiako indrindra: VueJS. Ny fampiharana dia hiseho toy izao:
Inona no hianaranao
Amin'ity lesona ity dia hianatra ny fomba fanaovana fampiharana Vue hatrany am-boalohany ianao - famoronana singa, fitantanana fanjakana, famoronana lalana, fifandraisana amin'ny serivisy an'ny antoko fahatelo, ary na dia ny fitantanana ny fanamarinana aza.
Tech stack sy endri-javatra
- Vue
- vuex
- Vue router
- Vidin'ny CLI
- Mpanosika
- CSS
Tetikasa tena tsara hanombohana amin'ny Vue na hanatsarana ny fahaizanao efa misy mba hidirana amin'ny fampandrosoana amin'ny taona 2020. afaka mahita ianao .
Fampiharana toetr'andro tsara tarehy miaraka amin'ny Angular 8
Ity ohatra ity dia hanampy anao hamorona fampiharana toetr'andro tsara tarehy amin'ny fampiasana Angular 8:
Inona no hianaranao
Ity tetikasa ity dia hampianatra anao fahaiza-manao sarobidy amin'ny fananganana rindranasa hatrany am-boalohany - manomboka amin'ny famolavolana ka hatramin'ny fampandrosoana, hatrany amin'ny fampiharana efa vonona.
Tech stack sy endri-javatra
- Angular 8
- Firebase
- Famerenana amin'ny lafiny server
- CSS miaraka amin'ny Grid sy Flexbox
- Mobile friendly sy adaptability
- Maody maizina
- Interface tsara tarehy
Ny tena tiako amin'ity tetikasa ity dia ny tsy fandalinanao zavatra irery. Fa kosa, mianatra ny dingana fampandrosoana manontolo ianao, manomboka amin'ny famolavolana ka hatramin'ny fametrahana farany.
To-Do fampiharana mampiasa Svelte
Svelte dia toy ny zaza vaovao amin'ny fomba fiasa mifototra amin'ny singa - farafaharatsiny mitovy amin'ny React, Vue ary Angular. Ary ity dia iray amin'ireo vokatra vaovao mafana indrindra amin'ny taona 2020.
Ny fampiharana To-Do dia tsy voatery ho lohahevitra mafana indrindra, fa tena hanampy anao hanatsara ny fahaizanao Svelte. Ho toy izao izany:
Inona no hianaranao
Ity lesona ity dia hampiseho anao ny fomba hamoronana fampiharana mampiasa Svelte 3, manomboka amin'ny voalohany ka hatramin'ny farany. Hampiasa singa, styling, ary mpitantana hetsika ianao
Tech stack sy endri-javatra
- Svelte 3
- singa
- Styling miaraka amin'ny CSS
- ES 6 syntax
Tsy dia betsaka ny tetikasa fanombohana Svelte tsara, ka hitako .
Fampiharana e-varotra mampiasa Next.js
Next.js no rafitra malaza indrindra amin'ny fananganana rindranasa React izay manohana ny famandrihana amin'ny lafiny mpizara ivelan'ny boaty.
Ity tetikasa ity dia hampiseho aminao ny fomba hamoronana rindranasa e-varotra tahaka izao:
Inona no hianaranao
Amin'ity tetikasa ity dia hianatra ny fomba mivelatra miaraka amin'ny Next.js ianaoβmamorona pejy sy singa vaovao, maka angona ary fomba ary mametraka fampiharana Manaraka.
Tech stack sy endri-javatra
- Manaraka.js
- Ireo singa sy pejy
- Data sampling
- stylization
- Fametrahana tetikasa
- SSR sy SPA
Mahafinaritra foana ny manana ohatra tena izy toy ny fampiharana e-varotra hianarana zava-baovao. Ianao dia afaka .
Bilaogy feno fiteny amin'ny fiteny maro miaraka amin'ny Nuxt.js
Nuxt.js dia ho an'ny Vue, inona ny Next.js ho an'ny React: rafitra lehibe ahafahana manambatra ny herin'ny famandrihana amin'ny lafiny server sy ny fampiharana pejy tokana
Ny fampiharana farany azonao atao dia ho toy izao:
Inona no hianaranao
Amin'ity tetikasa santionany ity dia hianatra ny fomba hamoronana tranokala feno amin'ny fampiasana Nuxt.js ianao, manomboka amin'ny fananganana voalohany ka hatramin'ny fametrahana farany.
Manararaotra ny maro amin'ireo endri-javatra mahafinaritra atolotry ny Nuxt, toy ny pejy sy ny singa, ary ny fanaingoana amin'ny SCSS.
Tech stack sy endri-javatra
- Nuxt.js
- Ireo singa sy pejy
- Storyblock module
- Hagfish
- Vuex ho an'ny fitantanana fanjakana
- SCSS ho an'ny styling
- Nuxt middlewares
, izay ahitana endri-javatra Nuxt.js lehibe maro. Izaho manokana dia tia miara-miasa amin'ny Nuxt ka tokony andramana ianao fa hahatonga anao ho mpamorona Vue lehibe ihany koa.
Bilaogy miaraka amin'i Gatsby
Gatsby dia mpamorona tranokala static tena tsara mampiasa React sy GraphQL. Izao no vokatry ny tetikasa:
Inona no hianaranao
Amin'ity lesona ity dia hianatra ny fomba fampiasana Gatsby ianao hamorona bilaogy izay hampiasainao hanoratana ny lahatsoratrao manokana amin'ny fampiasana React sy GraphQL.
Tech stack sy endri-javatra
- gatsby
- Maneho Hevitra Momba
- GraphQL
- Plugins sy lohahevitra
- MDX/Markdown
- Bootstrap CSS
- Templates
Raha efa te hanomboka bilaogy ianao, momba ny fomba hanaovana izany amin'ny fampiasana React sy GraphQL.
Tsy milaza aho fa safidy ratsy ny WordPress, fa miaraka amin'i Gatsby dia afaka manangana tranokala avo lenta ianao amin'ny fampiasana React - izay fitambarana mahavariana.
Bilaogy miaraka amin'i Gridsome
Gridsome ho an'ny Vue... Eny, efa nanana an'ity izahay miaraka amin'ny Next/Nuxt.
Fa toy izany koa ny Gridsome sy Gatsby. Samy mampiasa GraphQL ho toy ny soson'ny angonany izy roa, fa ny Gridsome kosa dia mampiasa VueJS. Ity koa dia mpamorona tranokala static mahavariana izay hanampy anao hamorona bilaogy mahafinaritra:
Inona no hianaranao
Ity tetikasa ity dia hampianatra anao ny fomba hamoronana bilaogy tsotra hanombohana amin'ny Gridsome, GraphQL ary Markdown. Izy io koa dia mirakitra ny fomba fametrahana fampiharana amin'ny Netlify.
Tech stack sy endri-javatra
- Gridsome
- Vue
- GraphQL
- Markdown
- Netlify
Ity dia azo antoka fa tsy ny fampianarana feno indrindra, fa mirakitra ny foto-kevitra fototra momba ny Gridsome sy .
Mpilalao feo mitovy amin'ny SoundCloud mampiasa Quasar
Quasar dia rafitra Vue hafa azo ampiasaina hamoronana rindranasa finday. Amin'ity tetikasa ity dia hamorona fampiharana mpilalao audio ianao, ohatra:
Inona no hianaranao
Raha mifantoka indrindra amin'ny rindranasa an-tranonkala ny tetikasa hafa, ity iray ity dia hampiseho aminao ny fomba hamoronana rindranasa finday mampiasa Vue sy ny rafitra Quasar.
Tokony efa manana Cordova mihazakazaka miaraka amin'ny Android Studio/Xcode ianao. Raha tsy izany, ny boky dia manana rohy mankany amin'ny tranokalan'ny Quasar izay atorony anao ny fomba fametrahana ny zava-drehetra.
Tech stack sy endri-javatra
- quasar
- Vue
- Cordova
- WaveSurfer
- UI Components
, mampiseho ny fahaizan'i Quasar amin'ny famoronana fampiharana finday.
Source: www.habr.com