1.什么是Gatsby以及静态应用的优势
Gatsby是一个基于react的静态站点html生成器
官网： https://www.gatsbyjs.cn/
解决单页应用的2大问题。
- 静态应用的优势
- 访问速度快
- 更利于 SEO 搜索引擎的内容抓取
- 部署简单
- Gatsby 总览
- 基于 React 和 GraphQL, 结合了 webpack, babel, react-router 等前端领域中最先进工具，开发人员开发体验好；
- 采用数据层和UI层分离而不失 SEO 的现代前端开发模式.对SEO非常友好；
- 数据预读取，在浏览器空闲的时候预先读取链接对应的页面内容.使静态页面拥有 SPA 应用的用户体验，用户体验好；
- 数据来源多样化: Headless CMS, markdown, API;
- 功能插件化， Gatsby 中提供了丰富且功能强大的各种类型的插件，用什么装什么
2.创建Gatsby项目
- 全局安装脚手架工具
npm install gatsby-cli -g
- 创建项目
创建:gatsby new project-name https://github.com/gatsbyjs/gatsby-starter-hello-world
启动:gatsby develop 或 npm start
访问:localhost:8000
3.基于文件的路由系统
Gatsby 框架内置基于文件的路由系统，页面组件被放置在 src/pages/ 文件夹中。