iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

0 Like 0 留言 192 瀏覽

鐵人賽佛心分享-SideProject30 DAY 26

房東不給養鸚鵡 - 那就用 Nuxt + Express + MongoDB 30 天寫一個全端鸚鵡專案系列第 26 篇

技術 [ DAY26 ] Nuxt 3 進階技巧：Pinia、API 整合、Loading 元件

嗨！今天要跟大家分享的是如何在 Nuxt 3 專案中運用 Pinia 這個強大的狀態管理工具，並且實作一個客製化的 Loading 元件。無論你是剛接觸 Vue...

2魚 ‧ 2024-10-05 ‧團隊跟著2魚一起坐牢

0 Like 0 留言 235 瀏覽

鐵人賽佛心分享-SideProject30 DAY 25

房東不給養鸚鵡 - 那就用 Nuxt + Express + MongoDB 30 天寫一個全端鸚鵡專案系列第 25 篇

技術 [ DAY25 ] Nuxt 3 開發之旅：顏色、圖示、導航欄到動畫效果

哈囉大家好！今天我們要來玩點有趣的東西了 —— 我們要開始打造我們的網頁骨架啦！想像一下，我們今天要給我們的 Nuxt3 專案穿上漂亮的衣服，讓它不再只是一個空...

2魚 ‧ 2024-10-04 ‧團隊跟著2魚一起坐牢

0 Like 0 留言 205 瀏覽

鐵人賽佛心分享-SideProject30 DAY 23

房東不給養鸚鵡 - 那就用 Nuxt + Express + MongoDB 30 天寫一個全端鸚鵡專案系列第 23 篇

技術 [ DAY23 ] Nuxt3 開發必備：套件安裝懶人包

哈囉大家早安！昨天我們成功建立了 Nuxt3 的開發環境，今天我們要來認識幾個超級實用的開發工具和套件。這些工具就像是我們的小幫手，不只能讓我們的程式碼變得更漂...

2魚 ‧ 2024-10-02 ‧團隊跟著2魚一起坐牢

1 Like 0 留言 126 瀏覽

鐵人賽 Modern Web DAY 29

Vue 和 TypeScript 的最佳實踐：成為前端工程師的進階利器系列第 29 篇

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

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

MichaelHo ‧ 2024-10-13

1 Like 0 留言 139 瀏覽

鐵人賽 Modern Web DAY 28

Vue 和 TypeScript 的最佳實踐：成為前端工程師的進階利器系列第 28 篇

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

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

MichaelHo ‧ 2024-10-12

1 Like 0 留言 83 瀏覽

鐵人賽 Modern Web DAY 27

Vue 和 TypeScript 的最佳實踐：成為前端工程師的進階利器系列第 27 篇

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

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

MichaelHo ‧ 2024-10-11

0 Like 1 留言 1072 瀏覽

鐵人賽影片教學 DAY 30

Nuxt 3 快速入門系列第 30 篇

技術 [影片教學] Nuxt 3 部署網站服務

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。 Nuxt 3 網站部署至 Vercel 流程前往 Verc...

Ryan ‧ 2023-10-15

0 Like 1 留言 1435 瀏覽

鐵人賽 Vue.js DAY 30

Nuxt 3 實戰筆記系列第 30 篇

技術 [Day 30] Nuxt 3 版本的升級與套件升級的管理工具

Nuxt 3 版本的升級目前 Nuxt 3 仍積極的在修正錯誤與添加新功能，版本更新的速度也不慢，相較去年底，目前正式版釋出後已經穩定許多，與其他大型的開源框...

Ryan ‧ 2023-10-15 ‧團隊啾嚕咕嚕跳起來

0 Like 0 留言 616 瀏覽

鐵人賽影片教學 DAY 29

Nuxt 3 快速入門系列第 29 篇

技術 [影片教學] Nuxt 3 部署前的建構打包

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。建構打包專案使用 Nuxt CLI 的 build 指令來...

Ryan ‧ 2023-10-14

0 Like 0 留言 1721 瀏覽

鐵人賽 Vue.js DAY 29

Nuxt 3 實戰筆記系列第 29 篇

技術 [Day 29] Nuxt 3 混合渲染 (Hybrid Rendering) 中的 SWR 與 ISR

