前言 這篇文章會帶大家一步步操作，如何將 GitHub 內的 Nuxt 專案，透過 Zeabur 平台進行部署，完成自動化、一鍵部署的上線流程。 註冊 Zeabur 並部署 Nuxt 專案 前往...
前言 在這篇文章中，我們將介紹在 Nuxt 3 專案實作搜尋引擎優化（SEO）相關的功能，包括設定 meta 標籤與 Open Graph（og）標籤，讓社群平台與搜尋引擎正確解析網站資訊，以及說明如...
前言 在實務開發中，前端經常需要透過 API 來取得資料，因此這篇文章要分享「如何在 Nuxt 專案中串接 API 並顯示動態內容」。我們會以政府資料開放平臺作為 API 的資料來源，專注介紹前端的串...
前言 延續上一篇完成的 UI 畫面與元件素材，在這個篇章我們將加入 LIFF 提供的登入機制與完成註冊流程，完成 LINE 互動網站功能！關於註冊流程的所有步驟，可以參考第四篇，裡面有完整的 User...
前言 在前一篇我們完成 Nuxt 專案初始化，以及介紹到目錄結構，這篇將依照設計稿，一步步完成整體畫面製作。本篇會專注在網站註冊頁面 UI 元件的開發，例如 條款提示視窗、插圖視覺區塊、LINE 按鈕...
前言 在前篇分享了到 Nuxt 的優勢與應用情境，再來要分享如何建立 Nuxt 專案，與介紹專案整體的目錄結構。如果是第一次使用 Nuxt，這篇可以作為不錯的起點。若之前有用過 Vue CLI 或 V...
前言 在 Vue 專案開發中，可能有遇過這些痛點——網站需要做 SEO，但傳統 SPA 無法有效動態渲染 meta 標籤；或是與後端 API 整合時，缺乏一致性的資料流處理，導致 auth 驗證、中介...
哈囉大家好！今天要來分享如何將我們辛苦製作的 Nuxt 3 專案部署到雲端。是不是聽起來很厲害？別擔心，跟著我一步一步來，保證你也能輕鬆搞定！ Vercel 簡介 首先，讓我來介紹一下我們今天的主角—...
哈囉，各位好！今天我們要來挑戰實用又有趣的頁面——製作一個互動式的聯絡表單。不管你是剛入門的新手，還是想更深入了解 Nuxt 3 的開發者，這個教學都能讓你學到很多實用的技巧。我們會用到 Nuxt 3...
接觸過SPA（單頁應用）的世界後，現在來看SSR的資料我感到萬分痛苦…。我們先假想在不久後的將來，也許某天Boss說：「這個系統從SPA改成SSR」我們會想起這天含著淚研讀後的成果… ◎先說結論：原本...