KD's Tech Blog

Hi, 我是 KD Chang 凱迪，紀錄關於軟體開發/程式設計/工程思維的技術筆記 | KD 技術部落格

Vue Router 入門教學筆記 | 學習筆記

前言Vue Router 是 Vue.js 官方提供的前端路由解決方案，專為構建單頁應用（SPA, Single Page Application）而設計。它讓我們可以根據網址變化動態切換畫面而不重新載入頁面，是開發 Vue 應用不可或缺的工具之一。 本文將介紹 Vue Router 的基本概念、安裝方式、核心語法，並透過簡單實作幫助我們快速入門。 一、什麼是前端路由在傳統網頁架構中，網址......

Posted by kdchang on 2024-11-16

Element Plus 介紹入門教學筆記 | 學習筆記

前言在現代前端開發中，UI 框架對於提升開發效率、提升用戶體驗具有至關重要的作用。Element Plus 是一個基於 Vue 3 的開源 UI 框架，它提供了豐富的組件，並且與 Vue 3 的 Composition API 完美兼容，能幫助開發者快速構建高質量的前端應用。 在筆記中，我們將使用 Vue 3 的 setup() 語法來講解如何在專案中使用 Element Plus，並展示如......

Posted by kdchang on 2024-11-16

Vuex 入門教學筆記：集中式狀態管理實作入門教學筆記 | 學習筆記

前言在 Vue.js 開發中，當應用程式變得複雜，元件之間需要共享的狀態越來越多時，僅靠 props 與 events 傳遞資料會變得混亂與難以維護。這時，我們就需要一個集中式的狀態管理方案，而 Vuex 正是官方為 Vue 提供的解決方案。 Vuex 是一個專為 Vue 應用開發的狀態管理模式。它將應用中所有的狀態集中管理，並以可預測的方式更新，便於追蹤與維護。 一、Vuex 是什麼？V......

Posted by kdchang on 2024-11-16

Vue i18n 入門教學筆記 | 學習筆記

1. Vue I18n 簡介Vue i18n 是 Vue.js 的國際化（Internationalization）解決方案，可用於管理應用程式的多語系內容。當開發需要支援不同語言的應用時，Vue i18n 提供了一個高效的方式來處理翻譯、數字格式、日期格式等。 1.1 為何使用 Vue I18n？ 動態切換語言：讓使用者能夠即時更改語言。 簡化多語系管理：集中化翻譯內容，方便維護。 格式化......

Posted by kdchang on 2024-11-13

Vue v-cloak 入門教學筆記 | 學習筆記

前言v-cloak 在 Vue 3 依然存在，作用與 Vue 2 相同：在 Vue 實例或組件掛載完成之前，避免模板中的插值語法（如 {{ message }}）閃爍顯示給使用者。搭配 CSS 可在 Vue 掛載完成前隱藏元素，增進首屏體驗。 重點摘要 v-cloak 為特殊屬性，Vue 3 掛載完成會自動移除。 必須搭配 CSS [v-cloak]......

Posted by kdchang on 2024-02-20

將 Vue 3 應用部署到 GitHub Pages 入門語法教學筆記 | 學習筆記

要將 Vue 3 應用部署到 GitHub Pages，這裡有一個詳細的步驟說明，指導你如何使用 gh-pages 部署你的應用。 1. 安裝 gh-pages 套件首先，你需要安裝 gh-pages 套件來將你的專案部署到 GitHub Pages。 在專案目錄中執行以下命令： npm install --save-dev gh-pages 2. 配置 vite.config.js為了將......

Posted by kdchang on 2018-02-01

ABOUT ME
KD's Tech Blog 技術部落格 | KD Chang 張凱迪

KD Chang 張凱迪（@kdchang），台灣大學，主修經濟學，臺大資管所畢業。是一個軟體工程師，也是一位 PM 產品/專案經理和教育工作者。曾服務過上市網路軟體公司、上市科技電子公司、台灣 AI 人工智慧新創獨角獸公司，也曾參與數個新創組織的創辦和多個網路產品服務的開發。A Software Engineer, Product/Project Manager & Educator.:)

FRIENDS