前言 Nuxt 3 除了是一個 SSR 的框架外，也能允許網頁使用混合渲染 (Hybrid Rendering)，混合渲染允許使用路由路徑的規則來決定不同的渲染...

Ryan ‧ 2023-10-14 ‧團隊啾嚕咕嚕跳起來

0 Like 0 留言 758 瀏覽

鐵人賽影片教學 DAY 28

Nuxt 3 快速入門系列第 28 篇

技術 [影片教學] Nuxt 3 視覺化開發工具 Nuxt DevTools

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。展示專案我們使用實戰部落格系列所開發的範例程式碼：http...

Ryan ‧ 2023-10-13

0 Like 1 留言 1453 瀏覽

鐵人賽 Vue.js DAY 28

Nuxt 3 實戰筆記系列第 28 篇

技術 [Day28] Nuxt 3 建構打包與部署至 Cloudflare Workers

前言 Nuxt 3 的網站應用程式，可以根據實際業務需求來決定渲染的模式，而最終專案所建構打包的專案程式碼，也會因為模式的選擇而需要部署在不同的執行環境上，例如...

Ryan ‧ 2023-10-13 ‧團隊啾嚕咕嚕跳起來

0 Like 0 留言 563 瀏覽

鐵人賽影片教學 DAY 27

Nuxt 3 快速入門系列第 27 篇

技術 [影片教學] Nuxt 3 SEO 搜尋引擎最佳化 - 實戰部落格系列 Part 5

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。添加網站頁面的標題調整 ./app.vue 檔案： &lt...

Ryan ‧ 2023-10-12

2 Like 1 留言 1300 瀏覽

鐵人賽 Vue.js DAY 27

Nuxt 3 實戰筆記系列第 27 篇

技術 [Day 27] Nuxt 3 產生靜態網頁部署至 Cloudflare Pages 與持續自動部署

前言 Nuxt 3 的渲染模式，可以支援我們產生靜態的頁面，而這些預渲染的靜態網頁檔案，就很適合部署至靜態的託管平台來服務，例如 Cloudflare Page...

Ryan ‧ 2023-10-12 ‧團隊啾嚕咕嚕跳起來

0 Like 1 留言 878 瀏覽

鐵人賽影片教學 DAY 26

Nuxt 3 快速入門系列第 26 篇

技術 [影片教學] Nuxt 3 路由頁面的權限判斷 - 實戰部落格系列 Part 4

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。建立路由中間件在 middleware 目錄下建立一個檔案...

Ryan ‧ 2023-10-11

0 Like 0 留言 2188 瀏覽

鐵人賽 Vue.js DAY 26

Nuxt 3 實戰筆記系列第 26 篇

技術 [Day 26] Nuxt 3 錯誤頁面 (Error Page) 與錯誤處理 (Error handling)

前言網站開發過程與上正式環境後，難免會遇到一些 Bug 導致網站處理邏輯發生異常，甚至一小段的 JavaScript 的邏輯錯誤或未處理的拋出錯誤，可能導致整...

Ryan ‧ 2023-10-11 ‧團隊啾嚕咕嚕跳起來

0 Like 0 留言 572 瀏覽

鐵人賽影片教學 DAY 25

Nuxt 3 快速入門系列第 25 篇

技術 [影片教學] Nuxt 3 Server API 權限判斷與串接 - 實戰部落格系列 Part 3

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。建立伺服器中間件在 server/middleware 目...

Ryan ‧ 2023-10-10

0 Like 0 留言 1958 瀏覽

鐵人賽 Vue.js DAY 25

Nuxt 3 實戰筆記系列第 25 篇

技術 [Day 25] Nuxt 3 深入靜態資源的使用 Public & Assets

前言不管在 Vue 與 Nuxt 的開發，常會有需要使用圖片或靜態資源的時刻，例如，已經具有外部的圖片連結，我們很輕易的可以使用 URL 等方式來做載入，若是...

Ryan ‧ 2023-10-10 ‧團隊啾嚕咕嚕跳起來

2 Like 1 留言 722 瀏覽

鐵人賽影片教學 DAY 24

Nuxt 3 快速入門系列第 24 篇

技術 [影片教學] Nuxt 3 建立部落格文章相關 API - 實戰部落格系列 Part 2

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。建立 Neon Serverless Postgres 資料...

Ryan ‧ 2023-10-09

0 Like 1 留言 1607 瀏覽

