PART 1 先了解專案需求，再思考如何實作



01 需求訪談

1.1 傾聽客戶的需求

1.2 向客戶推薦解決問題的方法



02 撰寫需求規格書

2.1 專案分析

2.2 需求規格

2.3 新手接案的注意事項

2.4 如何避免接案後無法完成功能交付的困境



PART 2 開發前環境介紹& 設定



03 開發前環境介紹＆設定

3.1 Node.js

3.2 nvm

3.3 Git

3.4 Yarn

3.5 VSCode



PART 3 寫程式所需的基礎常識（Node.js）



04 寫程式時該注意的基本原則

4.1 正確的宣告變數

4.2 有意義的命名

4.3 避免重複的程式碼

4.4 避免寫出大眾難以理解的程式

4.5 好的註解

4.6 錯誤處理 & 日誌（log）



05 認識 Node.js 專案

5.1 建立 Node.js 程式

5.2 執行 Node.js

5.3 認識專案管家：「package.json」

5.4 善用 scripts （腳本）執行程式

5.5 使用 license 保護自己的權益

5.6 取得筆者專案原始碼



06 用 Yarn 安裝及控管套件

6.1 套件對工程師的幫助

6.2 如何找出適合的套件

6.3 安裝套件，觀察安裝後目錄結構的變化

6.4 控制套件版本範圍

6.5 下關鍵字找工具的方法



07 善用「.env」管理環境變數，幫你快速遷移專案

7.1 為什麼專案需要環境變數？

7.2 環境變數的使用時機

7.3 分析專案中哪些參數適合當環境變數

7.4 學會使用環境變數



08 在「.gitignore」設定不加入版控的資料

8.1 慘痛經驗分享

8.2 哪些檔案/ 資料夾不需要放入版控？

8.3 在專案加入「.gitignore」

8.4 透過 VSCode 確認是否成功將檔案加入忽略清單

8.5 為環境變數建立一個可以上傳的範例檔



PART 4 用 selenium-webdriver 爬蟲網頁資訊



09 爬蟲之前

9.1 學習爬蟲對我有什麼好處?

9.2 爬蟲前請注意這些事情避免違法

9.3 選擇符合需求的爬蟲工具



10 認識 selenium-webdriver，操作所見即所得的爬蟲工具

10.1 安裝 selenium-webdriver 套件 & 環境

10.2 使用 selenium-webdriver 套件開啟瀏覽器

10.3 解決 Windows 無法讀取 chromedriver.exe 的問題

10.4 解決 Windows 開啟瀏覽器時跳出 USB: usb_device_handle_win.cc 的錯誤



11 爬蟲第一步，FB 先登入

11.1 學會分析網頁結構 - 以 FB 登入頁為範例

11.2 打造自動登入 FB 的小程式

11.3 專案原始碼 & 執行程式



12 關閉干擾爬蟲的彈窗，取得 FB 粉專追蹤數

12.1 關閉通知彈窗

12.2 將大目標拆解成小目標，以前往 FB 粉專取得追蹤人數資訊為例

12.3 前往 FB 粉專

12.4 分析 FB 粉專頁面結構

12.5 取得 FB 粉專追蹤人數

12.6 完成爬蟲後關閉瀏覽器

12.7 專案原始碼 & 執行程式



13 舉一反三，帶你了解 IG 爬蟲不可忽略的細節

13.1 分析 IG 登入畫面元件

13.2 使用 css 抓取元件，完成 IG 自動登入

13.3 分析畫面判斷使用者是否登入成功

13.4 了解響應式網頁對爬蟲的影響

13.5 設定瀏覽器開啟時的視窗大小

13.6 前往 IG 帳號並取得追蹤人數

13.7 專案原始碼 & 執行程式



14 合體吧！用一隻程式搞定 FB、IG 爬蟲

14.1 瀏覽器關閉時機錯誤導致爬蟲中斷

14.2 跨網域（CORS）錯誤

14.3 一隻程式爬完 FB & IG 粉專

14.4 思考程式上有什麼地方需要改進

