iT邦幫忙

鐵人檔案

2022 iThome 鐵人賽
回列表
Modern Web

Nuxt 3 學習筆記 系列

在使用 Vue 3 開發網站可能會面臨需要做 SEO 的情境,為了解決該情境問題,你可能會找到使用 Vite 做預渲染或其他方式,Nuxt 3 也是其中一個解決方案,且有更多強大的功能,目前 Nuxt 3 正在 RC 階段,但已經可開始嚐鮮踩雷,等穩定版正式發布後能更快地上手。
本系列會著重在 Nuxt 3 的特色與功能學習,所以你可能需具備些 Vue 3 基礎,我將從搭建 Nuxt 3 開發環境、頁面路由與佈局一直到使用 Nuxt 3 建立 SEO 所需的資訊做些筆記及介紹,讓你有個概念並嘗試用 Nuxt 3 來做 SSR 或 SSG,進而解決 Vue 3 SPA 不好做 SEO 的問題。

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

[Day 01] 淺談 CSR、SSR 與 SSG

🔥【Vue.js → Nuxt 入門推薦!🌟 新書即將上市 🌟】📘《想要 SSR 嗎?就使用 Nuxt 吧!Nuxt 讓 Vue.js 更好處理 SEO 搜...

2022-09-16 ‧ 由 Ryan 分享
DAY 2

[Day 02] Nuxt 3 介紹

🔥【Vue.js → Nuxt 入門推薦!🌟 新書即將上市 🌟】📘《想要 SSR 嗎?就使用 Nuxt 吧!Nuxt 讓 Vue.js 更好處理 SEO 搜...

2022-09-17 ‧ 由 Ryan 分享
DAY 3

[Day 03] Nuxt 3 - 使用 nuxi 建立第一個專案

🔥【Vue.js → Nuxt 入門推薦!🌟 新書即將上市 🌟】📘《想要 SSR 嗎?就使用 Nuxt 吧!Nuxt 讓 Vue.js 更好處理 SEO 搜...

2022-09-18 ‧ 由 Ryan 分享
DAY 4

[Day 04] Nuxt 3 + TypeScript + ESLint + Prettier 環境建置

🔥【Vue.js → Nuxt 入門推薦!🌟 新書即將上市 🌟】📘《想要 SSR 嗎?就使用 Nuxt 吧!Nuxt 讓 Vue.js 更好處理 SEO 搜...

2022-09-19 ‧ 由 Ryan 分享
DAY 5

[Day 05] Nuxt 3 如何使用 Tailwind CSS

🔥【Vue.js → Nuxt 入門推薦!🌟 新書即將上市 🌟】📘《想要 SSR 嗎?就使用 Nuxt 吧!Nuxt 讓 Vue.js 更好處理 SEO 搜...

2022-09-20 ‧ 由 Ryan 分享
DAY 6

[Day 06] Nuxt 3 目錄結構與自動載入 (Auto Imports)

🔥【Vue.js → Nuxt 入門推薦!🌟 新書即將上市 🌟】📘《想要 SSR 嗎?就使用 Nuxt 吧!Nuxt 讓 Vue.js 更好處理 SEO 搜...

2022-09-21 ‧ 由 Ryan 分享
DAY 7

[Day 07] Nuxt 3 頁面 (Pages) 與路由 (Routing)

🔥【Vue.js → Nuxt 入門推薦!🌟 新書即將上市 🌟】📘《想要 SSR 嗎?就使用 Nuxt 吧!Nuxt 讓 Vue.js 更好處理 SEO 搜...

2022-09-22 ‧ 由 Ryan 分享
DAY 8

[Day 08] Nuxt 3 布局模板 (Layouts)

🔥【Vue.js → Nuxt 入門推薦!🌟 新書即將上市 🌟】📘《想要 SSR 嗎?就使用 Nuxt 吧!Nuxt 讓 Vue.js 更好處理 SEO 搜...

2022-09-23 ‧ 由 Ryan 分享
DAY 9

[Day 09] Nuxt 3 元件 (Components)

🔥【Vue.js → Nuxt 入門推薦!🌟 新書即將上市 🌟】📘《想要 SSR 嗎?就使用 Nuxt 吧!Nuxt 讓 Vue.js 更好處理 SEO 搜...

2022-09-24 ‧ 由 Ryan 分享
DAY 10

[Day 10] Nuxt 3 組合式函式 (Composables)

🔥【Vue.js → Nuxt 入門推薦!🌟 新書即將上市 🌟】📘《想要 SSR 嗎?就使用 Nuxt 吧!Nuxt 讓 Vue.js 更好處理 SEO 搜...

2022-09-25 ‧ 由 Ryan 分享