React服务端渲染框架Next.js入门教程

React服务端渲染框架Next.js入门教程

https://www.bilibili.com/video/BV13441117KK * 1

01节_Next.js简介和手动创建项目
02节_creat-next-app快速创建项目
03节_Next.js的Page和Conponent使用
04节_路由的标签跳转和编程跳转
05节_路由跳使用query传递参数和接受参数
06节_路由的6个钩子事件

//routeChangeStart
//routeChangeComplete
//beforeHistoryChange
//routeChangeError
//hashChangeStart
//hashChangeComplete

Router.events.on('routeChangeStart',()=>{})

07节_在getInitialProps中用Axios获取远端数据
08节_使用Style JSX编写页面的CSS样式

<style jsx>
{
`
	div{color:blue;}
`
}
</style>

09节_LazyLoading实现模块懒加载

import dynamic from 'next/dynamic'
next 动态加载_LazyLoading实现模块懒加载 组件
js import('') 动态加载js lazy

_10节_自定义Head更加友好的SEO操作

自定义head标签组件 加入

11节_在Next.js框架下AntDesignUI的使用
12节_Next.js打包中的那些坑

2019

next9 react16.9

Xiaojiejie.getInitialProps

引入库和css 在next.config.js

.babelrc 配置

_app.js 引入css app