14.5 專案原始碼 & 執行程式



15 重構程式碼，減少歷史業障

15.1 主程式做了太多事情

15.2 一個函式做了太多事情

15.3 物件宣告的方式太複雜且多次被使用

15.4 專案原始碼 & 執行程式



16 用try-catch 捕獲爬蟲過程發生的錯誤

16.1 了解 try-catch-finally 的語法

16.2 思考專案中有哪些地方需要加上 try-catch 的機制

16.3 try-catch 設計時要注意的重點

16.4 加入 preCheck.js 做為第一道防線

16.5 在專案的 crawlerIG.js 加入 try-catch

16.6 將等待時間設定為變數

16.7 專案原始碼 & 執行程式



17 json x 爬蟲 = 瑣事自動化

17.1 客戶要將爬蟲的網址列表填到什麼檔案呢？

17.2 了解 json 格式與基本規則

17.3 在專案中加入 json 格式的粉專清單

17.4 在 JavaScript 檔引入 json 檔案

17.5 撰寫批量爬蟲程式

17.6 專案原始碼 & 執行程式



18 驗證 json 的內容是否符合格式

18.1 為什麼 json 在使用前要先驗證格式？

18.2 認識驗證 json 格式的套件：「jsonschema」

18.3 測試 jsonschema 的範例程式

18.4 用 jsonschema 來驗證 json 粉專清單

18.5 將驗證的程式統整為函式：「jsonValidator」

18.6 專案原始碼 & 執行程式



19 優化爬蟲的小技巧

19.1 思考優化的方向

19.2 優化爬蟲執行效率及穩定度

19.3 讓爬蟲在背景執行

19.4 偽裝瀏覽器的 user-agent

19.5 將優化的起動條件設定到「.env」

19.6 專案原始碼 & 執行程式



20 學會爬蟲，之後呢？

20.1 感覺爬蟲技術還沒學夠

20.2 我還是想不到爬蟲可以用來做什麼



PART 5 使用 Google Sheets 儲存爬蟲資訊



21 免費儲存資料的好選擇，一起進入省錢起手式

21.1 取得 Google Sheets 憑證（credentials）

21.2 在專案加入官方提供的範例程式做測試

21.3 將 Google Sheets 的憑證、授權檔加入「.gitignore」

21.4 專案原始碼



22 了解官方範例在做什麼事

22.1 套件不是照著官方文件安裝就沒事了

22.2 分析官方範例程式

22.3 取得「spreadsheetId」，並加入「.env」

22.4 撰寫讀取指定 Google Sheets 的函式

22.5 專案原始碼 & 執行程式



23 你在文件迷路了嗎？用兩個處理 Sheet 的範例帶你攻略官方文件

23.1 拆asnd

PART 1 先了解專案需求，再思考如何實作

01 需求訪談
1.1 傾聽客戶的需求
1.2 向客戶推薦解決問題的方法

02 撰寫需求規格書
2.1 專案分析
2.2 需求規格
2.3 新手接案的注意事項
2.4 如何避免接案後無法完成功能交付的困境

PART 2 開發前環境介紹& 設定

03 開發前環境介紹＆設定
3.1 Node.js
3.2 nvm
3.3 Git
3.4 Yarn
3.5 VSCode

PART 3 寫程式所需的基礎常識（Node.js）

04 寫程式時該注意的基本原則
4.1 正確的宣告變數
4.2 有意義的命名
4.3 避免重複的程式碼
4.4 避免寫出大眾難以理解的程式
4.5 好的註解
4.6 錯誤處理 & 日誌（log）

05 認識 Node.js 專案
5.1 建立 Node.js 程式
5.2 執行 Node.js
5.3 認識專案管家：「package.json」
5.4 善用 scripts （腳本）執行程式
5.5 使用 license 保護自己的權益
5.6 取得筆者專案原始碼

06 用 Yarn 安裝及控管套件
6.1 套件對工程師的幫助
6.2 如何找出適合的套件
6.3 安裝套件，觀察安裝後目錄結構的變化
6.4 控制套件版本範圍
6.5 下關鍵字找工具的方法

