決定改部落格文章 Views 的計算方式

想說這樣比較直覺，也比較有趣😂

前言

參考之前自己寫的，原本 Views 是用 localStorage 來看說這個訪客有沒有造訪過某篇文章：
如果沒有的話，Views 就加一，並用 localStorage 來記錄說他造訪過了；
如果有的話，也就是 localStorage 有記錄，Views 就不會變動。

但這樣挺無趣的，每進去一次，就應該要加一才對，所以我決定來修改一下它的計算方式！

記錄一下

因為之前所有文章的 Views 即將歸零重新計算了，想說在這邊記錄一下，留個念：

（2021-07-12） 黑客松 LINE Bot 賽前補帖 （161）
（2021-07-16） 喜歡《大英雄天團》杯麵？何不自己做一個！ （114）
（2021-07-10） 用 FSM 及 LINE Messaging API 做一個聊天機器人 （113）
（2021-01-13） 用 STM32 開發板做一台類似投籃機的遊戲機台 （58）
（2021-01-06） 用 Pure Data 打造吉他效果器 （56）
（2020-09-05） 用一點樂理和音訊處理技術做簡單的音色轉換 （47）
（2021-06-10） 用 Hexo 及 GitHub Pages 打造部落格 （45）
（2020-04-27） JavaScript ES6 Cheatsheet（42）
（2021-07-06） 用 Algorithmia 部署 ML Models （34）
（2021-07-08） 當 Python 遇上了 LINE Blockchain （33）
（2021-07-04） 用 Python 操作 Android 手機 （25）
（2021-06-13） 用 Python 將 PDF 文檔轉成 PNG 圖檔 （24）
（2022-01-09） 做 Spotify 相關的 side project （19）
（2021-09-26） 不完美行動 （19）
（2021-06-14） 端午節立蛋 （19）
（2022-03-25） 【心得】LINE Developers Meetup #16 （18）
（2022-04-09） 【職涯路上】73~64 （15）
（2021-10-01） 即將展開的大四上 （13）
（2022-03-27） 【心得】2022 Yourator 數位職涯博覽會 （11）
（2022-03-12） 【職涯路上】92，交大就業博覽會 （11）
（2021-11-14） 【閱讀筆記】下個10000小時，你打算怎樣過？ （11）
（2022-04-09） 【圖文教學】免費在 AWS 上建一個 Node.js Web Server （10）
（2022-03-30） 【職涯路上】76~74 （10）
（2022-05-25） 【技術筆記】NoSQL、Data Replica、Sharding （9）
（2022-03-27） 【職涯路上】84~77 （8）
（2022-03-11） 駕訓班裡的點點滴滴 （8）
（2022-04-27） 用 SSL For Free 免費申請 SSL 憑證 （7）
（2020-05-16） Moleculer CRUD Guide （7）
（2022-06-03） 2022 端午節立蛋 （6）
（2021-12-19） 停下來思考 （6）
（2022-03-14） 【職涯路上】91~90，越挫越勇！ （5）
（2022-03-07） 【職涯路上】100~97，開始行動！ （5）
（2022-01-28） 助你行動 （5）
（2022-06-05） 用 Docker 和 Kubernetes 部署一個使用到 RabbitMQ 及 MongoDB 的 Express App （4）
（2022-03-11） 【職涯路上】96~93，自我懷疑⋯⋯ （4）
（2021-12-11） 免費 iOS 合成器 App《Synth One》也能搭配 Logic Pro 玩音樂？ （4）
（2022-03-18） 【職涯路上】89~86，再廢也不要停止反思 （3）
（2021-12-15） 【閱讀筆記】一流的人如何保持巔峰 （3）
（2021-12-12） 專注當下 （3）
（2022-06-12） 【職涯路上】63~0，Commencement （2）
（2022-03-19） 【職涯路上】85，不想徒具形式 （2）
（2021-10-07） 如何解決 Logic Pro Plug-In Compatibility 的問題 （2）

來改吧

參考我之前寫的，去 Firestore Database → 規則，來編輯規則：

service cloud.firestore {
  match /databases/{database}/documents {
    match /articles/{any} {
      allow read: if true;
      allow write: if true;
    }
    // 新規則
    match /views/{any} {
      allow read: if true;
      allow write: if true;
    }
  }
}

編輯完以後，記得按「發布」

到 theme 的 config 檔 /themes/next/_config.yml，修改關於 firestore 的設置：

firestore:
  enable: true
  # collection: articles
  collection: views # Required, a string collection name to access firestore database
  apiKey: <網路 API 金鑰>
  projectId: <專案 ID>

去到 /themes/next/layout/_third-party/statistics/firestore.swig 修改計算方式：

// 其實就是註解掉第 51~56 行
if (localStorage.getItem(title)) {
  increaseCount = false;
} else {
  // Mark as visited
  localStorage.setItem(title, true);
}

這樣就改好囉，就是這麼簡單😎