iT邦幫忙

javascript相關文章
共有 5687 則文章

技術 Day 14 - Sanity Markdown Plugin

前面花了兩篇解決了圖片顯示的問題,接下來來解決文章顯示的問題現在我們是用 Sanity 預設的 text 型別,並且在裡面存放 markdown 格式的內容,渲...

鐵人賽 JavaScript DAY 14

技術 Day 14 透過 JS SDK 模擬及拷貝 M1 卡的卡號

Day 14 透過 JS SDK 模擬及拷貝 M1 卡的卡號 在一些安全性比較低的門禁系統中,有時候只會讀取 RFID 卡片的卡號,然後根據卡號來決定是否開啟門...

鐵人賽 JavaScript DAY 18

技術 TypeScript 初學者也能看的學習指南 18 - undefined、null 型別

本篇文章除了要來介紹 undefined、null 在 strictNullChecks 的不同設置下的差異還會介紹到「兩者的可指派性」和 「TypeScri...

30 天克服前端面試 系列 第 13

技術 Day 13 - 請描述原型繼承如何在 JavaScript 運作中?

原型 (Prototype) 在 JavaScript 中,每個物件都有一個內部屬性稱為 [[Prototype]],它指向該物件的原型。原型是一個物件,包含了...

鐵人賽 JavaScript DAY 26

技術 TypeScript 實戰:前端 React Setup

前言 後端完成後,就要來介紹前端如何搭配 TypeScript 來開發,這個章節我們會使用 React 來實作簡單的任務管理網站,並串接我們寫好的後端,而會選...

技術 Day 13 - @Sanity/image-url + Next.js

不同於上一篇的 Sanity 圖片 url 直接在查詢圖片時就把圖片 url 查詢出來或是用 _ref 組合出圖片的 url。這次要使用的是 @Sanity/i...

鐵人賽 Modern Web DAY 13

技術 Day13 Vue.js 動效分類實戰 (5) 視差滾動特輯 - 用 GSAP 編織日夜交替的視覺詩歌

讓畫面隨時光流動,用動效打造日與夜的邂逅! 哈囉大家!今天我們要來點浪漫的~🌙☀️當我們說到網頁動效,你是不是也曾幻想過,能不能讓畫面隨著時間的流動變換出日...

鐵人賽 JavaScript DAY 13

技術 [Day 13] Mediator 模式

今天要介紹的是 Mediator 模式,屬於 GoF 定義的行為型模式之一。 情境 在複雜的前端應用程式中,當模組或元件逐漸增加,各元件間的互動會變得更複雜,...

鐵人賽 Modern Web DAY 29

技術 Day 29: Nuxt3 中的路由管理以及 Middleware:如何結合 TypeScript 實現靈活的路由系統

簡介 Nuxt3 提供了強大而靈活的路由系統,結合 TypeScript 的靜態類型檢查,可以大大提高開發效率和代碼質量。本文將深入探討 Nuxt3 中的路由...

鐵人賽 Modern Web DAY 28

技術 Day 28: 使用 Pinia 與 Nuxt3 管理全局狀態

簡介 在現代的 Web 應用開發中,有效管理全局狀態是一個關鍵挑戰。Nuxt3 作為一個強大的 Vue.js 框架,結合 Pinia 這個靈活的狀態管理庫,為...

鐵人賽 JavaScript DAY 13

技術 Day 13 透過 JS SDK 讀取 RFID 卡號

Day 13 透過 JS SDK 讀取 RFID 卡號 在一些安全性比較低的門禁系統中,有時候只會讀取 RFID 卡片的卡號,然後根據卡號來決定是否開啟門禁,所...

鐵人賽 Modern Web DAY 12

技術 Day12 Vue.js 動效分類實戰 (4) 導航特輯 - 用 GSAP 打造超爆棚品牌感設計

讓導航欄脫穎而出!用 Vue.js 和 GSAP 強調呼吸感的品牌互動 哈囉各位!今天我們要來搞點大動作,帶大家一起用 Vue.js 和 GSAP 打造一個超...

鐵人賽 JavaScript DAY 25

技術 TypeScript 實戰:後端裝飾器生成路由

前言 在這篇文章中,我們將介紹如何使用 TypeScript 的裝飾器來生成 Express 路由,從而讓程式碼更加簡潔。過去,由於 TypeScript 的...

30 天克服前端面試 系列 第 12

技術 Day 12 - 請說明 closure 閉包是什麼?如何應用?

閉包是什麼? closure 函式可以存取其外部函式的變數,即使外部函式已經執行完畢並離開其作用域。可以存取到外部變數的原因在於: JavaScript 使用了...

