前端轉職經驗談

[前端自學轉職攻略] 17. 前端框架怎麼選？

發佈於前端攻略指南

2024/09/06 更新2024/08/17 發佈閱讀 1 分鐘

React 跟 Vue 二擇一，然後重構 side project

與其每個都只會一點，不如專精一個

雖然不同的框架在 API 和設計理念上可能存在差異，但仍有很多知識是共通的。一個框架要熟練，需要通過實做各種不同的功能後，才能深入理解。因此，建議先把時間和精力集中學習單一個框架。

選哪個框架好？

如果已經有找工作的方向，可以看目標職缺多數用哪個框架。如果還是沒有想法，建議：

覺得 JavaScript 學起來很辛苦：Vue
覺得 JavaScript 學起來得心應手：React

2023.stateofjs.com

2023.stateofjs.com

重構 side project

使用框架來重構 side project，從實作中學習，並體驗前端框架與原生 JavaScript 開發效率上的差異。

從原生 JavaScript 轉向前端框架時，思考方式需要稍微轉換一下，主流前端框架都提供很完善的官方文件，不同於學習 JavaScript，這邊會建議先把文件看過一遍，了解主要的使用方式後，再開始重構。

使用前端框架時，應儘量避免直接操作 DOM 元素，不要把 JavaScript 的作法原封不動的套入使用。

#前端工程師

#跨領域轉職

#轉職工程師

前端轉職經驗談前端攻略指南

留言

前端轉職經驗談

5會員

41內容數

零基礎到成功轉職，一路上會遇到哪些挑戰、應該如何解決？ - 猶豫階段：「這適合我嗎？薪水如何？...」 - 起步階段：「怎麼開始學？要不要做 side project？...」 - 成長階段：「如何優化開發效率？選擇框架？...」 - 面試階段：「怎麼準備技術和行為面試？...」

前端轉職經驗談的其他內容

2025/03/09

如何找 side project 點子

原文：HOW TO GET STARTUP IDEAS 原文是針對如何找出創業的題目，不過如果想做 side project 卻苦無想法的話，也可以參考看看。獲得創業點子的方法不是刻意去想創業點子，而是尋找問題，最好是你自己面臨的問題。最優秀的創業點子通常具有三個共同點：這是創辦

2025/03/09

如何找 side project 點子

原文：HOW TO GET STARTUP IDEAS 原文是針對如何找出創業的題目，不過如果想做 side project 卻苦無想法的話，也可以參考看看。獲得創業點子的方法不是刻意去想創業點子，而是尋找問題，最好是你自己面臨的問題。最優秀的創業點子通常具有三個共同點：這是創辦

2025/02/02

JavaScript 入門實戰：適合初學者的10 個基礎練習

學習 JavaScript 時，理解語法和概念是一回事，實際應用又是另一回事。許多初學者會遇到「看得懂範例，但自己寫不出來」的困境。因此，本文從實際開發的常見情境中，簡化出了 10 個範例，讓你能夠逐步練習，慢慢熟悉寫程式的思考方式。

2025/02/02

JavaScript 入門實戰：適合初學者的10 個基礎練習

學習 JavaScript 時，理解語法和概念是一回事，實際應用又是另一回事。許多初學者會遇到「看得懂範例，但自己寫不出來」的困境。因此，本文從實際開發的常見情境中，簡化出了 10 個範例，讓你能夠逐步練習，慢慢熟悉寫程式的思考方式。

2025/01/30

State of JS 2024：前端開發者的年度技能檢測指南

每年一次的 State of JS 問卷調查，不只是觀察前端技術趨勢的工具，更是檢視自身技能與學習方向的絕佳機會。透過這份調查，你可以了解前端生態的變化，確保自己沒有錯過重要資訊，並規劃未來的學習路線。

2025/01/30

State of JS 2024：前端開發者的年度技能檢測指南

每年一次的 State of JS 問卷調查，不只是觀察前端技術趨勢的工具，更是檢視自身技能與學習方向的絕佳機會。透過這份調查，你可以了解前端生態的變化，確保自己沒有錯過重要資訊，並規劃未來的學習路線。

你可能也想看

釀電影，啜一口電影的美好。

《傳奇：帕拉贊諾夫的十段殘篇》：以流亡書寫帕拉贊諾夫的政治寓言

賽勒布倫尼科夫以流亡處境回望蘇聯電影導演帕拉贊諾夫的舞台作品，以十段寓言式殘篇，重新拼貼記憶、暴力與美學，並將審查、政治犯、戰爭陰影與「形式即政治」的劇場傳統推到台前。本文聚焦於《傳奇：帕拉贊諾夫的十段殘篇》的舞台美術、音樂與多重扮演策略，嘗試解析極權底下不可言說之事，將如何成為可被觀看的公共發聲。

#釀電影#釀評論#藝術評論

2026/01/14

釀電影，啜一口電影的美好。

