想在 React 應用中即時渲染並預覽 Markdown?這篇文章將徹底介紹 react-markdown 的安裝、用法、擴展性與最佳實踐,幫你打造高效的技術文檔體驗。
Wagmi 是一個專為以太坊應用程序設計的 React Hooks 集合,提供開發者所需的一切工具,使區塊鏈前端開發變得簡單高效。通過類型安全、可擴展和模塊化設計,Wagmi 讓開發者能夠專注於構建高性能的區塊鏈前端體驗,而不必擔心底層複雜性。
AutoCorrect 是一個強大的文案格式化工具,能夠自動糾正中日韓(CJK)與英文混合使用時的常見問題,如標點符號、空格等。本文將介紹如何透過 GitHub Actions 的自動化工作流程,讓您的繁體中文文章在推送到 GitHub 時自動進行格式化,有效提升文章的專業度和可讀性。
解析 OpenAI CEO Sam Altman 對 AI 代理在 2025 年進入職場的預測,探討其對企業生產力和全球經濟的影響。
Web3 的機會已經來臨,接下來的三個月,我必須全力以赴。以下是我 2024 年的學習計畫:
2023 年,我回到香港,從全棧工程師,行過死蔭幽谷,現在成爲系統架構師。能夠在 Web3 的世界自由自在地行走,十分感激當初的百般試煉。現在,就讓我回顧這一年我採用的前端後端雲端 Web3 方案,希望可以拋磚引玉
Storybook 最大的優點是它可以提供不同的頁面來顯示組件的不同狀態,讓我們在各種不同的情況下測試和評估組件。通過為不同狀態創建不同的頁面,我們可以輕鬆地測試組件。另外,Storybook 也可以輸出一個 Static Website,可以輕鬆分享給設計師和其他團隊成員,讓他們容易理解組件的外觀和行為。
在編寫組件時,最讓我迷惑的是在我編寫純函數組件,為什麼沒有在代碼裡面調用 React 都需要導入 React。經過一番調研,我發現是因為 JSX 轉譯的設定。不過,人是比較懶惰的,透過安裝 babel-plugin-react-require 插件,達到自動導入 React 的效果。這篇文章將會講述我的調研經歷和一點反思。
GatsbyJS 提供了一個簡單易用的命令行工具,我們可以透過它來構建一個基本的 React 網站,並實時看到修改代碼所帶來的變化。
時光飛逝,我已從大學畢業成為前端工程師。回想這一年,我完成了三件事情:改版博客系統,讓不同用戶可以快速啟動項目,它是我第一個過百 Star 數的項目;翻譯並校對技術文章,學習了不少前端實用的技術;對博客系統框架的 GatsbyJS,ReactJS 技術研究。
感謝各位這些年來閱讀我的博客文章,以及優化博客系統框架,現在,我將為你帶來一個前後端徹底分離,而且可以一鍵啟動的博客框架。
學習如逆水行舟,不進則退。透過這個清單,我可以不斷學習前端知識,掌握更新的技能,天天進化。
世界上不同的程序員,因開源活動而連接一起。這次 Hacktoberfest 活動除了可以拿到活動的限量衣服和貼紙之外,更可以認識到世界上不同的程序員。我看著不斷而來的討論和 PR,我找回了自己在編程上的熱情。如果你有興趣參與開源活動,但不知道如何入手的話,它會是一個不錯的起點。
如果你熟悉申請大學流程的話,你也可以理解 JavaScript 的 filter 方法。相對於 JavaScript 裡面的 map() 和 reduce() 方法來說,filter() 方法也許是最一目了然的方法。
從最初的失望與後悔,到最後的興奮與感動,2017 年可以算是充滿挑戰與機遇的一年。雖然我依然是一個非科班學生,但是這沒有阻止我轉行成為前端工程師,反而成為向前邁進的動力之一。如果沒有這些經歷,我也不會發現自己對於編程的那份熱愛。在此,就讓我回顧一下這一年在自學編程轉行的經歷吧。在開始這篇文章之前,我先戴上頭盔,以防意外。
良好的代碼規範,能夠提高代碼的可閱性,使得項目維護更友好。除了自己設定一個規範外,我們也可以借鑒一下現在流行的代碼規範,讓我們成長之後,再去看細節。
在網頁開發的世界裡,尤其是前端開發,我們會用很多時間尋找最好的設計,以及最好的內容。雖然這是沒有錯的,但是,我們會忘記去優化我們的網頁。這會讓用戶需要很久的時間,比如說,瀏覽器需要六秒到十秒以上才能完成整個渲染過程。在這篇文章,我會分享優化網頁的檢查清單。如果你覺得我有錯漏的地方,請在下面留言。這張清單會包含一些優化搜尋引擎排名 (SEO) 的技巧,以及減少網頁加載時間的最佳實踐。
大約兩個星期之前,我在 Facebook 上看到 2017 年的香港開源年會的消息。我想,我是不是可以透過這個機會,認識一下不同領域的程序。於是,我在 EventBrite 上面買了學生票。但最終我拿到 VIP 票了,感覺有點激動。我把這一次的會議做了幾點筆記,也許,每一個人都應該參加最少一次如此有規模的大會。我會在這裡說說我參與這次會議所發生的一些事。
利用 markdown 製作投影片,其實可以很簡單。
二十一世紀的鍊金術士,以 AI 為觸媒,將想法具現化,以邏輯築陣、用創作構築可能。
從 2017 年開始寫作,目前已累積 283 篇煉金筆記。
如果你有 AI 專案、網站開發或技術整合需求,歡迎來信交流: partner@calpa.me
React 開發團隊於 2025 年 2 月 14 日正式宣布淘汰 Create React App (CRA),並鼓勵開發者轉向使用現代框架或構建工具如 Vite、Parcel 或 RSBuild。這一決定標誌著前端開發工具生態系統的重大轉變,開啟了以框架為中心的新時代。
2025年3月21日
3096 分享
2023年10月13日
2164 分享
想用 AI 寫程式又怕爛 code?這篇文章分享我如何結合 ChatGPT、TypeScript、JSDoc、Zod 與 Vitest,打造可維護、可驗證的 Vibe Coding 流程,讓靈感不只是 prototype,而是真正能安全上線的產品級程式碼。
2025年5月23日
1957 分享
Google Forms 是現代工作中不可或缺的資料收集工具。本文將教你如何結合 Google Apps Script 和生成式 AI(如 ChatGPT),快速自動化建構表單、串接 Google Sheets,並大幅提升開發效率與資料管理品質。讓即使沒有程式背景的人,也能輕鬆打造專業級的智能表單!
2025年4月15日
1617 分享
2022 年 3 月,我曾整理了「一個 Full Stack Developer 的日常」,分享了自己的工作流程和方法論。如今已是 2025 年,前端開發領域已經歷了翻天覆地的變化。讓我們重新審視這個領域,看看三年來發生了什麼變化,以及現在學習前端開發應該採取什麼策略。
2025年3月17日
1515 分享
在 AI 輔助開發時代,清晰的程式文件不只是寫給人看的,更是讓 AI 工具正確理解你程式碼的關鍵。本文深入解析 Python DocString 的撰寫方式與實用範例,包含 PEP 257、Google 風格與 Numpydoc 樣式,幫助你打造對開發者與 AI 都友善的專業程式碼註解。
2025年4月18日
1416 分享
前端開發作為一個不斷演進的領域,每年都有新的技術和框架湧現。作為一名全棧開發者,我長期以來一直在思考如何系統化地組織前端知識,並將這些知識有效地傳遞給更多人。這篇文章將分享我如何基於台灣招聘市場的研究,構建了一套全面的前端技能圖譜,以及我未來的寫作計劃。
2025年3月25日
1407 分享
在 2025 年 3 月 18 日,styled-components 核心維護者 Evan Jacobs(quantizor)宣布曾經風靡 React 社群的 CSS-in-JS 解決方案正式進入維護模式。這個消息對於前端開發社群產生了相當大的迴響,也標誌著前端樣式處理技術的一個重要轉折點。
2025年3月29日
1039 分享
還在手動整理網頁內容給 ChatGPT?Firecrawl 幫你自動爬取網站、轉成乾淨的 Markdown 或 JSON,讓你快速建立知識庫、訓練 LLM,省時又高效。
2025年5月01日
1023 分享
不只是靈感,更是一套流程。這篇文章重構黃霑的加減乘除模型,結合 ChatGPT 實作技巧,打造可封裝、可疊代、可複利的 AI 內容創作系統。
2025年5月27日
313 分享
曾經我一個月只能寫一篇技術文,直到我用工程師思維打造 ChatGPT 協作的自動化寫作系統,現在每天一篇、穩定日更。這篇文章完整公開我的內容生產流程,從靈感整理、架構設計到 ChatGPT 審稿與多平台發佈,幫助你也建立屬於自己的高效創作引擎。
2025年5月25日
1010 分享
想用 AI 快速打造手機 App 嗎?Bolt.new 結合 Expo,讓你在瀏覽器中用自然語言 prompt 一鍵生成 React Native 應用,支援即時預覽與跨平台部署。本文完整解析從開發到上架的極速流程,打造 MVP 再也不難。
2025年5月20日
841 分享
我從多個平台遷移到 Cloudflare Pages,解決了部署慢、設定複雜、功能受限等問題。本文完整解析 Cloudflare Pages 的優勢、部署流程與實戰經驗,幫助你選對 2025 年最值得信賴的靜態網站託管平台。
2025年5月19日
513 分享
使用 TypeScript 與 Discord Webhook API,打造自動發送訊息到頻道的完整流程。從設定 Webhook 到訊息格式、編輯與刪除操作,全方位實戰解析,適合開發者應用於文章通知、自動通報等場景。
2025年5月17日
183 分享
2025年5月15日
681 分享
用 ChatGPT 搭配 Google Apps Script,自動建立格式完整的 Google Docs 企劃書。本文含實作範例、排版技巧與自動化技巧,幫你快速生成多份專業提案。
777 分享