淺談 Jamstack 架構
前言
前陣子寫 Next.js 筆記時和朋友們討論 Gatsby.js「The static dynamic site generator for dynamic web developers」部分時提到了 Jamstack，其中一位夥伴說了：
那 Jamstack 跟我們寫框架的 SPA 網站不是一樣嗎？
提問者後續在其他人的解釋下才理解差異。
Node.js
Next.js 入門：由 CRA 至 Gatsby 與 Next.js
此文不會講解為什麼 SSR 對 SEO 和 LCP 有幫助的原因
如果不懂 LCP 是什麼，可見 Google 關於 LCP 指標的說明
如果連 SPA 和 SSR 是什麼都不太懂，可以參考 Huli 大大寫的跟著小明一起搞懂技術名詞：MVC、SPA
Next.js 入門：使用 next export 輸出 static file
此篇以 Next.js 11.0.1 版為主，內容僅供參考。
若要使用 Next.js SSG 額外輸出 static HTML，不打算把 SSG 的內容置於 Next.js 的 Node.js Server 上的話，
Mac 安裝 NVM
很久沒在 Mac 裝 NVM 了，這裡也順便重新整理之前的筆記。
平常在開發前端時，基於 Node.js 生態圈龐大，不同套件有不同版本的限制，例如某些新功能限定某版號以後才有，不同前後端專案可能所需 Node.js 版本也不同，總不可能每次都乖乖升級降級吧！
我們需要一個工具幫我們管理 Node.js 版本，這時候我們就可以透過 nvm 來管理、
Next.js 入門：建立專案與專案結構
建立專案
系統要求
MacOS、Windows 和 Linux 都沒差
只要有 Node.js 12.0 或更高版本即可
安裝與建立 create-next-app 專案
打開 terminal 輸入
npx create-next-app ${專案名稱}
等 terminal 跑完即可。