前面花了兩篇解決了圖片顯示的問題,接下來來解決文章顯示的問題現在我們是用 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 打造一個超...
前言 在這篇文章中,我們將介紹如何使用 TypeScript 的裝飾器來生成 Express 路由,從而讓程式碼更加簡潔。過去,由於 TypeScript 的...
閉包是什麼? closure 函式可以存取其外部函式的變數,即使外部函式已經執行完畢並離開其作用域。可以存取到外部變數的原因在於: JavaScript 使用了...
Sanity 圖片 url 結構 現在可以看一看一般在搜尋圖片欄位時的圖片欄位參照內容: *[_type == "blogPost" &am...
延續昨天提到的 Observer 模式,今天要介紹的是與 Observer 十分相似的延伸版,即 Publish/Subscribe 模式。GoF 一書中提到...
本篇要來介紹 void 型別,原本也想把 undefined, null 一起寫在這篇,但怕篇幅過長還是拆開吧!不然閱讀量更低了 void 在 TypeScr...
簡介 Nuxt3 是一個強大的 Vue.js 框架,它結合了服務器端渲染(SSR)和靜態站點生成(SSG)的優勢,同時提供了出色的開發體驗。本文將帶您深入了解...
簡介 在現代 Web 應用開發中,隨著應用規模的增長,初始加載時間可能會變得越來越長,影響用戶體驗。本文將深入探討如何在 Vue 3 應用中實現懶加載和代碼分...
簡介 在現代 Vue.js 應用程序開發中,處理異步操作和 API 請求是常見且關鍵的任務。本文將深入探討如何使用 Vitest 來全面測試這些異步行為和 A...
unknown 和 any 經常放在一起比較,它們十分相似,但相較於 any, unknown 更為安全,因為它不像 any 一樣任何型別都可以接受,甚至操作...
Day 12 準備 JS SDK 的 Playground 均民所開發的 JS SDK 可以在瀏覽器及 Node.js 的環境中執行,均民平常自己在開發的時候,...
一般的Function function Hello() { console.log("一般的Function", "Hell...
querySelector 尋找DOM 可以用來尋找(ID)、Class、tag const H1Class = document.querySelecto...
前言 在開發後端應用程式時,資料驗證和中間件的設計是非常重要的。這不僅能確保資料的正確性,也能提升 API 的穩定性。在這篇文章中,我們將使用與 TypeSc...
探索 Vue.js 循環動效,為您的網頁注入獨特的貓咪魅力,感受每一刻的‘MADE WITH LOVE’。 哈囉各位,今天我們要一起來揭開文字循環特效的神秘面...
.call跟.apply 都可以直接呼叫函式並且改變函式內 this 的指向,兩者最主要的差異是傳入的參數形式不同。 .call 定義:.call 方法會立即...
any 是 TypeScript 獨有的型別,它的功用如同它的名字,任何型別都可以接受當一個變數被定義為 any 時,就是在告訴 TypeScript 編譯器說...
今天要介紹的是 Observer 模式,這是 Gof 提出的模式之一,屬於行為型設計模式,這也是目前為止我覺得可以延伸最多應用案例的模式~ 情境 在一個應用程...
本篇將使用 Next.js 顯示 Sanity 內部落格文章的內容。首先會建立文章列表,並且透過 next/link 將頁面導入個別文章內容。頁面 css 的話...