技術 Day 12 - Sanity 圖片 url 參數解析

Sanity 圖片 url 結構 現在可以看一看一般在搜尋圖片欄位時的圖片欄位參照內容: *[_type == "blogPost" &am...

鐵人賽 JavaScript DAY 12

技術 [Day 12] Publish/Subscribe 模式

延續昨天提到的 Observer 模式,今天要介紹的是與 Observer 十分相似的延伸版,即 Publish/Subscribe 模式。GoF 一書中提到...

鐵人賽 JavaScript DAY 17

技術 TypeScript 初學者也能看的學習指南 17 - void 型別

本篇要來介紹 void 型別,原本也想把 undefined, null 一起寫在這篇,但怕篇幅過長還是拆開吧!不然閱讀量更低了 void 在 TypeScr...

鐵人賽 Modern Web DAY 27

技術 Day 27: 初探 Nuxt3:如何利用 Nuxt3 與 TypeScript 打造伺服器端渲染應用

簡介 Nuxt3 是一個強大的 Vue.js 框架,它結合了服務器端渲染(SSR)和靜態站點生成(SSG)的優勢,同時提供了出色的開發體驗。本文將帶您深入了解...

鐵人賽 Modern Web DAY 26

技術 Day 26: 在 Vue 應用中實現懶加載與代碼分割以提升性能

簡介 在現代 Web 應用開發中,隨著應用規模的增長,初始加載時間可能會變得越來越長,影響用戶體驗。本文將深入探討如何在 Vue 3 應用中實現懶加載和代碼分...

鐵人賽 Modern Web DAY 25

技術 Day 25: 使用 Vitest 測試異步行為與 API 請求邏輯

簡介 在現代 Vue.js 應用程序開發中,處理異步操作和 API 請求是常見且關鍵的任務。本文將深入探討如何使用 Vitest 來全面測試這些異步行為和 A...

鐵人賽 JavaScript DAY 16

技術 TypeScript 初學者也能看的學習指南 16 - unknown 未知型別

unknown 和 any 經常放在一起比較,它們十分相似,但相較於 any, unknown 更為安全,因為它不像 any 一樣任何型別都可以接受,甚至操作...

鐵人賽 JavaScript DAY 12

技術 Day 12 準備 JS SDK 的 Playground

Day 12 準備 JS SDK 的 Playground 均民所開發的 JS SDK 可以在瀏覽器及 Node.js 的環境中執行,均民平常自己在開發的時候,...

技術 2024 IT鐵人賽 Day7 - Function

一般的Function function Hello() { console.log("一般的Function", "Hell...

技術 2024 IT鐵人賽 Day6 - 取得DOM元素

querySelector 尋找DOM 可以用來尋找(ID)、Class、tag const H1Class = document.querySelecto...

鐵人賽 JavaScript DAY 24

技術 TypeScript 實戰:後端驗證與中間件

前言 在開發後端應用程式時,資料驗證和中間件的設計是非常重要的。這不僅能確保資料的正確性,也能提升 API 的穩定性。在這篇文章中,我們將使用與 TypeSc...

鐵人賽 Modern Web DAY 11

技術 Day11 Vue.js 動效分類實戰 (3) 循環特輯 - 玩踩貓咪腳印的循環動效

探索 Vue.js 循環動效,為您的網頁注入獨特的貓咪魅力,感受每一刻的‘MADE WITH LOVE’。 哈囉各位,今天我們要一起來揭開文字循環特效的神秘面...

30 天克服前端面試 系列 第 11

技術 Day 11 - 請說明 JavaScript 中.call 和 .apply 的差異為何?

.call跟.apply 都可以直接呼叫函式並且改變函式內 this 的指向,兩者最主要的差異是傳入的參數形式不同。 .call 定義:.call 方法會立即...

鐵人賽 JavaScript DAY 15

技術 TypeScript 初學者也能看的學習指南 15 - any 任意型別

any 是 TypeScript 獨有的型別,它的功用如同它的名字,任何型別都可以接受當一個變數被定義為 any 時,就是在告訴 TypeScript 編譯器說...

鐵人賽 JavaScript DAY 11

技術 [Day 11] Observer 模式

今天要介紹的是 Observer 模式,這是 Gof 提出的模式之一,屬於行為型設計模式,這也是目前為止我覺得可以延伸最多應用案例的模式~ 情境 在一個應用程...

技術 Day 11 - Next.js 顯示 Sanity 文章內容

本篇將使用 Next.js 顯示 Sanity 內部落格文章的內容。首先會建立文章列表,並且透過 next/link 將頁面導入個別文章內容。頁面 css 的話...