用Next.js快速上手React服务器渲染

什么是服务端渲染？

• 服务端渲染，是指页面的渲染和生成由服务器来完成，并将渲染好的页面返回客户端。而客户端渲染是页面的生成和数据的渲染过程是在客户端（浏览器或APP）完成。

• 随着前后端分离模式的兴起，从服务端渲染到服务端渲染的演进，前端Web App给前端开发带来了很大的便利，并减轻后端服务器压力。

• 前后端解耦，让前端专注做好用户UI层，专注于提升用户体验，让后端专注于业务逻辑处理，分离成微服务，专心做好一件事。

• 前后端分离前的服务端渲染技术有：PHP，ASP，JSP等方式，分离后的前端SPA（单页面应用）渲染拥有独立的路由和页面渲染（React，Vue和Angular等），而SPA的最大问题是对SEO不友好，当项目对SEO有需求时，SPA就不是一个好的选择。

• 近两年来，React和Vue也开始支持服务端渲染（Server Side Render ），行业内也有这方面的实践，其中掘金就使用Vue的SSR功能做了全站服务端渲染，且效果良好。

Next.js是什么？它有什么优点？

• Next.js是一个基于React的一个服务端渲染简约框架。它使用React语法，可以很好的实现代码的模块化，有利于代码的开发和维护。

Next.js带来了很多好的特性：

• 默认服务端渲染模式，以文件系统为基础的客户端路由
• 代码自动分隔使页面加载更快
• （以页面为基础的）简洁的客户端路由
• 以webpack的热替换为基础的开发环境
• 使用React的JSX和ES6的module，模块化和维护更方便
• 可以运行在Express和其他Node.js的HTTP 服务器上
• 可以定制化专属的babel和webpack配置