NewsNow即將登場！ 擺脫雜亂新聞，優雅閱讀即時熱門資訊。

身為台灣的網路使用者，你是否常常覺得被資訊洪流淹沒，想要快速掌握熱門新聞卻又苦於介面雜亂、廣告滿天飛的新聞網站？ 今天要跟大家介紹一個開源專案 NewsNow，它提供了一個簡潔、優雅的介面，讓你能夠即時掌握最新的熱門新聞，而且部署方式非常彈性，即使是新手也能輕鬆上手！

文章網址： (假設部署在個人網域) https://www.example.com/blog/newsnow-taiwan (請替換成實際網址)

什麼是 NewsNow？

簡單來說，NewsNow 是一個用來抓取並呈現熱門新聞的工具。它的目標是提供一個乾淨、優雅且即時的閱讀體驗。想像一下，不再需要忍受惱人的彈出式廣告，也不用在密密麻麻的文字中尋找重點，NewsNow 讓你專注於閱讀新聞本身。

NewsNow 的核心概念：

• 簡潔至上： NewsNow 強調簡潔的 UI 設計，讓你更容易閱讀新聞。
• 即時更新： 隨時掌握最新的熱門新聞，不用擔心錯過重要資訊。
• 彈性部署： 可以部署在 Cloudflare Pages、Vercel 等平台，也可以使用 Docker 部署。
• 開源精神： NewsNow 是一個開源專案，你可以自由使用、修改和貢獻。

NewsNow 有什麼特色？

• 優雅的 UI 設計： 提供最佳的閱讀體驗，擺脫雜亂的介面。
• 即時更新熱門新聞： 隨時掌握最新動態。
• GitHub OAuth 登入與資料同步： 使用 GitHub 帳號登入，方便管理個人設定與閱讀紀錄 (未來功能)。
• 快取機制： 預設 30 分鐘快取，登入使用者可以強制刷新。
• 自適應抓取間隔： 根據新聞來源的更新頻率，自動調整抓取間隔，節省資源並避免 IP 被封鎖。

如何開始使用 NewsNow？ (新手友善指南)

雖然 NewsNow 仍在開發中，目前只支援中文新聞，但這並不妨礙我們體驗它的魅力。以下提供幾種部署方式，即使是新手也能嘗試：

1. 基本部署 (免登入、免快取)：

這是最簡單的部署方式，適合想要快速體驗 NewsNow 的使用者。

• 步驟一：Fork NewsNow 的 GitHub 倉庫前往 https://github.com/ourongxing/newsnow (請注意，這是一個示範專案，實際網址請以作者提供的為主)，點擊右上角的 “Fork” 按鈕，將專案複製到你自己的 GitHub 帳號下。
• 步驟二：匯入到 Cloudflare Pages 或 Vercel
  • Cloudflare Pages：
    1. 登入 Cloudflare 帳號，進入 “Pages” 頁面。
    2. 點擊 “Create project”，選擇 “Connect to Git”。
    3. 選擇你剛剛 Fork 的 NewsNow 倉庫。
    4. 在 “Build settings” 中，設定 “Build command” 為 pnpm run build，”Output directory” 為 dist/output/public。
    5. 點擊 “Save and deploy”。
  • Vercel：
    1. 登入 Vercel 帳號，點擊 “Add New…”。
    2. 選擇你剛剛 Fork 的 NewsNow 倉庫。
    3. Vercel 會自動偵測專案設定，直接點擊 “Deploy” 即可。
• 步驟三：等待部署完成部署完成後，Cloudflare Pages 或 Vercel 會提供一個網址，你就可以透過這個網址訪問 NewsNow 了。

重點提示：

• pnpm 是 Node.js 的套件管理器，如果你的電腦沒有安裝，可以參考 https://pnpm.io/installation 進行安裝。

2. 完整部署 (含 GitHub OAuth 登入、快取)：

這種部署方式需要設定一些環境變數，但可以體驗 NewsNow 的完整功能。

• 步驟一：完成基本部署 (參考上述步驟)
• 步驟二：設定 GitHub OAuth
  1. 建立 GitHub App：
     • 前往 https://github.com/settings/applications/new
     • 填寫 App 的相關資訊，例如 App name、Homepage URL、Description 等。
     • Important! 將 Callback URL 設定為 https://your-domain.com/api/oauth/github` (將your-domain.com` 替換成你部署的網域)。
     • 不需要特別的權限。
     • 建立完成後，你會獲得 Client ID 和 Client Secret。
  2. 設定環境變數：
     • 在 Cloudflare Pages 或 Vercel 的專案設定中，新增以下環境變數：
       • G_CLIENT_ID：你的 GitHub App 的 Client ID。
       • G_CLIENT_SECRET：你的 GitHub App 的 Client Secret。
       • JWT_SECRET：一個隨機的字串，用來加密 JWT (JSON Web Token)，可以設成跟 G_CLIENT_SECRET 一樣。
       • INIT_TABLE：第一次部署時設為 true，之後可以設為 false。
       • ENABLE_CACHE：設為 true 以啟用快取。
