iT邦幫忙

鐵人檔案

2022 iThome 鐵人賽
回列表
Modern Web

Nuxt 3 - 因為還不穩定,所以來踩地雷 系列

習慣 Vue 3 的寫法之後,就想嘗試使用 Nuxt 3 來處理 SSR(其實也可以用 Vite),但是 Nuxt 3 目前仍在 RC 版本,拿來正式專案上使用會有不小風險,利用這 30 天簡單的了解 Nuxt 3 使用方式,等穩定正式版上線後就能快速上手。

鐵人鍊成 | 共 30 篇文章 | 17 人訂閱 訂閱系列文 RSS系列文
DAY 11

[Day 11] Nuxt3 的 AJAX 家族:useAsyncData、useFetch、useLazyFetch、useLazyAsyncData

串接後端 API 已經是前端必備技能了,通常會使用 Axios 或 fetch ($.ajax, XMLHttpRequest...),Nuxt3 中提供了四種...

2022-09-26 ‧ 由 Genos 分享
DAY 12

[Day 12] Nuxt3 的 錯誤管理

錯誤管理是專案非常重要的一塊,在真正進入開發時都需要設想好各種狀況,避免上線後一個錯誤頁面就不動了。 Nuxt3 的文件中有針對 錯誤管理特別說明,馬上來看看有...

2022-09-27 ‧ 由 Genos 分享
DAY 13

[Day 13] Nuxt3 - 其他 API 介紹

在前面 12 天的文章中已經依照各種使用分類介紹 Nuxt3 的結構和許多會用到的 API,今天來介紹非必要,但可以嘗試看看的 API,至於官方文件中有,但是沒...

2022-09-28 ‧ 由 Genos 分享
DAY 14

[Day 14] Nuxt3 方便的功能 - autoImport

鐵人賽過了快一半了才發現這個重要的東西只有簡單帶過,沒有詳細介紹到(這還是文件中核心概念的第一章),可能是使用上太習慣,所以習慣到忽略了...autoImpor...

2022-09-29 ‧ 由 Genos 分享
DAY 15

[Day15] Nuxt3 x ESlint + Prettier + Husky

鐵人賽經過一半,Nuxt3 的功能基本介紹差不多了,今天補上自己在建置專案時習慣會加上的 lint,接下來就會結合前兩週的內容來實作一個 Blog。 團隊協作時...

2022-09-30 ‧ 由 Genos 分享
DAY 16

[Day16] 使用 Nuxt3 Content 建置一個部落格 - 基本環境

Nuxt3 的功能已經介紹的差不多了,接下來會參考Vue Mastery的免費教學建置一個部落格做為簡單的練習,Vue Mastery 有許多影音教學資源可以利...

2022-10-01 ‧ 由 Genos 分享
DAY 17

[Day17] 使用 Nuxt3 Content 建置一個部落格 - 安裝 Nuxt3 Content

Content 是一個基於檔案的 CMS,可以支援的檔案類型有 .md, .yml, .csv 和 .json,快速的把靜態資料檔案 和 Vue 的元件結合。...

2022-10-02 ‧ 由 Genos 分享
DAY 18

[Day18] 使用 Nuxt3 Content 建置一個部落格 - 結合靜態資料與元件

使用 Content 來自定樣式的方式很簡單,就是將寫好樣式的 Vue 元件加入 <slot /> 標籤來放入文字,馬上來說明如何使用: 在 co...

2022-10-03 ‧ 由 Genos 分享
DAY 19

[Day19] 使用 Nuxt3 Content 建置一個部落格 - 快速生成導覽列

導覽列是部落格非常重要的一個部分,沒有導覽列就無法順利切換文章。 在 Nuxt Content 中有底下這三個屬性可以讓我們來運用 v-for 迴圈快速產生導覽...

2022-10-04 ‧ 由 Genos 分享
DAY 20

[Day20] 使用 Nuxt3 Content 建置一個部落格 - 文章列表

昨天的文章談到如何製作導覽列,今天介紹<ContentList>文章列表這個非常相似的東西。 兩者的差別 導覽列是整個 Content 底下所有檔...

2022-10-05 ‧ 由 Genos 分享