Next.js

Next.js
Оригинални аутор(и)Гиљермо Раух
Прво издањеоктобар 2016; пре 9 година (2016-10)
Стабилно издање
14.1.4
Прелиминарно издање
13.1.7-canary.0 / 30 јануар 2023, 31 јануар 2023
Репозиторијум
Уреди на Википодацима
Написан у
Платформавишеплатформски
Величина17.0 MB
ЛиценцаMIT лиценца
Веб-сајтnextjs.org

Next.js је веб развојни оквир отвореног кода који је креирала приватна компанија Vercel која пружа веб апликације засноване на React-у са рендеровањем на страни сервера и генерисањем статичког веб сајта .[1]

React документација помиње Next.js међу „препорученим алаткама“ саветујући је програмерима приликом „израде веб локације коју приказује сервер са Node.js“. [2] Док традиционалне React апликације могу рендерујовати свој садржај само у претраживачу на страни клијента, Next.js проширује ову функционалност тако да укључује апликације које се приказују на страни сервера.

Ауторска права и заштитни знаци за Next.js су у власништву Vercel-a, [3] који такође одржава и води развој отвореног кода. [4]

Позадина

Next.js је React фрејмворк који омогућава неколико додатних функција, укључујући приказивање на страни сервера и генерисање статичких веб страница . [5] React је JavaScript библиотека која се традиционално користи за израду веб апликација које се приказују у клијентском прегледачу помоћу JavaScript-а. [6] Међутим, програмери су идентификовали неколико изазова са овом приступу, као што су непостојање JavaScript подршке или њено онемогућавање код одређених корисника, потенцијални безбедносни проблеми, знатно дуже време учитавања страница и негативан утицај на SEO оптимизацију сајта. [6] Оквири као што је Next.js заобилазе ове проблеме тако што дозвољавају да се нека или цела веб локација прикаже на страни сервера пре него што се пошаље клијенту. [6] [7] Next.js је један од најпопуларнијих оквира за React. [8] То је један од неколико препоручених „ланаца алата“ доступних приликом покретања нове апликације, а сви обезбеђују слој апстракције за помоћ у уобичајеним задацима.[9] Next.js захтева Node.js и може се иницијализовати помоћу npm-а .

Google је допринео пројекту Next.js, укључујући 43 pull request-a у 2019.[10] Од марта 2022. године, оквир користе многе велике веб странице, укључујући Волмарт, Apple, Најки, Netflix, TikTok, Uber, Lift и Starbucks. [11] Почетком 2020. године, Vercel је прикупио 21 милион долара у финансирању Серије А како би подржао побољшања софтвера. Оригинални аутор оквира, Гиљермо Раух, тренутно је извршни директор Vercela, а водећи одржавач пројекта је Тим Њуткенс.[12]

Историјат развоја

Next.js је први пут објављен као пројекат отвореног кода на GitHub-а 25. октобра 2016. Првобитно је развијен на основу шест принципа: тренутачно доступна функционалност која не захтева подешавање, доступност JavaScript-а, све функције су написане у JavaScript-у, аутоматско дељење кода и приказивање на серверу, подесиво преузимање података, антиципирање захтева и поједностављивање имплементације. [13]

Next.JS 2.0 је најављен у марту 2017. укључујући неколико побољшања која су олакшала рад са малим веб локацијама. Такође је повећао ефикасност израде и побољшао скалабилност функције замене модула уживо . [14]

Верзија 7.0 је објављена у септембру 2018. са унапређеним руковањем грешкама и подршком за React-ов контекст API за унапређено динамичко управљање рутама. Ова верзија такође је била прва која је надограђена на Webpack 4. [15]

Верзија 8.0 је објављена у фебруару 2019. и била је прва која је омогућила примену апликација без сервера, где је код раздвојен на анонимне функције које се извршавају по захтеву. Ова верзија је такође смањила време и ресурсе потребне за статички извоз и побољшала перформансе у односу на претходне верзије.[16]