• 步驟三：設定資料庫 (推薦 Cloudflare D1)
  1. 建立 Cloudflare D1 資料庫：
     • 前往 Cloudflare Worker 的儀表板，建立一個 D1 資料庫。
  2. 設定 wrangler.toml：
     • 將專案目錄下的 example.wrangler.toml 複製一份，並重新命名為 wrangler.toml。
     • 修改 wrangler.toml 中的 database_id 和 database_name，改成你剛剛建立的 D1 資料庫的 ID 和名稱。
  3. 部署： 重新部署 Cloudflare Pages 或 Vercel 專案。

重點提示：

• wrangler.toml 是一個設定檔，用來告訴 Cloudflare Worker 如何與 D1 資料庫互動。
• 第一次部署時，INIT_TABLE 必須設為 true，這樣程式才會自動建立資料表。
• 設定環境變數時，請務必保護好你的 Client Secret 和 JWT Secret，不要洩漏給其他人。

3. Docker 部署：

如果你熟悉 Docker，可以使用 Docker 部署 NewsNow。

• 步驟一：安裝 Docker 和 Docker Compose請參考 Docker 官方網站的說明進行安裝： https://www.docker.com/
• 步驟二：修改 docker-compose.yml (如果需要)可以修改 docker-compose.yml 中的環境變數，例如資料庫設定、GitHub OAuth 設定等。
• 步驟三：執行 docker compose up在專案根目錄下，執行 docker compose up 命令，即可啟動 NewsNow 容器。

個人實作心得：

我在嘗試部署 NewsNow 的過程中，遇到最大的問題是 GitHub OAuth 的設定。一開始 Callback URL 設定錯誤，導致登入一直失敗。後來仔細檢查 GitHub App 的設定，才發現 Callback URL 必須與部署的網域完全一致。此外，設定環境變數時也需要特別小心，避免輸入錯誤。

錯誤排除指南：

• 部署失敗： 檢查 Build command 和 Output directory 是否正確。
• GitHub OAuth 登入失敗： 檢查 Callback URL 是否正確，並確認 GitHub App 的設定。
• 資料庫連線失敗： 檢查 wrangler.toml 中的資料庫 ID 和名稱是否正確，並確認 D1 資料庫已成功建立。
• 新聞無法顯示： 可能是新聞來源的網站結構發生變化，導致抓取失敗。可以嘗試修改 shared/sources 和 server/sources 目錄下的程式碼，以適應新的網站結構。(需要具備一定的程式基礎)

NewsNow 的未來展望

根據 NewsNow 的 Roadmap，未來將會加入以下功能：

• 多語言支援： 除了中文之外，還會支援英文和其他語言。
• 個人化選項： 可以根據個人喜好設定新聞分類、儲存偏好設定等。
• 擴展資料來源： 涵蓋更多全球新聞來源。

這些功能將會讓 NewsNow 更加完善，成為一個更加強大的新聞閱讀工具。

如何貢獻 NewsNow？

NewsNow 是一個開源專案，歡迎大家參與貢獻！你可以透過以下方式參與：

• 提交 Pull Request： 如果你發現了 Bug，或者想要新增功能，可以提交 Pull Request。
• 建立 Issue： 如果你有任何建議或意見，可以建立 Issue。
• 參與討論： 在 GitHub 倉庫中參與討論，分享你的想法。

結論

NewsNow 是一個非常有潛力的專案，它提供了一個簡潔、優雅且即時的新聞閱讀體驗。雖然目前仍處於開發階段，但已經展現出它的魅力。如果你正在尋找一個更好的新聞閱讀工具，或者想要參與開源專案，不妨試試 NewsNow 吧！

總結：

• NewsNow 提供優雅的新聞閱讀體驗。
• 新手可以從基本部署開始體驗。
• 完整部署需要設定 GitHub OAuth 和資料庫。
• 歡迎大家參與貢獻！

希望這篇文章能夠幫助你了解 NewsNow，並開始使用它！

參考閱讀

https://github.com/ourongxing/newsnow