Interface 與 Type 在 TypeScript 中的差異

在 TypeScript 中,你可以用 interface 和 type 這兩個關鍵字,來定義一個自己的類別。interface Person { name: string; age: number; } const person: Person = { name: "John", age: 30, };有趣的是,除...

讓按鈕在移動設備上更大一些

Tailwind CSS 的作者 Adam Wathan 在 Build UIs that don't suck 系列中又分享了一個很實用的小技巧。作者提到網頁中的一些按鈕設計,在桌面設備上可能會小一點以求美觀與符合頁面設計,對於可以精準點擊的滑鼠游標...

在 Laravel 中實作密碼金鑰登入

這篇文章接續我的上一篇文章 — 實作密碼金鑰登入的筆記。建議先閱讀完上一篇文章了解密碼金鑰的基本概念與專有名詞後,再來閱讀本篇文章,相信你會更好的理解文章中的實作內容 😊。接下來會一步一步的說明如何在 Lar...

實作密碼金鑰登入的筆記

前陣子為了幫自己的部落格加入密碼金鑰登入的功能,花了一些時間去了解密碼金鑰背後的運作原理。趁著自己還記憶猶新的時候,我想寫一篇文章記錄一下這次學到的密碼金鑰概念,主要是針對專有名詞與驗證流程進行說明。...

挑戰人生清單中的目標,來去日本露營吧!

受到日本動畫「搖曳露營」的影響,我這幾年開始嘗試戶外露營。原本以為在都市叢林工作已久的我,會不習慣沒有 3C 在身邊的野外活動,結果沒想到我還挺樂在其中的!偶爾放下身心走進大自然的懷抱,是一件感覺很棒的事...

在 Tailwind CSS 中使用 CSS 變數來設定邊框圓角

Tailwind CSS 的作者 Adam Wathan 最近宣布要製作一系列短影片 - Build UIs that don't suck,來分享一些使用 Tailwind CSS 的小技巧。他提到這些技巧他已經使用了許多年,在開發許多 UI 組件時也很常利用這些...

在 Docker 中掛載單一檔案所遇到的問題

前幾天前輩來找我討論一個奇怪的問題,他說他在 Docker 容器中掛載單一檔案時,會遇到檔案同步效果時有時無的情況。他嘗試在啟動容器時掛載單一檔案,然後發現在主機上修改檔案的內容後,有時候修改的內容並不會同步...

使用 TypeScript 開發自己的套件

最近用 TypeScript 寫了一個簡單的前端套件並發佈到 NPM 上,套件功能是幫 highlight.js 加上對 Laravel Blade 樣板語法的支援。雖然這個功能已經有人幫忙寫了套件,但是我發現這些套件在部分語法上都有缺失,也長年...

期待已久的新功能,簡單介紹 Svelte 的 Class Attributes

如果你跟我一樣是 Tailwind CSS 的愛好者,或是喜歡使用 Utility First 的 CSS 框架,那麼 Svelte 5.16 的新功能「Class Attributes」一定會讓你感到興奮。透過這個新功能,我們能更輕鬆的根據不同條件來動態調整樣...

時間也過太快了吧?我的 2024 年度回顧

2025 年正式到來!各位去年過得還好嗎?其實相較於 2023 年,我總覺得 2024 年時間過得飛快,一下子就結束了的感受特別強烈,難道是因為 2023 年實在是太充實,而去年實在是太混了嗎?話雖這麼說,我在去年年初定下...