07 善用「.env」管理環境變數，幫你快速遷移專案
7.1 為什麼專案需要環境變數？
7.2 環境變數的使用時機
7.3 分析專案中哪些參數適合當環境變數
7.4 學會使用環境變數

08 在「.gitignore」設定不加入版控的資料
8.1 慘痛經驗分享
8.2 哪些檔案/ 資料夾不需要放入版控？
8.3 在專案加入「.gitignore」
8.4 透過 VSCode 確認是否成功將檔案加入忽略清單
8.5 為環境變數建立一個可以上傳的範例檔

PART 4 用 selenium-webdriver 爬蟲網頁資訊

09 爬蟲之前
9.1 學習爬蟲對我有什麼好處?
9.2 爬蟲前請注意這些事情避免違法
9.3 選擇符合需求的爬蟲工具

10 認識 selenium-webdriver，操作所見即所得的爬蟲工具
10.1 安裝 selenium-webdriver 套件 & 環境
10.2 使用 selenium-webdriver 套件開啟瀏覽器
10.3 解決 Windows 無法讀取 chromedriver.exe 的問題
10.4 解決 Windows 開啟瀏覽器時跳出 USB: usb_device_handle_win.cc 的錯誤

11 爬蟲第一步，FB 先登入
11.1 學會分析網頁結構 - 以 FB 登入頁為範例
11.2 打造自動登入 FB 的小程式
11.3 專案原始碼 & 執行程式

12 關閉干擾爬蟲的彈窗，取得 FB 粉專追蹤數
12.1 關閉通知彈窗
12.2 將大目標拆解成小目標，以前往 FB 粉專取得追蹤人數資訊為例
12.3 前往 FB 粉專
12.4 分析 FB 粉專頁面結構
12.5 取得 FB 粉專追蹤人數
12.6 完成爬蟲後關閉瀏覽器
12.7 專案原始碼 & 執行程式

13 舉一反三，帶你了解 IG 爬蟲不可忽略的細節
13.1 分析 IG 登入畫面元件
13.2 使用 css 抓取元件，完成 IG 自動登入
13.3 分析畫面判斷使用者是否登入成功
13.4 了解響應式網頁對爬蟲的影響
13.5 設定瀏覽器開啟時的視窗大小
13.6 前往 IG 帳號並取得追蹤人數
13.7 專案原始碼 & 執行程式

14 合體吧！用一隻程式搞定 FB、IG 爬蟲
14.1 瀏覽器關閉時機錯誤導致爬蟲中斷
14.2 跨網域（CORS）錯誤
14.3 一隻程式爬完 FB & IG 粉專
14.4 思考程式上有什麼地方需要改進
14.5 專案原始碼 & 執行程式

15 重構程式碼，減少歷史業障
15.1 主程式做了太多事情
15.2 一個函式做了太多事情
15.3 物件宣告的方式太複雜且多次被使用
15.4 專案原始碼 & 執行程式

16 用try-catch 捕獲爬蟲過程發生的錯誤
16.1 了解 try-catch-finally 的語法
16.2 思考專案中有哪些地方需要加上 try-catch 的機制
16.3 try-catch 設計時要注意的重點
16.4 加入 preCheck.js 做為第一道防線
16.5 在專案的 crawlerIG.js 加入 try-catch
16.6 將等待時間設定為變數
16.7 專案原始碼 & 執行程式

17 json x 爬蟲 = 瑣事自動化
17.1 客戶要將爬蟲的網址列表填到什麼檔案呢？
17.2 了解 json 格式與基本規則
17.3 在專案中加入 json 格式的粉專清單
17.4 在 JavaScript 檔引入 json 檔案
17.5 撰寫批量爬蟲程式
17.6 專案原始碼 & 執行程式

18 驗證 json 的內容是否符合格式
18.1 為什麼 json 在使用前要先驗證格式？
18.2 認識驗證 json 格式的套件：「jsonschema」
18.3 測試 jsonschema 的範例程式
18.4 用 jsonschema 來驗證 json 粉專清單
18.5 將驗證的程式統整為函式：「jsonValidator」
18.6 專案原始碼 & 執行程式

