在 Inertia.js 中防止用戶登出後返回敏感頁面

最近開始在用 Inertia.js 搭配 Laravel 與 Svelte 寫網頁。不用不知道,一用嚇一跳,有了 Inertia.js 當做前後端的粘合劑,我除了不用寫 API 以外,還可以在前後端都使用自己喜歡具工具,開發起來真的非常舒服。不過...

Revert 合併後的修改提交

在工作上與別人合作寫程式的時候,基於保險與禮貌,我們不能隨隨便便 Reset 別人的提交,而是應該使用 Revert 產生一個新的提交來撤銷原本的修改。Revert 的指令相單簡單,不過如果你是想要 Revert 一個已經合併後的...

使用 HTML Sanitizer 來過濾不安全的 HTML 內容

只要網站有能讓使用者輸入文字的地方,例如常見的所見即所得(WYSIWYG)編輯器,就需要設定一個機制來過濾掉不安全的 HTML 內容以避免 XSS(Cross-site scripting)攻擊。因為我的部落格一開始是以面向所有人的論壇...

觸發互動視窗的 CSS 轉場動畫

之前因為好玩,還有想在部落格上看程式碼可以舒服點,所以自己寫了一個簡單的互動視窗(Modal),用來放大文章中的程式碼區塊。雖然功能一切正常,但我還是會嘗試去改善互動視窗的程式碼。前幾天改了一個版本,讓互...

分享前輩的 Terraform Debug 小技巧

前幾天 Azure 又害我加班了,一怒之下,我決定寫一篇文章宣洩情緒外加紀錄這次前輩教我的 Terraform Debug 小技巧。事情是這樣的,我使用 Terraform 部署一個 Azure 的 Role Assignment 資源時:# 假範例一枚 resour...

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 在身邊的野外活動,結果沒想到我還挺樂在其中的!偶爾放下身心走進大自然的懷抱,是一件感覺很棒的事...