鐵人賽 Vue.js DAY 24

Nuxt 3 實戰筆記系列第 24 篇

技術 [Day 24] Nuxt 3 多國語系模組 Nuxt I18n 的進階使用方法與 SEO 搜尋引擎最佳化

前言 Nuxt 3 整合 Vue I18n v9.x 多國語系的模組 Nuxt I18n，已經在 RC 階段準備釋出正式版，在使用上也穩定不少，這篇文章將介紹一...

Ryan ‧ 2023-10-09 ‧團隊啾嚕咕嚕跳起來

1 Like 2 留言 766 瀏覽

鐵人賽 Vue.js DAY 30

Nuxt.js 3.x 筆記－打造 SSR 專案系列第 30 篇

技術 D30：Nuxt 3.x 筆記：總結與感想

終於來到最後一天～今天不談技術，決定來分享一下參賽原因與總結這次的系列文內容。總結本次系列文概念以從頭到尾實作一個 Nuxt3 專案為主題，每一篇都有範例...

claire chang ‧ 2023-10-11

1 Like 0 留言 749 瀏覽

鐵人賽影片教學 DAY 23

Nuxt 3 快速入門系列第 23 篇

技術 [影片教學] Nuxt 3 建立第一個網站 - 實戰部落格系列 Part 1

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。建立預設布局模板與路由頁面在 layouts 目錄下建立一...

Ryan ‧ 2023-10-08

0 Like 1 留言 904 瀏覽

鐵人賽 Vue.js DAY 29

Nuxt.js 3.x 筆記－打造 SSR 專案系列第 29 篇

技術 D29：Nuxt 3.x Universal（SSR）專案部署到 Firebase

本篇文章同步更新於個人部落格，歡迎交流指教～謝謝您的閱讀專案開發完成後，終於到最後一步「部署」，本篇將說明 Universal 專案部署到 Fireba...

claire chang ‧ 2023-10-10

0 Like 0 留言 2349 瀏覽

鐵人賽 Vue.js DAY 23

Nuxt 3 實戰筆記系列第 23 篇

技術 [Day 23] Nuxt 3 多國語系模組 Nuxt I18n 的初入門與基本使用方法

前言 Nuxt 3 整合 Vue I18n v9.x 多國語系的模組 Nuxt I18n，已經在 RC 階段準備釋出正式版，在使用上也穩定不少，這篇文章將簡單的...

Ryan ‧ 2023-10-08 ‧團隊啾嚕咕嚕跳起來

0 Like 0 留言 428 瀏覽

鐵人賽影片教學 DAY 22

Nuxt 3 快速入門系列第 22 篇

技術 [影片教學] Nuxt 3 靜態資源的管理 - Public & Assets

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。 Public 目錄在 Nuxt 3 的專案根目錄下，存在一...

Ryan ‧ 2023-10-07

0 Like 0 留言 1351 瀏覽

鐵人賽 Vue.js DAY 22

Nuxt 3 實戰筆記系列第 22 篇

技術 [Day 22] Nuxt 3 使用 SVG 的解決方案與更方便的使用 Icon 圖示

前言網站的介面多多少少會放置圖示 (Icon)，圖示的載入方式可以像圖片一樣以 png、jpg、webp 或 svg 等圖片格式來呈現，本篇將介紹如何在 Nu...

Ryan ‧ 2023-10-07 ‧團隊啾嚕咕嚕跳起來

1 Like 0 留言 871 瀏覽

鐵人賽影片教學 DAY 21

Nuxt 3 快速入門系列第 21 篇

技術 [影片教學] Nuxt 3 使用 I18n 建立多國語系

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。配置 Nuxt I18n 安裝 Nuxt I18n 套件 n...

Ryan ‧ 2023-10-06

1 Like 0 留言 999 瀏覽

鐵人賽 Vue.js DAY 28

Nuxt.js 3.x 筆記－打造 SSR 專案系列第 28 篇

技術 D28：Nuxt 3.x 將靜態網站部署到 GitHub Pages

本篇文章同步更新於個人部落格，歡迎交流指教～謝謝您的閱讀專案開發完成後，終於到最後一步「部署」，本篇將說明靜態網站生成（SSG），搭配 GitHub P...

claire chang ‧ 2023-10-09

0 Like 0 留言 433 瀏覽