19 優化爬蟲的小技巧
19.1 思考優化的方向
19.2 優化爬蟲執行效率及穩定度
19.3 讓爬蟲在背景執行
19.4 偽裝瀏覽器的 user-agent
19.5 將優化的起動條件設定到「.env」
19.6 專案原始碼 & 執行程式

20 學會爬蟲，之後呢？
20.1 感覺爬蟲技術還沒學夠
20.2 我還是想不到爬蟲可以用來做什麼

PART 5 使用 Google Sheets 儲存爬蟲資訊

21 免費儲存資料的好選擇，一起進入省錢起手式
21.1 取得 Google Sheets 憑證（credentials）
21.2 在專案加入官方提供的範例程式做測試
21.3 將 Google Sheets 的憑證、授權檔加入「.gitignore」
21.4 專案原始碼

22 了解官方範例在做什麼事
22.1 套件不是照著官方文件安裝就沒事了
22.2 分析官方範例程式
22.3 取得「spreadsheetId」，並加入「.env」
22.4 撰寫讀取指定 Google Sheets 的函式
22.5 專案原始碼 & 執行程式

23 你在文件迷路了嗎？用兩個處理 Sheet 的範例帶你攻略官方文件
23.1 拆askw

PART 1 先了解專案需求，再思考如何實作



01 需求訪談

1.1 傾聽客戶的需求

1.2 向客戶推薦解決問題的方法



02 撰寫需求規格書

2.1 專案分析

2.2 需求規格

2.3 新手接案的注意事項

2.4 如何避免接案後無法完成功能交付的困境



PART 2 開發前環境介紹& 設定



03 開發前環境介紹＆設定

3.1 Node.js

3.2 nvm

3.3 Git

3.4 Yarn

3.5 VSCode



PART 3 寫程式所需的基礎常識（Node.js）



04 寫程式時該注意的基本原則

4.1 正確的宣告變數

4.2 有意義的命名

4.3 避免重複的程式碼

4.4 避免寫出大眾難以理解的程式

4.5 好的註解

4.6 錯誤處理 & 日誌（log）



05 認識 Node.js 專案

5.1 建立 Node.js 程式

5.2 執行 Node.js

5.3 認識專案管家：「package.json」

5.4 善用 scripts （腳本）執行程式

5.5 使用 license 保護自己的權益

5.6 取得筆者專案原始碼



06 用 Yarn 安裝及控管套件

6.1 套件對工程師的幫助

6.2 如何找出適合的套件

6.3 安裝套件，觀察安裝後目錄結構的變化

6.4 控制套件版本範圍

6.5 下關鍵字找工具的方法



07 善用「.env」管理環境變數，幫你快速遷移專案

7.1 為什麼專案需要環境變數？

7.2 環境變數的使用時機

7.3 分析專案中哪些參數適合當環境變數

7.4 學會使用環境變數



08 在「.gitignore」設定不加入版控的資料

8.1 慘痛經驗分享

8.2 哪些檔案/ 資料夾不需要放入版控？

8.3 在專案加入「.gitignore」

8.4 透過 VSCode 確認是否成功將檔案加入忽略清單

8.5 為環境變數建立一個可以上傳的範例檔



PART 4 用 selenium-webdriver 爬蟲網頁資訊



09 爬蟲之前

9.1 學習爬蟲對我有什麼好處?

9.2 爬蟲前請注意這些事情避免違法

9.3 選擇符合需求的爬蟲工具



10 認識 selenium-webdriver，操作所見即所得的爬蟲工具

10.1 安裝 selenium-webdriver 套件 & 環境

10.2 使用 selenium-webdriver 套件開啟瀏覽器

10.3 解決 Windows 無法讀取 chromedriver.exe 的問題

10.4 解決 Windows 開啟瀏覽器時跳出 USB: usb_device_handle_win.cc 的錯誤



11 爬蟲第一步，FB 先登入

11.1 學會分析網頁結構 - 以 FB 登入頁為範例

