什么是Next.js,它的用途是什么?
Next.js本质上是一个建立在React之上的React框架。
现在,因为它是一个框架,它为我们提供了一系列的功能,可以帮助我们更快、更好地完成工作。事实上,Next.js在开发者中被称为 "生产用React框架"。
为什么呢?
嗯,当你构建React应用程序时,你经常需要从头开始设置很多东西。
你需要弄清楚。
- 使用什么路由器
- 使用哪个CSS包
- 哪种设计系统等等
基本上,你需要弄清楚很多不同的东西,但Next.js直接提供了所有这些东西,所以你几乎可以立即开始使用。
我应该使用Next.js还是应该使用React?
这与上面的答案有关,但让我们把它们分解一下。
因为Next.js是建立在React之上的,你可以得到很多开箱即用的东西,比如你不需要整合的基于文件的路由系统,已经内置的CSS模块,所以你可以立即开始使用它们,同时,你还可以得到搜索引擎优化(SEO)和性能的好处。

而对于React本身,你需要从头开始设置很多相同的东西,并在webpack中构建它,这可能会变得非常复杂。事实上,我曾经参与过几个React项目,在这些项目中,我们必须在最初的两周时间里,简单地建立我们所需要的一切,然后才能真正运行和开始生产。
但有了Next.js,你就可以跳过这一切,节省时间和金钱。
Next.js比React好吗?你认为Next.js会取代React吗?
这是个有趣的问题,它确实取决于你的需求,但我想说的是。
即使是React的创造者也在使用Next.js,所以这就说明了问题。甚至他们的文档平台也是用 Next.js 构建的,所以这是一个很好的迹象,表明 React 的创建者相信 Next.js。
学习Next.js的最佳方式是什么?
因为Next.js是建立在React之上并使用React的,我想说的是,最好的方法是先学习React,然后再学习Next.js。
这将有助于你学习组件的概念以及它们如何工作,React中的原子和分子是什么,如何组合组件等等。所有这些都将为你学习Next.js打下良好的基础。
我建议使用 "Create React App"获得一些经验,这基本上是React的引导版本,只是建立一些基本的应用程序来开始。

一旦你对React有了一点经验和了解,你就可以继续跳到Next.js上,享受那些开箱即用的好处。
不要忘记对两者进行比较,因为作为一个开发者,你能做的最好的事情之一就是比较语言和框架,看看什么最适合你的需求。
为什么Next.js对SEO有好处?(搜索引擎优化)
Next.js与谷歌合作,所以来自Lighthouse(谷歌的用户体验改进工具)的任何生产信息或特定功能,如最大的Contentful Paint、页面加载速度、首次点击时间和其他性能优化功能,都被植入Next.js和它的构建方式。

这对SEO来说是巨大的,因为这意味着用Next.js构建的平台或应用程序是为了满足和超越谷歌一直在实施并将继续实施的用户体验因素。(用户体验排名信号目前是他们未来的主要焦点)。
谷歌很少分享可以帮助你表现的信息,所以这是一个巨大的好处。
不谈太多细节,React通过干净、具体的代码帮助你实现这一点,SEO机器人更容易抓取,这样它就能理解你的页面背景和内容,然后在搜索结果(SERPS)中更好、更频繁地推荐你。
它还内置了预加载和懒加载,以帮助改善用户体验和页面加载速度,以及其他有助于阻止元素闪烁的功能。
这意味着当你试图点击它们时,不会有随机的图像移动
此外,如果用户将鼠标悬停在页面上的一个链接上,那么这个新的URL将预先开始在后台加载该页面,所以如果用户点击打开它,他们将获得更快的体验。
同样,在页面更远处的图像和资产只有在用户接近它们时才会加载,这意味着你不需要一次性加载整个页面,而是在用户正在互动的简短部分。
Next.js甚至可以帮助那些不使用大量动态内容的静态网站进行超快速缓存,这样缓存的页面加载速度就会快得惊人。
正如你所看到的,Next.js对注重SEO的网站有很多好处。
什么样的公司在使用Next.js?你有什么例子吗?
有很多真正受欢迎的网站在使用Next.js,如Netflix、Hulu、Twitch、GitHub等。
你可以在这里查看Next.js的网站展示,这个展示是不断更新的。

在计划自己的项目建设或升级时,看到如此庞大的企业使用同样的框架是非常棒的,因为它显示了Next.js对大流量和用户群的可扩展性,让你有信心用它来创造。
顺便说一句,展示中提到的很多公司也是其特定行业中转换率优化领域(CRO)的主要领导者和冠军。
这一点特别有意思,因为优先考虑CRO的网站真正专注于确保用户体验是最好的,这样他们就可以降低跳出率和流失率,增加销售。因此,如果他们使用Next.js,那么你就知道他们已经做了研究和测试,以确保这是他们的最佳选择,这意味着它也可以成为你的最佳选择。
Next.js是难学还是易学?
这与我上面关于学习Next.js的最佳方法的回答类似,但我觉得要成为一个使用Next.js或任何语言或框架的优秀开发者,最好的方法是不要只听从别人给你的东西。你需要自己进行测试。
这样一来,你可以尝试也了解该语言或框架是如何构建的,并了解一些挑战是什么,以及如何克服它们,也会帮助你欣赏很多这些问题被绕过的时候。
不过还是那句话,先开始学习React,建立一些基本的应用程序,一旦你有了React的基础,再转到Next.js。
一旦你完成了这些,我推荐一些方法来帮助你更快地学习。
#1️.看例子
去Next.js的文档,看看那里的应用是如何构建的,边看边构建并应用你所学的东西。这是最快和最简单的学习方法。这样你就会开始了解你正在学习的所有这些功能,并开始了解你如何在自己的项目中使用它们。
#2️.遵循一个结构
话虽如此,但文档有时会让人有点不知所措,所以如果你想有一个固定的学习结构来帮助你快速掌握和应用你所学的知识,那么你也可以跟随Next.js和React课程。
#3️.看看别人是如何使用的
另一个快速学习的好方法是看Next.js的GitHub问题线程,看看你是否能理解问题和人们在文件更新中实施的解决方案。
这不是一个固定的学习方法,但它可以帮助你开始拼凑不同的概念,看看人们是如何解决问题的,并以此为基础进行构建。