Верзија 9.3, најављена у марту 2020, је укључивала различите оптимизације и глобалну подршку Sass (стилски језик) и CSS модуле. [17]

Дана 27. јула 2020. објављена је верзија Next.js 9.5, додајући нове могућности као што су инкрементална статичка регенерација, поновно уписивање и подршку за преусмеравања. [18]

15. јуна 2021. објављена је верзија Next.js 11, која је између осталог увела: подршку за Webpack 5, преглед функционалности за колаборативно кодирање у реалном времену „Next.js Live“ и експерименталну функцију аутоматске конверзије из Create React апликације у Next.js компатибилан образац „Create React App Migration“. [19]

26. октобра 2021, Next.js 12 је пуштен у продају, додајући Rust компајлер, чинећи компилацију бржом, подршку за AVIF, Edge Functions & Middleware и Native ESM & URL Imports. [20]

Vercel је 26. октобра 2022. објавио Next.js 13. Ово велико издање донело је нови образац рутирања у бета верзији, са додатком App Router-а који укључује подршку за распореде, компоненте React Server, стриминг и нови сет метода за преузимање података. Штавише, Vercel је најавио нови ланац алата за фронт-енд развој под називом Turbo, укључујући Turbopack као наследника Webpack-а, Turborepo за инкременталне системе израде. [21]

У мају 2023. Vercel је објавио Next.js 13.4. Ово је са собом донело стабилну верзију App Router-а, која омогућава програмерима да га користе у производњи. [22]

У октобру 2023. Vercel је објавио Next.js 14, који долази са побољшаним управљањем меморијом уз коришћење edge runtime-а. [23]

Стилизовање и функционалности

Next.js подржава стилизовање са CSS-ом, као и унапред компајлирани Sass и Scss, CSS-in-JS и стилизовани JSX . [24] Поред тога, израђен је са подршком за TypeScript и паметним пакетом. [25] Transpiler отвореног кода SWC се користи за трансформацију и превођење кода у JavaScript који може да користи претраживач. [26] Webpack, још једна алатка отвореног кода, користи се за накнадно спајање модула, међутим тренутно се замењује TurboPack-ом. [27] Сви ови алати се користе са npm-ом у терминалу. [28]

Главна карактеристика Next.js-а је његова употреба рендеровања на страни сервера како би се смањио терет веб претраживача и обезбедила побољшана безбедност[тражи се извор]. Ова функционалност омогућава да се странице богате садржајем издвајају за приказивање на страни сервера, што се може применити на било који део апликације или целокупан систем. [29]

Исто тако, ова техника се може применити и за посетиоце који први пут посећују страницу, што доприноси смањењу оптерећења веб претраживача док преузимају било које од средстава сајта. [30]

Функција "hot reloading" омогућава детекцију промена у коду и аутоматско поновно приказивање одговарајућих страница без потребе за поновним покретањем сервера. Ово значи да се измене у коду одмах приказују у веб претраживачу, иако ће неки прегледачи захтевати освежавање странице. [29]

Next.js користи рутирање засновано на страницама за погодност програмера и подржава динамичко рутирање. Друге карактеристике укључују замену "hot module"-a уживо, аутоматско раздвајање кода које укључује само код потребан за учитавање странице, и претходно преузимање странице како би се смањило време учитавања. [29]

Next.js нуди функције као што су getStaticProps и getServerSideProps за преузимање података било током процеса израде или са сваким захтевом, пружајући разноврсност за различите типове садржаја. Такође, нуди аутоматску оптимизацију слика за различите величине екрана и уређаје, побољшавајући перформансе веб странице и корисничко искуство. [31]

Next.js такође подржава инкременталну статичку регенерацију [32] и генерисање статичког сајта – компајлирана верзија веб локације се обично прави током израде и чува као .next фолдер. Када корисник упути захтев, унапред направљене верзија преко статичних HTML страница се кешује и шаље се назад. Ово чини време учитавања веома брзим, али није погодно за сваку веб локацију, посебно за интерактивне сајтове који се често мењају и користе много корисничког уноса.

