打造 Serverless 數據庫神器：Drizzle ORM x Cloudflare D1 全攻略

Drizzle ORM 結合 TypeScript 類型安全與 SQL 靈活性，是現代開發者在 Cloudflare D1 上構建 Serverless 數據庫的理想選擇。本文提供從安裝、建模到查詢的完整實戰教學。

Pyodide：在瀏覽器中運行 Python 的完整指南

Pyodide 作為一種強大的技術解決方案，讓開發者能夠直接在瀏覽器中運行 Python 代碼，為 Web 開發帶來了新的可能性。本文將深入探討 Pyodide 的核心概念、優勢、使用方法以及安裝配置指南，幫助開發者充分利用這一創新技術。

使用 Docker Compose 構建全棧應用：React、Express 與 MySQL

在複雜的全棧開發環境中，管理前端、後端和數據庫之間的配置和依賴關係可能會非常耗時且易於出錯。Docker Compose 提供了一個優雅的解決方案，使開發人員能夠輕鬆地定義、配置和運行多容器應用程序。本文將詳細介紹如何使用 Docker Compose 創建一個整合了 React.js 前端、Express.js 後端和 MySQL 數據庫的全棧應用，並提供一個使用 Vite、Express 和 MySQL 的實用示例。

在 Node.js 中使用 bcrypt 加密密碼的完整指南

在現代應用程序開發中，安全存儲用戶密碼至關重要。本報告將詳細介紹如何在 Node.js 中使用 bcrypt 進行密碼加密，探討為何 bcrypt 優於其他哈希方法，並提供密碼加密的最佳實踐。

使用 Docker 和 Docker Compose 建立 Neo4j 資料庫

Neo4j 是一個強大的圖形資料庫，透過 Docker 和 Docker Compose 部署可大幅簡化安裝和管理流程。本報告將詳細介紹如何使用容器技術快速建立 Neo4j 環境，涵蓋從基本設置到進階配置的完整過程，適合開發者快速實現圖形資料庫的部署與管理。

使用 Cloudflare Worker、Hono 和 Telegram Bot API 構建 RSS 訂閱推送系統

本文將詳細介紹如何使用 Cloudflare Worker、Hono 框架和 Telegram Bot API 構建一個自動化系統，該系統能夠監控 RSS 訂閱源並將最新更新推送到 Telegram 頻道。這個解決方案完全基於 Serverless 架構，無需管理伺服器，且大部分情況下可以在 Cloudflare 的免費方案內運行，非常適合個人開發者和小型團隊使用。

MyGO!!!!! Telegram 機器人：邊緣計算與動漫文化的融合

MyGO!!!!! Telegram 機器人是一個結合了現代邊緣計算技術與動漫文化的創新項目。這個基於 Grammy 和 Hono 框架構建的 Telegram 機器人，能讓用戶通過關鍵詞搜索 MyGO!!!!! 的圖片。本文將深入探討該機器人的背景、技術實現和功能特點，展示如何利用 Cloudflare Workers 部署高效能的 Telegram 機器人。

從零開始的 dApp 開發：2024 年學習路線圖

Web3 的機會已經來臨，接下來的三個月，我必須全力以赴。以下是我 2024 年的學習計畫：

優雅地使用 Storybook 建立 React.js 組件

Storybook 最大的優點是它可以提供不同的頁面來顯示組件的不同狀態，讓我們在各種不同的情況下測試和評估組件。通過為不同狀態創建不同的頁面，我們可以輕鬆地測試組件。另外，Storybook 也可以輸出一個 Static Website，可以輕鬆分享給設計師和其他團隊成員，讓他們容易理解組件的外觀和行為。

如何透過 ZEIT 方便快捷地部署免費的 Node.js 項目？

ZEIT 平台提供了免費的網站空間平台給開發者，我們可以透過 ZEIT 平台來部署 Node.js, Express.js, Koa.js 等應用。如果你有寫過 Node.js 應用，又想找個免費空間部署這些應用的話，那麼 ZEIT 會是一個不錯的選擇。

超好用的全棧項目部署構建平台 - Netlify, ZEIT

如果你想要部署自己的前端項目的話，那麼 Netlify 提供了一個一站式的解決方法，讓你可以持續部署，以及自動開啟 HTTPS。如果你想要部署 Node.js 應用的話，那麼 ZEIT 會是另外一個解決方案。

從博客系統回顧我的 2018 年前端生涯

時光飛逝，我已從大學畢業成為前端工程師。回想這一年，我完成了三件事情：改版博客系統，讓不同用戶可以快速啟動項目，它是我第一個過百 Star 數的項目；翻譯並校對技術文章，學習了不少前端實用的技術；對博客系統框架的 GatsbyJS，ReactJS 技術研究。

GatsbyJS 入門（二）：如何以 Starter 快速架構網站

