使用Next.js＋Netlify自動上版服務輕鬆架設部落格
Next.js是一種React為主體的Server Side Rendering框架，也有整合Webpack與Babel等設定，對於開發者來說十分方便
本次主要來利用的是Next.js的SSG (Static Site Generation)功能
Next.js會將固定頁面在打包專案的同時便生成靜態頁面，這個功能非常適合定時更新的靜態內容，例如部落格。
首先，開啟command line 視窗，先在準備好產生新專案的目錄下輸入以下指令：npx create-next-app <你的專案名> --example "https://github.com/wutali/nextjs-netlify-blog-template"
如果要用Yarn來進行，則可以輸入：yarn create next-app <你的專案名> --example "https://github.com/wutali/nextjs-netlify-blog-template"
注意，這裡專案名不能使用大寫，建議使用“-”來做間隔，如圖所示
接著會看到如下的專案結構：
在這生成好的專案中，只要在 content/post 裡面新增新的MDX檔案，並在裡面進行編輯，即可產生新頁面，因為預設的格式設定，以經在src資料夾準備好了
MDX檔案的內容格式，已經在預設生成的檔案內容中示範
一般HTML內容也能直接適用
也有支援YouTube影片或是Twitter貼文的直接嵌入
實際的效果可以看這個部落格模板的範例網站：https://nextjs-netlify-blog-template.netlify.app/
接下來就上讓部落格上線的時候了
這裡提供自動上版的方案，需要先準備：
1. Netlify帳號（靜態網頁用帳號免費）
2. 能夠支援Netlify自動上版系統的線上版本控制服務的帳號：GitHub BitBucket GitLab...
3. 把編輯完成的部落格push到線上版控中
接下來登入Netlify後，從你的版控帳號選擇要部署的專案，點下 "New Site From Git"
接著就會看到：
接下來把你的專案權限授權給Netlify，並且指定好專案中打包時所需的指令（這裡是使用預設值，這裡已經與Next.js有良好的整合），不需要再修改設定
接下來就按下Deploy就能把部落格部署上去囉，可以去Log看看部署過程的記錄
另外別忘了給前往"site setting"設定部落格設定一個好名字
接著就能去看看部署成果囉
參考來源網站：
Next.js blogging template for Netlify: https://github.com/wutali/nextjs-netlify-blog-template
