Clár na nÁbhar[Folaigh][Taispeáin]
Nuair a bhíonn leabharlann nó creatlach bogearraí á phiocadh, is gnách go gcuirtear taithí an fhorbróra san áireamh.
Agus “taithí forbróra” á lua agam, táim ag tagairt don chaoi a ndéanann forbróirí an obair i ndáiríre. Roghnaíonn forbróirí leabharlanna nó creataí atá taitneamhach le húsáid.
Seo ceann de na príomhchúiseanna a bhfuil na leabharlanna agus na creataí is mó éileamh againn anois. Mar fhorbróirí, ní gá dúinn tosú ón tús nuair atá uirlisí ann cheana féin cruthaithe chun cabhrú linn lenár dtascanna.
Is píosaí bogearraí iad creata a chruthaíonn agus a úsáideann forbróirí chun feidhmchláir a thógáil, agus tá NextJS ar cheann acu.
Sa phost seo, rachaidh muid thar Nextjs, a phríomhghnéithe, agus conas is féidir linn é a úsáid chun feidhmchlár a thógáil. Léimimis ceart isteach.
Cad é Next.js?
Ar Aghaidh.js. Is creat JavaScript é chun leathanaigh ghréasáin statacha agus feidhmchláir ar líne bunaithe ar React a thógáil go tapa agus go héasca. Ligeann sé duit aipeanna Gréasáin iontacha a dhearadh le haghaidh ardáin éagsúla, lena n-áirítear Windows, Linux, agus Mac.
Ba chóir go mbeadh cur amach agat ar chreat Next.js más rud é nach bhfuil mórán cur amach agat ar imoibriú agus más mian leat tuilleadh a fhoghlaim faoin éiceachóras imoibrithe.
Cé go dtagann Next.js le gach rud atá uait le tosú, is féidir leat a roghnú idir NPM agus Snáth, JavaScript agus TypeScript, CSS agus SCSS, onnmhairiú statach, agus imscaradh gan fhreastalaí.
Gnéithe
- Déantar ródú go huathoibríoch - Ní gá duit aon rud a chumrú toisc go bhfuil aon URL mapáilte chuig an gcóras comhad, chuig comhaid i bhfillteán na leathanaigh (tá roghanna saincheaptha agat, ar ndóigh).
- Comhpháirteanna Comhad Aonair – Tá sé simplí stíleanna scoped a chur leis an gcomhpháirt ag baint úsáide as styled-jsx, atá comhtháite go hiomlán agus a tháirgtear ag an bhfoireann chéanna.
- Cód Te a Athlódáil - Nuair a bhraitheann Next.js modhnú a shábháiltear ar diosca, athlódálann sé an leathanach.
- Comhpháirteanna Dinimiciúla - Is féidir leat modúil JavaScript agus Comhpháirteanna Imoibríocha a luchtú go dinimiciúil.
- Onnmhairí statacha – Ligeann Next.js duit suíomh iomlán statach a onnmhairiú ó d’aip leis an gcéad ordú easpórtála eile.
- Comhoiriúnacht leis an gComhshaol - Comhtháthaíonn Next.js gan uaim leis na héiceachórais JavaScript, Nód, agus React.
- Cóid a Scoilteadh go huathoibríoch - Ní úsáidtear ach na leabharlanna agus JavaScript a theastaíonn chun leathanaigh a rindreáil. In ionad comhad JavaScript amháin a chruthú ina bhfuil cód uile na haipe, roinneann Next.js an aip go cliste ina go leor acmhainní.
Conas feidhmchlár next.js a chruthú?
suiteáil
Is féidir leat an t-ordú nód npx a úsáid chun tionscadal Next.js a shuiteáil agus a thógáil.
Ginfidh sé seo fillteán agus na comhaid, na cumraíochtaí agus na míreanna eile go léir a theastaíonn chun tionscadal Next.js a reáchtáil.
Is féidir leat an app a sheoladh nuair a ghintear é.
Leathanaigh & Ródú
Chun bealaí a láimhseáil le Next.js, ní gá dúinn creat ródaithe a úsáid. Tá ródú le Next.js ina ghaoith le socrú. Nuair a úsáideann tú an t-ordú create-next-app chun app nua Next.js a thógáil, cruthaíonn an app fillteán ar a dtugtar 'leathanaigh' de réir réamhshocraithe.
Is é an fillteán ‘leathanaigh’ seo a choinníonn tú do bhealaí. Mar thoradh air sin, déanfar gach comhad comhpháirteanna imoibríonn san fhochomhadlann a láimhseáil mar bhealach ar leith.
Mar shampla, má tá na comhaid sin san fhillteán:
- innéacs.js
- faoi.js
- ailt.js
Déanfar an comhad seo a chlaochlú go huathoibríoch ar thrí bhealach:
- An leathanach innéacs localhost/innéacs
- An leathanach faoi localhost / faoi
- An leathanach blag localhost/earraí
Taispeántar sampla de leathanach about.js thíos. Ní chuirtear aon rud ar fáil faoin leathanach, mar a fheiceann tú. Níl ann ach comhpháirt chaighdeánach feidhmiúil React.
Bealaí
Chun bealaí neadaithe a dhéanamh, ní mór duit fofhillteán a bhunú ar dtús. Mar shampla: leathanaigh/earraí. Cruthaigh do chomhpháirt imoibrithe 'contact.js' laistigh den fhillteán sin, agus ginfidh sé an leathanach localhost/articles/contact.
Má chuireann tú comhad amháin i leathanaigh/articles.js agus comhad eile i leathanaigh/articles/index.js. Léiríonn an dá cheann an cosán céanna localhost / blog. Sa chás seo, ní dhéanfaidh Next.js ach an comhad article.js a sholáthar. Cad faoi bhealaí dinimiciúla, ina bhfuil a chonair féin ag gach blagphost:
- localhost / blog / an chéad alt
- localhost/blog/-second-article
Trí úsáid a bhaint as nodaireacht na lúibíní, is féidir leat bealach dinimiciúil a shainiú in Next.js. Mar shampla: leathanaigh/alt/[sluga].js
Nascbhealaí
Tá do chéad bhealach críochnaithe agat anois. Tá mé ag buille faoi thuairim go bhfuil tú ag fiafraí conas leathanaigh a nascadh leis na bealaí sin. Beidh 'next/link' uait chun é sin a dhéanamh.
Seo sampla de leathanach baile ina bhfuil nasc chuig an leathanach About:
Más mian leat an nasc a stíl, úsáid an chomhréir seo a leanas:
Bealaí Atreoraithe
Cad a tharlóidh má theastaíonn uait atreorú chuig leathanach áirithe a bhrú? Mar shampla, nuair a bhrúitear cnaipe? Is féidir leat é seo a dhéanamh trí úsáid a bhaint as 'router.push':
Sinsearach
Teastaíonn metaeilimintí (ceann) de bhreis ar shonraí laistigh den chorp HTML ó leathanaigh in fheidhmchláir ghréasáin. Dá bharr seo beidh gá le riachtanas breise darb ainm Clogad Frithghníomhaithe a shuiteáil i bhFeidhmchlár React.
Is féidir linn an chomhpháirt Ceann a úsáid ón gcéad cheann eile in Ar Aghaidh chun meiteashonraí a chur go héasca ar ár leathanaigh ghréasáin a thaispeánfar i dtorthaí cuardaigh agus a leabóidh:
Comhpháirteanna
Is minic go mbeidh ort comhpháirteanna nó comhad leagan amach a fhorbairt. Mar shampla, comhpháirt a dhéanann an barra nascleanúna. Táimid díreach tar éis úsáid a bhaint as fillteán na leathanach go dtí seo. Cad a tharlóidh mura bhfuil sé i gceist do chomhpháirt a bheith ina leathanach bealaigh?
Ní theastaíonn uait go ndéanfadh an t-úsáideoir nascleanúint chuig leathanach ar nós localhost/barra nav. Má chuireann tú an chomhpháirt Navbar.js san fhillteán leathanaigh, sin a tharlóidh. Cad ba cheart duit a dhéanamh sa chás?
Níl ort ach do chuid comhpháirteanna 'ní leathanach' go léir a stóráil i bhfillteán ar leith. Úsáideann formhór na dtionscadal Next.js an monaicéir 'comhpháirteanna,' agus gintear an fillteán seo i bhfréamhfhillteán do thionscadal.
Comhpháirt ceann
Rindreáiltear an t-ualach leathanach tosaigh ag Next.js ar thaobh an fhreastalaí. Déanann sé é seo trí HTML do leathanaigh a mhodhnú. Tá an t-alt ceanntásca san áireamh.
Úsáidtear an chomhpháirt Ceann Next.js chun clibeanna rannóg ceanntásca a thabhairt mar theideal agus meitea. Úsáidtear an chomhpháirt Ceann sa sampla seo de chomhpháirt Leagan Amach.
Cruthaigh 404 leathanach gan aimsiú
Tá sé indéanta do leathanach earráide 404 féin a dhéanamh. B'fhéidir gur mhaith leat an teachtaireacht a shaincheapadh nó dearadh do leathanaigh féin a chur leis. I bhfillteán na leathanaigh, cruthaigh an comhad 404.js.
Nuair a tharlaíonn earráid 404, atreoróidh Next.js go huathoibríoch chuig an leathanach seo. Seo sampla de leathanach pearsanta 404:
Sonraí a Fháil ó thaobh an fhreastalaí
In ionad sonraí a íoslódáil ar thaobh an chliaint, ceadaíonn Next.js duit daonra sonraí tosaigh a sheoladh, rud a thugann le tuiscint an leathanach a sheoladh leis na sonraí atá daonra cheana féin ón bhfreastalaí.
Tá dhá rogha agat maidir le gabháil sonraí ar thaobh an fhreastalaí a chur i bhfeidhm:
- Ba cheart sonraí a fháil ar gach iarratas.
- Ná faigh sonraí ach uair amháin le linn an phróisis tógála (láithreán statach)
Faigh sonraí ar gach iarratas
Úsáidtear an modh getServerSideProps chun gach iarratas a dhéanamh ar thaobh an fhreastalaí. Is féidir an fheidhm seo a chur san áireamh ag deireadh do chomhaid chomhpháirt. Cuirfidh Next.js an réad getServerSideProps i do chuid fearais chomhpháirt go huathoibríoch má tá an fheidhm sin i láthair i do chomhad comhpháirte.
Faigh sonraí ag am tógála
Úsáidtear an modh getStaticProps chun taobh an fhreastalaí a sholáthar ag am tógála. Is féidir an fheidhm seo a chur san áireamh ag deireadh do chomhaid chomhpháirt. Ritheann an modh seo cód an fhreastalaí agus seolann sé iarratas GET chuig an bhfreastalaí, ach uair amháin nuair a bhíonn ár dtionscadal críochnaithe.
Cén fáth ar chóir duit Next.js a fhoghlaim?
Ceann de na cúiseanna atá leis seo ná go bhfuil Next.js tógtha ar bharr React, foireann uirlisí forbartha tosaigh le haghaidh ag cruthú comhéadain úsáideora is iad sin an rogha is fearr liom maidir le haipeanna gréasáin a dhearadh.
Ach ní bheadh sé go leor mura mbeadh Next.js go maith ag a ndearna sé ... ceart?
Mar sin, cad go díreach a dhéanann sé?
Ní mór dúinn cúpla coincheap a shainiú ar dtús chun é a thuiscint. Tháinig tóir ar Next.js mar gur réitigh sé fadhb a bhí ag go leor forbróirí gréasáin le haipeanna gréasáin ar thaobh an chliaint (sa bhrabhsálaí). Bhí eispéireas níos fearr ag na Feidhmchláir Aon-Leathanach (SPAanna) seo toisc nach raibh gá acu leis an úsáideoir an leathanach a athlódáil agus cheadaigh siad tuilleadh idirghníomhaíochta.
Mar sin féin, toisc nach mbíonn an chuid is mó den ábhar in aip mar seo le feiceáil ach amháin nuair a dhéantar é sa bhrabhsálaí, bíonn sé deacair ag crawlers gréasáin ábhar téacs aip den sórt sin a thuiscint.
Mar thoradh air sin, in ainneoin a n-éileamh, d'fhan go leor SPAs anaithnid den chuid is mó d'innill chuardaigh móra ar nós Google. Áiríonn Next.js meicníocht ionsuite níos láidre anois chun comhpháirteanna React a sholáthar ar thaobh an fhreastalaí (SSR).
Ligeann Next.js d’fhorbróirí cód JavaScript a thógáil ar an bhfreastalaí le linn an phróisis tógála agus HTML bunúsach ininnéacsaithe a sholáthar don úsáideoir.
Son
- Go hiontach le haghaidh taithí úsáideora
- Great do SEO
- Tóg suíomh Gréasáin statach sár-ghasta a iompraíonn mar dhinimic
- Solúbthacht i dtógáil Chomhéadain & UX.
- Buntáistí forbartha go leor
- Tacaíocht iontach pobail
CONS
- Bíonn méid áirithe ama ag láithreáin ghréasáin nó feidhmchláir le tógáil nó le forbairt.
- I gcás tascanna áirithe, níl Next.js leordhóthanach. Ba cheart go mbeadh forbróirí in ann bealaí dinimiciúla a thógáil ag baint úsáide as uirlisí Node.js.
Conclúid
Mar a fheiceann tú, déanann Next.js forbairt aipeanna React a shimpliú agus ligeann sé duit díriú ar na rudaí is tábhachtaí - do loighic aip agus Chomhéadain. Áiríonn sé gach rud atá ag teastáil chun aipeanna comhaimseartha, saibhir chun tosaigh agus faoi thiomáint API a chruthú.
Tá sé oiriúnach freisin do thionscadail inneachair amháin, mar bhlaganna agus láithreáin ghréasáin ghnó, mar gheall ar a chumas leathanaigh HTML statacha a thógáil.
Leis na heagráin reatha, ní hamháin go gcoimeádann Next.js ardleibhéal taithí forbróra ach tugann sé uirlisí freisin chun feidhmíocht amhairc agus taithí úsáideora a mhéadú, ag cinntiú todhchaí geal don chreat seo.
Leave a Reply