什么是gatsby
- 官方介绍为Blazing-fast static site generator for React(用于React的超快静态站点生成器)。
不再为web技术落后而头痛
- 享受最新Web前端技术的强大功能--React.js，Webpack，现代JavaScript和CSS等等，所有这一切都将启动并等待您的开始。
使用你自定义的数据
- Gatsby丰富的数据插件生态系统允许您使用您想要的数据构建网站 - 来自一个或多个来源：使用GraphQL将数据从无头CMS，SaaS服务，API，数据库，文件系统等更直接地导入您的页面。
轻松发布到互联网
- Gatsby.js是互联网化的。 你可以不用理会数据库和服务器的复杂部署，以及昂贵，耗时的设置成本，维护和缩放恐惧。 Gatsby.js将您的网站构建为“静态”文件，可以轻松部署在数十种服务上。
使您的网站面向未来
- 不要用过去十年的技术建立一个网站。 网络的未来是移动的，JavaScript和API - JAMstack。 每个网站是一个Web应用程序，每个Web应用程序是一个网站。 Gatsby.js是你一直在等待的通用JavaScript框架。
静态渐进式Web应用程序
- Gatsby.js是一个静态PWA（Progressive Web App）生成器。 您可以将代码和数据分开。 Gatsby只加载关键的HTML，CSS，数据和JavaScript，以便您的网站加载尽可能快。 一旦加载，Gatsby预取其他网页的资源，所以点击网站感觉非常快。
超越竞争
Gatsby.js建立最快的网站。 不需要等待请求时生成页面，而是预先生成页面，并将其提升到全球服务器云端 - 随时随地传送给用户，无论他们身在何处。
GATSBY的使用
windows环境中
- 首先安装全局的gatsby
npm install -g gatsby - 然后安装windows环境安装工具：
npm install windows-build-tools -g
因为后面可能会安装对应的python等； - .创建一个新的网站项目，命令行定位到相应的目录：
gatsby new hello-gatsby - 切换到当前目录
cd hello-gatsby - 启动服务
gatsby develop - Gatsby会在 public 目录下构建生产环境用的优化过的静态网站所需的一切静态资源、静态页面与js代码。如果要发布到自己的网站空间上，可以直接把此目录下面所有东西(除.map为后续的文件名的文件)丢过去自己的空间。
gatsby build
工作原理
GraphQL
GraphQL是在API能提供的数据范围内，提供查询能力的语言。GraphQL在您的API中提供了对数据的完整和可理解的描述，使客户能够准确地询问他们需要什么，并且更容易随时间发展API，并支持强大的开发人员工具。
image.png
GraphQL的特点
1.入口统一，合并请求：不管请求什么资源，url都是一样的。这精简了不同场景下形态各异的API数量;
2. 自定义返回值：在REST中，资源的返回结构与返回数量是由服务端决定；在GraphQL，服务端只负责定义哪些资源是可用的，由客户端自己决定需要得到什么资源，避免让API消费者取到对它来说并没有用的冗余数据。
3.数据的关联性：在query里，通过id，可以把多个数据源或Api直接关联起来
4.方便的接口调试工具：GraphiQL工具，文档与调试统一
PWA
Progressive Web App, 简称 PWA，是提升 Web App 的体验的一种新方法，能给用户原生应用的体验。PWA 能做到原生应用的体验不是靠特指某一项技术，而是经过应用一些新技术进行改进，在安全、性能和体验三个方面都有很大提升，PWA 本质上是 Web App，借助一些新技术也具备了 Native App 的一些特性，兼具 Web App 和 Native App 的优点。
