前言 在開發專案時，經常會遇到跨專案共用邏輯或工具的情況，例如常用的 logger 或驗證工具。如果每次都從一個專案複製貼上到另一個專案，難免會出現版本不同步...
匿名函式 anonymous function 是指在 JavaScript 中沒有名稱的函式，通常用於一次性的操作或者作為參數傳遞給其他函式，此外，匿名函式不...
本篇要來介紹 interface，講解如何「宣告介面」和「使用介面」並藉由 interface 來重構物件型別註釋的範例，來比較兩個不同寫法的差異 inter...
讓你的計時器不再無聊！帶你實現進度條的互動視覺化 你是否曾經想過，讓時間不只是冷冰冰的數字，而是變成一個動態、直觀、充滿視覺衝擊的體驗？ 今天，我們要用 V...
寫到現在才總算要把主題稍微拉回到 Next.js 了，不過這幾篇的設定主要會是集中在基礎的設定。 首先是設定字型設定，這次我選用 Noto Sans 字型跟...
今天要介紹的是 MVC 模式，這和之前介紹的模式有點不同，在 GoF 書中，他們認為沒有將 MVC 稱為設計模式，而是視為一組用來建構 UI 的類別，他們認為...
Day 16 認識 M1 卡的存取權限 接下來我們要來認識規則比較複雜的「區段存取控制位元」。如果想偷懶，可以直接找線上工具來產生 (搜尋 MIFARE Cla...
同步 synchronous JavaScript 中同步的概念是指程式碼的執行會依照順序進行，必須等到前一個任務完成後才能執行下一個任務。但是由於 JavaS...
今天要介紹的是 Proxy 模式，這也是 GoF 在書中提及的設計模式之一，屬於結構型的設計模式，不過《JavaScript 設計模式學習手冊 第二版》這本書...
前言 在現代前端開發中，與後端進行資料交換是常見的需求。透過 HTTP 請求，我們可以將資料送出並取得結果。這篇文章將介紹如何使用 TypeScript 實作...
3D 翻轉卡片特效來襲，用 Vue.js 掌控全場，玩轉視覺與互動的完美結合！ 嘿～準備好見證魔法般的 3D 翻轉效果了嗎？今天，我們要用 Vue.js 玩...
never 是 TypeScript 中獨有的型別，本篇要來介紹 never 型別及其使用時機 never The never type represent...
Day 15 認識 M1 卡的資料結構 M1 卡的儲存容量為 1024 位元組，分成 16 個區段 (Sector)，每個區段分成 4 個區塊 (Block)，...
Map和WeakMap Map 結構：Map 是一個以 key-value 的形式儲存資料，類似物件的資料結構，key 可以是任何型別，而 value 也可以...
前言 昨天我們已經了解如何實作出一個元件，今天我們將實作一個任務清單元件，並一步步重構它，使原本無法複用的元件，利用泛型變成更通用、更彈性的元件。這章節會著重...
運用漸變、動畫與動態樣式，讓你的網頁元素閃耀出迷人的色彩魅力！ 哈囉！受夠了中規中矩的文字了嗎？是時候讓你的網頁閃耀起來啦！ 今天我們要用 Vue.js 來玩...
今天要介紹的是 Command 模式，這是 GoF 定義的行為型模式之一。 情境 開發複雜應用程式時，開發者會需要一個靈活的架構來處理各種操作或功能，這些操作...
聯繫我 如果有任何問題或建議，歡迎隨時聯繫我： GitHub Email 介紹 歡迎來到第十四天的學習！今天我們將深入探討 ES6 引入的類別（Cl...
前面花了兩篇解決了圖片顯示的問題，接下來來解決文章顯示的問題現在我們是用 Sanity 預設的 text 型別，並且在裡面存放 markdown 格式的內容，渲...
Day 14 透過 JS SDK 模擬及拷貝 M1 卡的卡號 在一些安全性比較低的門禁系統中，有時候只會讀取 RFID 卡片的卡號，然後根據卡號來決定是否開啟門...
本篇文章除了要來介紹 undefined、null 在 strictNullChecks 的不同設置下的差異還會介紹到「兩者的可指派性」和 「TypeScri...
原型 (Prototype) 在 JavaScript 中，每個物件都有一個內部屬性稱為 [[Prototype]]，它指向該物件的原型。原型是一個物件，包含了...
前言 後端完成後，就要來介紹前端如何搭配 TypeScript 來開發，這個章節我們會使用 React 來實作簡單的任務管理網站，並串接我們寫好的後端，而會選...
不同於上一篇的 Sanity 圖片 url 直接在查詢圖片時就把圖片 url 查詢出來或是用 _ref 組合出圖片的 url。這次要使用的是 @Sanity/i...
讓畫面隨時光流動，用動效打造日與夜的邂逅！ 哈囉大家！今天我們要來點浪漫的～🌙☀️當我們說到網頁動效，你是不是也曾幻想過，能不能讓畫面隨著時間的流動變換出日...
今天要介紹的是 Mediator 模式，屬於 GoF 定義的行為型模式之一。 情境 在複雜的前端應用程式中，當模組或元件逐漸增加，各元件間的互動會變得更複雜，...
簡介 Nuxt3 提供了強大而靈活的路由系統，結合 TypeScript 的靜態類型檢查，可以大大提高開發效率和代碼質量。本文將深入探討 Nuxt3 中的路由...
簡介 在現代的 Web 應用開發中，有效管理全局狀態是一個關鍵挑戰。Nuxt3 作為一個強大的 Vue.js 框架，結合 Pinia 這個靈活的狀態管理庫，為...
Day 13 透過 JS SDK 讀取 RFID 卡號 在一些安全性比較低的門禁系統中，有時候只會讀取 RFID 卡片的卡號，然後根據卡號來決定是否開啟門禁，所...
讓導航欄脫穎而出！用 Vue.js 和 GSAP 強調呼吸感的品牌互動 哈囉各位！今天我們要來搞點大動作，帶大家一起用 Vue.js 和 GSAP 打造一個超...
Mao
Ashley
hannnahTW
Sunny.Cat
Wayne Chang
Monica
戴均民
Chill 77
MichaelHo
iThome鐵人賽
看影片追技術