Види још

Референце

  1. ^ „Next.js: brzo predstavljanje - Fragment Studio”. www.fragment-studio.com (на језику: санскрит). Приступљено 2024-04-09. 
  2. ^ „Recommended Toolchains” (HTML). React documentation (на језику: енглески). Приступљено 10. 7. 2021. 
  3. ^ Next.js Brand Guidelines, 26. 8. 2022 
  4. ^ „Develop. Preview. Ship. For the best frontend teams – Vercel” (HTML). vercel.com (на језику: енглески). Архивирано из оригинала 2021-10-06. г. Приступљено 2020-09-22. 
  5. ^ „Differences Between Static Generated Sites And Server-Side Rendered Apps”. Smashing Magazine (на језику: енглески). 2020-07-02. Приступљено 2020-10-19. 
  6. ^ а б в Thakkar, Mohit (2020), Thakkar, Mohit, ур., „Next.js”, Building React Apps with Server-Side Rendering: Use React, Redux, and Next to Build Full Server-Side Rendering Applications (на језику: енглески), Berkeley, CA: Apress: 93—137, ISBN 978-1-4842-5869-9, doi:10.1007/978-1-4842-5869-9_3, Приступљено 2020-10-20 
  7. ^ Thakkar, Mohit (2020), Thakkar, Mohit, ур., „Adding Server-Side Rendering to Your React Application”, Building React Apps with Server-Side Rendering: Use React, Redux, and Next to Build Full Server-Side Rendering Applications (на језику: енглески), Berkeley, CA: Apress: 139—152, ISBN 978-1-4842-5869-9, doi:10.1007/978-1-4842-5869-9_4, Приступљено 2020-10-20 
  8. ^ Asay, Matt (2. 12. 2019). „Why front-end development may be the new frontier”. TechRepublic (на језику: енглески). Приступљено 2020-10-20. 
  9. ^ Lukman, Adebiyi Adedotun (2020-09-17). „Comparing Styling Methods In Next.js”. Smashing Magazine (на језику: енглески). Приступљено 2020-10-20. 
  10. ^ Asay, Matt (1. 2. 2020). „An insider's look at Google's web framework contributions to Next.js and more”. TechRepublic (на језику: енглески). Приступљено 2020-10-19. 
  11. ^ Thakkar, Mohit (2020), Thakkar, Mohit, ур., „Next.js”, Building React Apps with Server-Side Rendering: Use React, Redux, and Next to Build Full Server-Side Rendering Applications (на језику: енглески), Berkeley, CA: Apress: 93—137, ISBN 978-1-4842-5869-9, doi:10.1007/978-1-4842-5869-9_3, Приступљено 2020-10-20 
  12. ^ Donovan, Ryan (2020-10-07). „Static site generation with single page app functionality? That's what's coming Next(.js)” (html). Stack Overflow Blog (на језику: енглески). Приступљено 2020-10-20. 
  13. ^ Krill, Paul (2016-10-31). „Next step after Node.js: Framework for 'universal' JavaScript apps”. InfoWorld (на језику: енглески). Приступљено 2020-10-20. 
  14. ^ Krill, Paul (2017-03-28). „Next.js 2.0 plays better with React and JavaScript”. InfoWorld (на језику: енглески). Приступљено 2020-10-20. 
  15. ^ Krill, Paul (2018-09-21). „Next.js 7 framework compiles faster, supports WebAssembly”. InfoWorld (на језику: енглески). Приступљено 2020-10-20. 
  16. ^ Krill, Paul (2019-02-14). „Next.js 8 now supports serverless apps”. InfoWorld (на језику: енглески). Приступљено 2020-10-20. 
  17. ^ Krill, Paul (2020-03-12). „Next.js upgrade emphasizes static site generation”. InfoWorld (на језику: енглески). Приступљено 2020-10-20. 
  18. ^ Krill, Paul (27. 7. 2020). „Next.js adds incremental static pages regeneration”. InfoWorld. Архивирано из оригинала 2. 10. 2020. г. Приступљено 22. 9. 2020. 
  19. ^ „Next.js 11”. Приступљено 2021-07-10. 
  20. ^ „Next.js 12”. nextjs.org (на језику: енглески). Приступљено 2021-10-27. 
  21. ^ Orbán, Balázs (2022-10-25). „Next.js 13”. nextjs.org (на језику: енглески). Приступљено 2023-06-09. 
  22. ^ Markbåge, Sebastian, Tim Neutkens (2023-05-04). „Next.js 13.4”. nextjs.org (на језику: енглески). Приступљено 2023-06-07. 
  23. ^ „Next.js 14.0.0”. nextjs.org (на језику: енглески). 2023-12-08. Приступљено 2023-11-26. 
  24. ^ Lukman, Adebiyi Adedotun (2020-09-17). „Comparing Styling Methods In Next.js”. Smashing Magazine (на језику: енглески). Приступљено 2020-10-20. 
  25. ^ Krill, Paul (14. 2. 2019). „Next.js 8 now supports serverless apps”. InfoWorld. Архивирано из оригинала 2. 10. 2020. г. Приступљено 22. 9. 2020. 
  26. ^ Next.js”. nextjs.org (на језику: енглески). Приступљено 2023-08-19. 
  27. ^ Next.js”. nextjs.org (на језику: енглески). Приступљено 2023-08-19. 
  28. ^ Asay, Matt (1. 2. 2020). „An insider's look at Google's web framework contributions to Next.js and more”. TechRepublic (на језику: енглески). Приступљено 2020-10-19. 
  29. ^ а б в Thakkar, Mohit (2020), Thakkar, Mohit, ур., „Next.js”, Building React Apps with Server-Side Rendering: Use React, Redux, and Next to Build Full Server-Side Rendering Applications (на језику: енглески), Berkeley, CA: Apress: 93—137, ISBN 978-1-4842-5869-9, doi:10.1007/978-1-4842-5869-9_3, Приступљено 2020-10-20 
  30. ^ Thakkar, Mohit (2020), Thakkar, Mohit, ур., „Adding Server-Side Rendering to Your React Application”, Building React Apps with Server-Side Rendering: Use React, Redux, and Next to Build Full Server-Side Rendering Applications (на језику: енглески), Berkeley, CA: Apress: 139—152, ISBN 978-1-4842-5869-9, doi:10.1007/978-1-4842-5869-9_4, Приступљено 2020-10-20 
  31. ^ „getting-started-with-next-js”. GFG. 12 Mar, 2024. Приступљено 4 April 2024.  Проверите вредност парамет(а)ра за датум: |date= (помоћ)
  32. ^ „Incremental Static Regeneration with Next.js”. Vercel (на језику: енглески). Приступљено 2022-03-06. 

Спољашње везе

Content Disclaimer

Informasi ini disarikan dari Wikipedia dan disajikan kembali untuk tujuan edukasi. Konten tersedia di bawah lisensi CC BY-SA 3.0. Kami tidak bertanggung jawab atas ketidakakuratan data yang bersumber dari kontribusi publik tersebut.

  1. The information displayed on this website is sourced in part or in whole from Wikipedia and has been adapted for the purpose of restating it. We strive to provide accurate and relevant information, however:
  2. There is no guarantee of absolute accuracy. Wikipedia is an open, collaborative project that can be edited by anyone, so information is subject to change.
  3. It is not intended to constitute professional advice. The content displayed is for informational and educational purposes only. For important decisions (e.g., medical, legal, or financial), please consult a professional.
  4. Content copyright. Wikipedia is licensed under the Creative Commons Attribution-ShareAlike License (CC BY-SA). This means that content may be reused with appropriate attribution and shared under a similar license.
  5. Responsible use. Any risk arising from the use of information from this website is entirely the responsibility of the user.