《傳奇：帕拉贊諾夫的十段殘篇》：以流亡書寫帕拉贊諾夫的政治寓言

賽勒布倫尼科夫以流亡處境回望蘇聯電影導演帕拉贊諾夫的舞台作品，以十段寓言式殘篇，重新拼貼記憶、暴力與美學，並將審查、政治犯、戰爭陰影與「形式即政治」的劇場傳統推到台前。本文聚焦於《傳奇：帕拉贊諾夫的十段殘篇》的舞台美術、音樂與多重扮演策略，嘗試解析極權底下不可言說之事，將如何成為可被觀看的公共發聲。

#釀電影#釀評論#藝術評論

2026/01/14

趙鐸的沙龍

柏林劇團《三便士歌劇》：善讓人嚮往，惡卻更加迷人──布萊希特的疏離與慾望

柏林劇團在 2026 北藝嚴選，再次帶來由布萊希特改編的經典劇目《三便士歌劇》（The Threepenny Opera），導演巴里・柯斯基以舞台結構與舞台調度，重新向「疏離」進行提問。本文將從觀眾慾望作為戲劇內核，藉由沉浸與疏離的辯證，解析此作如何再次照見觀眾自身的位置。

#2026北藝嚴選#臺北表演藝術中心#北藝嚴選

2026/01/14

趙鐸的沙龍

柏林劇團《三便士歌劇》：善讓人嚮往，惡卻更加迷人──布萊希特的疏離與慾望

柏林劇團在 2026 北藝嚴選，再次帶來由布萊希特改編的經典劇目《三便士歌劇》（The Threepenny Opera），導演巴里・柯斯基以舞台結構與舞台調度，重新向「疏離」進行提問。本文將從觀眾慾望作為戲劇內核，藉由沉浸與疏離的辯證，解析此作如何再次照見觀眾自身的位置。

#2026北藝嚴選#臺北表演藝術中心#北藝嚴選

2026/01/14

花神沒有咖啡館的沙龍

《海妲．蓋柏樂》：晃晃跨幅町直球對決經典，解構現代女性的困頓與慾望

本文深入解析臺灣劇團「晃晃跨幅町」對易卜生經典劇作《海妲．蓋柏樂》的詮釋，從劇本歷史、聲響與舞臺設計，到演員的主體創作方法，探討此版本如何讓經典劇作在當代劇場語境下煥發新生，滿足現代觀眾的觀看慾望。

#2026北藝嚴選#北藝嚴選#臺北表演藝術中心

2026/01/14

花神沒有咖啡館的沙龍

《海妲．蓋柏樂》：晃晃跨幅町直球對決經典，解構現代女性的困頓與慾望

本文深入解析臺灣劇團「晃晃跨幅町」對易卜生經典劇作《海妲．蓋柏樂》的詮釋，從劇本歷史、聲響與舞臺設計，到演員的主體創作方法，探討此版本如何讓經典劇作在當代劇場語境下煥發新生，滿足現代觀眾的觀看慾望。

#2026北藝嚴選#北藝嚴選#臺北表演藝術中心

2026/01/14

涵柳的沙龍

《轉轉生 Re:INCARNATION》：從身體與服裝看見奈及利亞的重生

《轉轉生》為奈及利亞編舞家庫德斯．奧尼奎庫與 Q 舞團創作的當代舞蹈作品，融合舞蹈、音樂、時尚和視覺藝術，透過身體、服裝與群舞結構，回應殖民歷史、城市經驗與祖靈記憶的交錯。本文將從服裝設計、身體語彙與「輪迴」的「誕生—死亡—重生」結構出發，分析《轉轉生》如何以當代目光，形塑去殖民視角的奈及利亞歷史。

#2026北藝嚴選#北藝嚴選#臺北表演藝術中心

2026/01/14

涵柳的沙龍

《轉轉生 Re:INCARNATION》：從身體與服裝看見奈及利亞的重生

《轉轉生》為奈及利亞編舞家庫德斯．奧尼奎庫與 Q 舞團創作的當代舞蹈作品，融合舞蹈、音樂、時尚和視覺藝術，透過身體、服裝與群舞結構，回應殖民歷史、城市經驗與祖靈記憶的交錯。本文將從服裝設計、身體語彙與「輪迴」的「誕生—死亡—重生」結構出發，分析《轉轉生》如何以當代目光，形塑去殖民視角的奈及利亞歷史。

#2026北藝嚴選#北藝嚴選#臺北表演藝術中心

2026/01/14

Web開發日誌

簡單聊聊，我為什麼又多下載react跟tailwind使用

先從react開始：其實市面上有許多前端框架像是react,angular,vue... 至於為什麼我會選擇react…

#程式#React#TailwindCSS

2024/07/09

Web開發日誌

簡單聊聊，我為什麼又多下載react跟tailwind使用

先從react開始：其實市面上有許多前端框架像是react,angular,vue... 至於為什麼我會選擇react…

