根據wiki Web template system 條目，Static site generactor (SSG) 指的是可能有使用 tepmlate lanugage、可以用來產生網頁、不用重撰相同內容的工具。\n除了重覆的網頁內容外，可能也包含CSS，例如 FrontPage 和 Dreamweaver 這種網頁編輯器。
SSG 不是近幾年才產生的概念。例如 Jekyll，非常流行的SSG，早在2008年的時候就已經誕生了。
\nSSG是前端的其中一種解決方案，選用不同的技術當前端的解決方案時，應該選擇最適合問題本身的方案，沒有所謂的最佳解。
\nGatsbyJs 是個基於 js、react 的SSG框架。
\nJAMStack 指的是使用 javascript、API、Markup的技術線。所謂的Markup，在這裡指的是包含一些已經被事先定義好「顯示語義」的標記語言。例如Html就是在網頁中被廣範使用的 Markup stack。
JAMStack 會有一種特徴：程式的邏輯大多會在client端，而不緊緊依賴 backend。
\n這幾年講到JAMStack，M有時指的是 Markdown。
GatsbyJs 捏供 plugin，可以用 Markdown 來寫網頁內容。
\nGatsbyJS 是一個 SSG框架，本身使用React做為視圖層。在資料來源層，使用了 GraphQL 做了一層抽象。除了框架本身會自動從指定的檔案路徑內取得內容外，GraphQL 社群也提供了非常多的 plugin，用來取得、解析資料。例如gatsby-transformer-remark，可以用來解析 markdown。
GatsbyJS 主要的程式設定檔有三個：
\n另外 src/pages 資料夾底下的檔案，會被 File System Route API 自動解析，產生對應的網頁內容。
目前三個預設的js，似乎都還不支援 EMCAscript module，必須使用 common script 撰寫。
gatsby-config.js 裡面包含了跟框架及網頁有關的設定檔。包含使用的 plugins、proxy、 siteMetaData等等。
\n其中 plugins的使用很重要，可以從豐富的 plugin librarys 中，找到很多有用的 plugin，加速網站的開發、或是增加網站的功能等。
siteMetaData 可以用來存放一些 meta資訊，例如作者、email等等資訊。
gatsby-browser.js 中包含一些在Browser中、框架定義的事件，例如 onClientEntry。另外也可以攜代一些網頁元件當作全域的元件。
gatsby-cnode.js 相對復雜，它包含了產生頁面、產生gastby field 的 API、及在建置階段中的一些事件處理。之後再整理一下它的API。
\n\n","frontmatter":{"title":"Hello, gatsby","date":"November 13, 2021","description":null,"tags":["gatsby"],"template":"post"}}},"pageContext":{"slug":"/2021-11-13-gatsby-js-note/","previous":{"node":{"fields":{"slug":"/2020-10-16--Ref_note.md/2020-10-16--Ref_note/"},"frontmatter":{"date":"16 October, 2020","title":"rust RefCell、Cell筆記","tags":["rust","archive"]}}},"next":{"node":{"fields":{"slug":"/2021-11-20-gatsby-js-config/"},"frontmatter":{"date":"20 November, 2021","title":"gatsby config api","tags":["gatsby"]}}}}},"staticQueryHashes":["2841359383","3810545343","916993862"]}懶了好久，剛剛看一下突然發現我寫錯好久…
\n