11.2 打造自動登入 FB 的小程式

11.3 專案原始碼 & 執行程式



12 關閉干擾爬蟲的彈窗，取得 FB 粉專追蹤數

12.1 關閉通知彈窗

12.2 將大目標拆解成小目標，以前往 FB 粉專取得追蹤人數資訊為例

12.3 前往 FB 粉專

12.4 分析 FB 粉專頁面結構

12.5 取得 FB 粉專追蹤人數

12.6 完成爬蟲後關閉瀏覽器

12.7 專案原始碼 & 執行程式



13 舉一反三，帶你了解 IG 爬蟲不可忽略的細節

13.1 分析 IG 登入畫面元件

13.2 使用 css 抓取元件，完成 IG 自動登入

13.3 分析畫面判斷使用者是否登入成功

13.4 了解響應式網頁對爬蟲的影響

13.5 設定瀏覽器開啟時的視窗大小

13.6 前往 IG 帳號並取得追蹤人數

13.7 專案原始碼 & 執行程式



14 合體吧！用一隻程式搞定 FB、IG 爬蟲

14.1 瀏覽器關閉時機錯誤導致爬蟲中斷

14.2 跨網域（CORS）錯誤

14.3 一隻程式爬完 FB & IG 粉專

14.4 思考程式上有什麼地方需要改進

14.5 專案原始碼 & 執行程式



15 重構程式碼，減少歷史業障

15.1 主程式做了太多事情

15.2 一個函式做了太多事情

15.3 物件宣告的方式太複雜且多次被使用

15.4 專案原始碼 & 執行程式



16 用try-catch 捕獲爬蟲過程發生的錯誤

16.1 了解 try-catch-finally 的語法

16.2 思考專案中有哪些地方需要加上 try-catch 的機制

16.3 try-catch 設計時要注意的重點

16.4 加入 preCheck.js 做為第一道防線

16.5 在專案的 crawlerIG.js 加入 try-catch

16.6 將等待時間設定為變數

16.7 專案原始碼 & 執行程式



17 json x 爬蟲 = 瑣事自動化

17.1 客戶要將爬蟲的網址列表填到什麼檔案呢？

17.2 了解 json 格式與基本規則

17.3 在專案中加入 json 格式的粉專清單

17.4 在 JavaScript 檔引入 json 檔案

17.5 撰寫批量爬蟲程式

17.6 專案原始碼 & 執行程式



18 驗證 json 的內容是否符合格式

18.1 為什麼 json 在使用前要先驗證格式？

18.2 認識驗證 json 格式的套件：「jsonschema」

18.3 測試 jsonschema 的範例程式

18.4 用 jsonschema 來驗證 json 粉專清單

18.5 將驗證的程式統整為函式：「jsonValidator」

18.6 專案原始碼 & 執行程式



19 優化爬蟲的小技巧

19.1 思考優化的方向

19.2 優化爬蟲執行效率及穩定度

19.3 讓爬蟲在背景執行

19.4 偽裝瀏覽器的 user-agent

19.5 將優化的起動條件設定到「.env」

19.6 專案原始碼 & 執行程式



20 學會爬蟲，之後呢？

20.1 感覺爬蟲技術還沒學夠

20.2 我還是想不到爬蟲可以用來做什麼



PART 5 使用 Google Sheets 儲存爬蟲資訊



21 免費儲存資料的好選擇，一起進入省錢起手式

21.1 取得 Google Sheets 憑證（credentials）

21.2 在專案加入官方提供的範例程式做測試

21.3 將 Google Sheets 的憑證、授權檔加入「.gitignore」

21.4 專案原始碼



22 了解官方範例在做什麼事

22.1 套件不是照著官方文件安裝就沒事了

22.2 分析官方範例程式

22.3 取得「spreadsheetId」，並加入「.env」

22.4 撰寫讀取指定 Google Sheets 的函式

22.5 專案原始碼 & 執行程式



23 你在文件迷路了嗎？用兩個處理 Sheet 的範例帶你攻略官方文件

23.1 拆