#程式#React#TailwindCSS

2024/07/09

2023 Vue直播班筆記 - 自訂義指令 directive

平常我們在 html 上常看到的例如 v-for、v-model 等等... 也是VUE已經幫我們定義好的指令，而這次我們可以依這自己的需求來建立。此功能屬於較進階的功能，因此實戰中會比較少見，市面上還是有不少完善的套件能達到同樣效果，建議可以先往這方面察找

#六角學院#學習#Vue

2024/06/04

2023 Vue直播班筆記 - 自訂義指令 directive

平常我們在 html 上常看到的例如 v-for、v-model 等等... 也是VUE已經幫我們定義好的指令，而這次我們可以依這自己的需求來建立。此功能屬於較進階的功能，因此實戰中會比較少見，市面上還是有不少完善的套件能達到同樣效果，建議可以先往這方面察找

#六角學院#學習#Vue

2024/06/04

小黑與程式的邂逅

[Java Script]Vue.js

Vue.js是一種基於MVVM的前端JavaScript框架，類似的框架有React、Angular等。架設環境安裝Visual Studio Code(https://code.visualstudio.com/) 安裝Node.js(https://nodejs.org/en/

#JavaScript#VisualStudioCode#VueCLI

2024/05/29

小黑與程式的邂逅

[Java Script]Vue.js

Vue.js是一種基於MVVM的前端JavaScript框架，類似的框架有React、Angular等。架設環境安裝Visual Studio Code(https://code.visualstudio.com/) 安裝Node.js(https://nodejs.org/en/

#JavaScript#VisualStudioCode#VueCLI

2024/05/29

s_SoNg的沙龍

React ViewRerender架構

在程式任何地方都能修改各種react組件狀態的做法分享

2024/05/28

s_SoNg的沙龍

React ViewRerender架構

在程式任何地方都能修改各種react組件狀態的做法分享

2024/05/28

軟體設計模式 | 模板模式 : 以Vue.js為例

樣板模式的定義極為簡單，卻是大型系統程式、WEB/APP應用框架的設計核心，完美展現設計模式的價值: 簡單、高效、強大。

#應用程式#測試#Android

2024/05/28

軟體設計模式 | 模板模式 : 以Vue.js為例

樣板模式的定義極為簡單，卻是大型系統程式、WEB/APP應用框架的設計核心，完美展現設計模式的價值: 簡單、高效、強大。

#應用程式#測試#Android

2024/05/28

2023 Vue直播班筆記 - Vue Router及具名視圖

Vue Router 及具名視圖，擺脫以往切換依賴 CSS display:none 跟 display:block 互相配合，有時還得搭配 z-index 來調整層級跟 opacity 透明度的麻煩，而 Vue Router 完美的解決了這棘手的問題，且能客製頁面想要呈現的擺飾。

#六角學院#Vue#前端

2024/05/17

2023 Vue直播班筆記 - Vue Router及具名視圖

Vue Router 及具名視圖，擺脫以往切換依賴 CSS display:none 跟 display:block 互相配合，有時還得搭配 z-index 來調整層級跟 opacity 透明度的麻煩，而 Vue Router 完美的解決了這棘手的問題，且能客製頁面想要呈現的擺飾。

#六角學院#Vue#前端

2024/05/17

後端開發環境好難架，初學資料庫到底需要了解哪些東西?

軟體系統的發展歷程大多相似，首重解決基本需求、提供操作介面，進而提升安全性、擴充功能、優化操作。

#資料庫#PostgreSQL#MySQL

2024/04/24

後端開發環境好難架，初學資料庫到底需要了解哪些東西?

軟體系統的發展歷程大多相似，首重解決基本需求、提供操作介面，進而提升安全性、擴充功能、優化操作。

#資料庫#PostgreSQL#MySQL

2024/04/24

咖啡因學習教室

2024 網頁x人因xDjango 實務課程 02 前後端概念

當我剛開始接觸這個領域的時候，經常會看到有人在討論：到底要做前端還是後端工程師呢？後端工程師賺的比前端工程師多？前端工程師轉後端工程師？那前端與後端到底是什麼呢？這篇文章提供了前端與後端的基本概念並舉例來說明。同時也介紹了前端的三大要素以及後端的運作原理，對於想深入瞭解前後端的讀者會非常有幫助。

#網頁#文章#伺服器

2024/02/29

咖啡因學習教室

2024 網頁x人因xDjango 實務課程 02 前後端概念

當我剛開始接觸這個領域的時候，經常會看到有人在討論：到底要做前端還是後端工程師呢？後端工程師賺的比前端工程師多？前端工程師轉後端工程師？那前端與後端到底是什麼呢？這篇文章提供了前端與後端的基本概念並舉例來說明。同時也介紹了前端的三大要素以及後端的運作原理，對於想深入瞭解前後端的讀者會非常有幫助。

#網頁#文章#伺服器

2024/02/29

追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News