什么是gatsby
- 官方介紹為Blazing-fast static site generator for React(用于React的超快靜態(tài)站點生成器)。
不再為web技術落后而頭痛
- 享受最新Web前端技術的強大功能--React.js芭商，Webpack哑了，現(xiàn)代JavaScript和CSS等等，所有這一切都將啟動并等待您的開始缰泡。
使用你自定義的數據
- Gatsby豐富的數據插件生態(tài)系統(tǒng)允許您使用您想要的數據構建網站 - 來自一個或多個來源：使用GraphQL將數據從無頭CMS刀荒，SaaS服務，API棘钞，數據庫缠借，文件系統(tǒng)等更直接地導入您的頁面。
輕松發(fā)布到互聯(lián)網
- Gatsby.js是互聯(lián)網化的宜猜。 你可以不用理會數據庫和服務器的復雜部署泼返，以及昂貴，耗時的設置成本姨拥，維護和縮放恐懼绅喉。 Gatsby.js將您的網站構建為“靜態(tài)”文件，可以輕松部署在數十種服務上叫乌。
使您的網站面向未來
- 不要用過去十年的技術建立一個網站柴罐。 網絡的未來是移動的，JavaScript和API - JAMstack憨奸。 每個網站是一個Web應用程序革屠，每個Web應用程序是一個網站。 Gatsby.js是你一直在等待的通用JavaScript框架。
靜態(tài)漸進式Web應用程序
- Gatsby.js是一個靜態(tài)PWA（Progressive Web App）生成器似芝。 您可以將代碼和數據分開那婉。 Gatsby只加載關鍵的HTML，CSS国觉，數據和JavaScript吧恃，以便您的網站加載盡可能快。 一旦加載麻诀，Gatsby預取其他網頁的資源痕寓，所以點擊網站感覺非常快蝇闭。
超越競爭
Gatsby.js建立最快的網站呻率。 不需要等待請求時生成頁面，而是預先生成頁面呻引，并將其提升到全球服務器云端 - 隨時隨地傳送給用戶礼仗，無論他們身在何處。
GATSBY的使用
windows環(huán)境中
- 首先安裝全局的gatsby
npm install -g gatsby - 然后安裝windows環(huán)境安裝工具：
npm install windows-build-tools -g
因為后面可能會安裝對應的python等逻悠； - .創(chuàng)建一個新的網站項目元践，命令行定位到相應的目錄：
gatsby new hello-gatsby - 切換到當前目錄
cd hello-gatsby - 啟動服務
gatsby develop - Gatsby會在 public 目錄下構建生產環(huán)境用的優(yōu)化過的靜態(tài)網站所需的一切靜態(tài)資源、靜態(tài)頁面與js代碼童谒。如果要發(fā)布到自己的網站空間上单旁，可以直接把此目錄下面所有東西(除.map為后續(xù)的文件名的文件)丟過去自己的空間。
gatsby build
工作原理
GraphQL
GraphQL是在API能提供的數據范圍內饥伊，提供查詢能力的語言象浑。GraphQL在您的API中提供了對數據的完整和可理解的描述，使客戶能夠準確地詢問他們需要什么琅豆，并且更容易隨時間發(fā)展API愉豺，并支持強大的開發(fā)人員工具。
image.png
GraphQL的特點
1.入口統(tǒng)一茫因，合并請求：不管請求什么資源蚪拦，url都是一樣的。這精簡了不同場景下形態(tài)各異的API數量;
2. 自定義返回值：在REST中冻押，資源的返回結構與返回數量是由服務端決定驰贷；在GraphQL，服務端只負責定義哪些資源是可用的翼雀，由客戶端自己決定需要得到什么資源饱苟，避免讓API消費者取到對它來說并沒有用的冗余數據孩擂。
3.數據的關聯(lián)性：在query里狼渊，通過id，可以把多個數據源或Api直接關聯(lián)起來
4.方便的接口調試工具：GraphiQL工具，文檔與調試統(tǒng)一
PWA
Progressive Web App, 簡稱 PWA狈邑，是提升 Web App 的體驗的一種新方法城须，能給用戶原生應用的體驗。PWA 能做到原生應用的體驗不是靠特指某一項技術米苹，而是經過應用一些新技術進行改進糕伐，在安全、性能和體驗三個方面都有很大提升蘸嘶，PWA 本質上是 Web App良瞧，借助一些新技術也具備了 Native App 的一些特性，兼具 Web App 和 Native App 的優(yōu)點训唱。