上次我們提到 GatsbyJS，它是一個可以獲取任意數據，並生成靜態化網站的系統。這一次，就讓我們以 Calpa 的技術博客作為例子來開始架構網站吧

Hackoberfest 2018 ﹣ 面向所有人群的開源社區最大活動

世界上不同的程序員，因開源活動而連接一起。這次 Hacktoberfest 活動除了可以拿到活動的限量衣服和貼紙之外，更可以認識到世界上不同的程序員。我看著不斷而來的討論和 PR，我找回了自己在編程上的熱情。如果你有興趣參與開源活動，但不知道如何入手的話，它會是一個不錯的起點。

網站性能調優開發工具：Lighthouse，Puppeteer 以及進階部分丨 Google 開發者大會 2018

這次 Google 開發者大會請來了 Lighthouse 的工程師 - Eric Bidelman，分享如何簡單地使用 Lighthouse, Puppeteer 來自動化我們日常的流程。它是一個開源的自動化工具，用於改進網絡應用質量。您只需要提供網址，它就測試該頁面，並生成頁面性能報告。你可以看看採取哪些措施來改進您的應用

vtop ﹣ 一個你用了就會愛不釋手的圖形化進程管理工具

當我查看 CPU 和系統狀態時，我希望可以更加快捷，直觀地找出問題所在。vtop 則可以幫助我們節省分析過多數據，還提供 hjkl 一樣的 vim 鍵位，非常方便易用。如同 top 一樣，它可以顯示系統中各個進程中資源佔用狀況，並終止特定進程。

知乎無限 live 數據流網站

一直收聽知乎無限 live 的時候，我都會想：如何才能更有效率地收聽這些計畫內的 live 呢？於是我心血來潮，把無限 live 的資料拿了下來，然後做一個數據流的網站。這個網站展示和源碼已經放在 Github。這個項目可能適合那些喜歡看到很多數據的同學

Gatsbyjs async/await 更新報錯解決方法

當我在更新 gatsbyjs 本體和 `gatsbyjs-*` 插件後，就發現構建 JavaScript 代碼的時候失敗。解決問題的過程，需要多聯想關鍵字。但簡單來說，只要安裝正確的 babel 轉換插件，就可以解決這個問題。

又到了年度總結的季節 ﹣ 我的 2017 前端開發回顧

從最初的失望與後悔，到最後的興奮與感動，2017 年可以算是充滿挑戰與機遇的一年。雖然我依然是一個非科班學生，但是這沒有阻止我轉行成為前端工程師，反而成為向前邁進的動力之一。如果沒有這些經歷，我也不會發現自己對於編程的那份熱愛。在此，就讓我回顧一下這一年在自學編程轉行的經歷吧。在開始這篇文章之前，我先戴上頭盔，以防意外。

Node.js 專案瘦身神器：用 node-prune 一鍵清理不必要檔案！

node_modules 常常塞滿無用檔案，導致打包部署效率低落。本文介紹由 TJ 大神開發的 node-prune 工具，教你如何一鍵移除專案中的多餘檔案與目錄，讓 Node.js 專案體積大幅縮減，部署更快速穩定！

你可能不知道的 JavaScript 代碼規範

良好的代碼規範，能夠提高代碼的可閱性，使得項目維護更友好。除了自己設定一個規範外，我們也可以借鑒一下現在流行的代碼規範，讓我們成長之後，再去看細節。

【圖多】《遠征成功﹣﹣一個香港人北上杭州豬場的前端面試之路》

首先，我要感謝網易。作為一個香港人，能夠拿到杭州的面試機會，實屬機會難得。這次的兩輪技術面試，考察點廣泛而深入。雖然問題比較深入，但這讓我感覺對於技術要求比較高，這是一件好事，因為可以反映公司對於技術的重視。在大四的這一年裡，我會繼續努力，爭取時間學習一個。本文將會記錄我面試時遇過的問題，以及作為一個香港人在杭州遇到的困難。

異步操作見聞錄

異步操作是非常常見的操作，也是其中一題常見的前端工程師面試題目。在日常開發中，我們會和伺服器交互，或者是和用戶的行動作出反應，比如說監聽某些點擊事件。這個時候，其實我們是執行了異步操作，我們需要等待對方若干時間才能收到返回值，甚至是一個錯誤的值。因此，異步操作很容易產生一些誤會。這裡，我會說一下異步操作，及其返回的處理方法。

項目代碼調試：提問前要做的六個步驟

上天對於每個地球人都是公平的，每個人都一天只有 24 小時。為什麼有的人會停留不前，有的人卻會不斷有所成長？其中一個原因是當遇到問題時，他們解決問題的方法是非常不同的。同樣是遇到問題，與其伸手，等其他程序員幫助去解決問題，倒不如自己先嘗試各種方法，然後才問人家。我會在這篇文章簡單說一下在你提問之前，你可以做的六個步驟。

React 組件生命週期 - 加載組件

初探 React 組件生命週期

HackUST 2017 後記