Next.js: Difference between revisions

Revision as of 20:32, 19 November 2024

Revision as of 20:33, 19 November 2024

Line 26:

== Background ==

Next.js is a [[React (web framework)|React]] framework that enables several extra features, including [[server-side rendering]] and [[static rendering]].<ref name=compareStatic>{{cite web |date=2020-07-02 |title=Differences Between Static Generated Sites And Server-Side Rendered Apps |url=https://www.smashingmagazine.com/2020/07/differences-static-generated-sites-server-side-rendered-apps/ |access-date=2020-10-19 |website=[[Smashing Magazine]] |language=en}}</ref> React is a [[JavaScript library]] that is traditionally used to build web applications rendered in the client's browser with JavaScript.<ref name=thakkar1>{{cite web |last=Thakkar |first=Mohit |title=Next.js |date=2020 |url=https://doi.org/10.1007/978-1-4842-5869-9_3 |work=Building React Apps with Server-Side Rendering: Use React, Redux, and Next to Build Full Server-Side Rendering Applications |pages=93–137 |editor-last=Thakkar |editor-first=Mohit |place=Berkeley, CA |publisher=[[Apress]] |language=en |doi=10.1007/978-1-4842-5869-9_3 |isbn=978-1-4842-5869-9 |s2cid=241224880 |access-date=2020-10-20}}</ref> Developers recognize several problems with this strategy however, such as not catering to users who do not have access to JavaScript or have disabled it, potential security issues, significantly extended page loading times, and harm to the site's overall [[search engine optimization]].<ref name=thakkar1 /> Frameworks such as Next.js sidestep these problems by allowing some or all of the website to be rendered on the server-side before being sent to the client.<ref name=thakkar1 /><ref name=thakkar2>{{ciecite web |last=Thakkar |first=Mohit |title=Adding Server-Side Rendering to Your React Application |date=2020 |url=https://doi.org/10.1007/978-1-4842-5869-9_4 |work=Building React Apps with Server-Side Rendering: Use React, Redux, and Next to Build Full Server-Side Rendering Applications |pages=139–152 |editor-last=Thakkar |editor-first=Mohit |place=Berkeley, CA |publisher=[[Apress]] |language=en |doi=10.1007/978-1-4842-5869-9_4 |isbn=978-1-4842-5869-9 |s2cid=216333955 |access-date=2020-10-20}}</ref> Next.js is one of the most popular frameworks for React.<ref>{{cite web |first=Matt |last=Asay |title=Why front-end development may be the new frontier |url=https://www.techrepublic.com/article/why-front-end-development-may-be-the-new-frontier/ |access-date=2020-10-20 |website=[[TechRepublic]] |date=2 December 2019 |language=en}}</ref> It is one of several recommended "toolchains" available when starting a new app, all of which provide a layer of abstraction to aid in common tasks.<ref name="SmashingStyle">{{cite web |last=Lukman |first=Adebiyi Adedotun |date=2020-09-17 |title=Comparing Styling Methods In Next.js |url=https://www.smashingmagazine.com/2020/09/comparison-styling-methods-next-js/ |access-date=2020-10-20 |website=[[Smashing Magazine]] |language=en}}</ref> Next.js requires [[Node.js]] and can be initialized using [[npm]].

[[Google]] has contributed to the Next.js project, including 43 pull requests in 2019.<ref name="insiders">{{cite web |last=Asay |first=Matt |date=February 1, 2020 |title=An insider's look at Google's web framework contributions to Next.js and more |url=https://www.techrepublic.com/article/insiders-look-at-googles-web-framework-contributions-to-next-js-and-more/ |access-date=2020-10-19 |website=[[TechRepublic]] |language=en-US}}</ref> As of October 2024, the framework is used by many large websites, including [[Walmart]], [[Apple Inc|Apple]], [[Nike, Inc.|Nike]], [[Netflix]], [[TikTok]], [[Uber]], [[Lyft]], [[Starbucks]] and [[Spotify]].<ref name=thakkar1 /><ref>{{cite web |title=Spotify.com Technology Stack |url=https://www.wappalyzer.com/lookup/spotify.com/ |website=Wappalyzer |access-date=15 October 2024}}</ref> In early 2020, Vercel raised $21 million in Series A funding to support improvements to the software.<ref name=simplify /> The framework's original author, Guillermo Rauch, is currently the CEO of [[Vercel]], and the project's lead maintainer is Tim Neutkens.<ref>{{cite web |last=Donovan |first=Ryan |date=2020-10-07 |title=Static site generation with single page app functionality? That's what's coming Next(.js) |url=https://stackoverflow.blog/2020/10/07/qa-with-the-creators-of-next-js-on-version-9-5/ |access-date=2020-10-20 |website=Stack Overflow Blog |language=en-US |format=html}}</ref>