iT邦幫忙

2025 iThome 鐵人賽

DAY 1
0
Vue.js

邊學邊做:Vue.js 實戰養成計畫系列 第 1

Day 1:起航!Orbit Coders 的 Vue.js 之旅『前言』

  • 分享至 

  • xImage
  •  

https://ithelp.ithome.com.tw/upload/images/20250913/20178644R5ZC4mtUOf.png

今年第一次參加鐵人賽,心情其實有點複雜。興奮的是終於能 push 自己每天輸出,但也緊張自己能不能撐滿 30 天。之前我在專案裡最常用的還是 React、HTML、CSS,Vue.js 對我來說幾乎是陌生領域。偏偏就是這樣,我才覺得該趁這個機會,好好來一趟框架轉換的冒險。

這次決定挑戰 Vue.js,其實是想透過另一個角度來理解「前端框架」到底能帶來什麼不同。Vue 被稱為「漸進式框架」,意思是它不會逼你一次把所有東西都重構,而是可以從一個小模組慢慢開始,逐步擴充。這對我來說很友善,因為鐵人賽時間有限,也不可能一口氣寫出一個大專案。

和 React 相比,Vue 的語法設計更接近 HTML 與模板邏輯。舉例來說,Vue 的 {{ message }} 語法,讓你能直接在模板裡顯示資料,不需要額外呼叫太多函式;響應式系統則會自動追蹤資料的變化,資料一改,畫面就會跟著更新,省去了手動操作 DOM 的麻煩。這對於從原生 JS 轉過來的人來說,應該會覺得超直覺。

除了基礎語法,Vue 也有完整的生態系:像是 Vue Router 可以處理多頁面應用,Pinia / Vuex 能做狀態管理,還有大量現成的 UI 元件庫能直接套用。這些特性與資源,正好彌補了原生開發「重複、分散、不好維護」的痛點。

所以,在這 30 天裡,我會一邊記錄環境建置、資料綁定、元件化開發等基礎主題,一邊嘗試和 React 或原生 JS 做比較。或許會有很多撞牆期,但我相信這樣的學習紀錄,不只是讓自己成長,也能幫助和我一樣的新手快速進入 Vue 的世界,一起成為強大的前端工程師吧!

就這樣,Vue.js 的冒險,正式展開~


下一篇
Day 2:建置發射台 — 環境安裝與開發工具(Node.js、VSCode、 Vite)
系列文
邊學邊做:Vue.js 實戰養成計畫4
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 則留言

1
connieleung
iT邦新手 4 級 ‧ 2025-09-15 13:54:58

加油。我是看不慣React 的Tsx 才轉來Vue 3

我要留言

立即登入留言