今天的進度是準備好開發 Next.js 所需的環境，預計明天開始寫程式，後天才會有開始有一些 FP 相關內容。

安裝 VSCode

下載連結

我喜歡 portable 的 .zip 或是 .tar.gz 版本，只要解壓縮後的目錄中新增 /data ，就可以把所有設帶著走。

安裝 Node.js

下載連結

安裝 Docker

下載連結

安裝 MongoDB

docker run -d -p 27017:27017 --name mongo mongo

-d : detach，背景執行
-p : port forwarding
-name : container name

安裝完成後可以用以下指令確認 container 狀態

docker ps

安裝 Next.js

1. 使用 VSCode 開啟你平常的工作資料夾
   

2. 開啟終端機執行以下指令，如果有出現版本號表示 Node.js 安裝成功

   node -v
   

3. 在你的工作資料夾執行以下指令，新增 next 專案

   npx create-next-app
   

4. 選擇以下選項
   

5. VSCode 開啟 /nextjs-effect-lab

6. 執行以下指令

   npm run dev
   

7. 瀏覽器開啟 http://localhost:3000 即可看到專案成功開啟

調整 TS Server 版本

在專案根目錄加入以下設定，確保目前專案所使用的 typescript server 版本正確

{
  "typescript.tsdk": "node_modules\\typescript\\lib"
}

設定 prettier

進行以下設定可以統一程式碼風格，自動把程式碼排的美美的，提升開發體驗，也能確保開發團隊不會因為風格不一致而造成衝突。

1. VSCode > settings

2. formt on save 打勾
   

3. default formatter 選擇 prettier
   

4. 新增 .prettierrc 到根目錄，可以依照團隊默契進行設定

{
  "semi": false,
  "singleQuote": true
}