常見面試考題之 Vue 與 React 差異在哪裡？以及為什麼 React 比較紅？

前言

前陣子跑去別人家公司面試，面試官問了我一個問題：「Vue 與 React 差異在哪裡？以及為什麼 React 比較紅？」，我覺得這個問題算是滿常見也滿有趣的，所以就稍微寫一篇記錄一下以及說明一下我自己的看法。

Note
本人主要是 Vue 開發者，偶爾會寫一些 React 的專案，但會盡可能的客觀角度去撰寫這篇文章，如果有不對的地方，也歡迎大家指正。

Vue 與 React 差異在哪裡？

說明 Vue 跟 React 兩者差異之前，我們必須要釐清幾件事情：

1. 彼此誕生的原因以及定義
2. 他們的核心概念
3. 他們的生態系統

這三大點是我個人認為最重要的，也是可以從中說明並看清楚 React 跟 Vue 差異之處，當然我可能也會舉例一些例子來說明，讓你可以看出彼此之間的差異。

首先這邊我先直接講一個結論，不論是 React 或者是 Vue 兩者都是…

「屬於 JavaScript 的實作範疇。」

Note
實作範疇的意思是指，兩者不論是 Vue 或者 React 本身都是 JavaScript 實作出來的，因此本質上還是 JavaScript 並不會因此改變 JavaScript 的語言特性，如：變數宣告、傳參考等等。

彼此誕生的原因以及定義

基本上在 React 官方網站以及 Vue 官方網站都可以看到他們自己對於自己的定義，分別如下：

React：

Vue：

我們可以在官方網站上彼此都有說明自己的定義是什麼

• React：The library for web and native user interfaces（中文：用於 Web 與使用者介面的庫）
• Vue：The Progressive JavaScript Framework（中文：漸進式 JavaScript 框架）

我們可以看到兩者彼此是有明確的說明自己的定義分別是庫（Library）與框架（Framework），這個差異非常重要的一件事情，雖然我們時常會說 Web 已經被 React、Vue 以及 Angular 這「三大框架」給統一，但這三大框架中，出了一個幌子，那就是 React 並不是 Framework，而是一個 Library。

至於誕生的原因，我認為這部分可以觀看 Honeypot 頻道的採訪，整個已經解釋得非常清楚了。

React 紀錄片：

Vue 紀錄片：

如果不方便觀看 React 紀錄片跟 Vue 紀錄片的人，我可以直接簡單給你結論：

「都是想解決瀏覽器畫面更新的問題，希望讓網頁開發更加快速且方便維護。」

其餘的部分我就比較推薦你直接觀看紀錄片了，因為我認為紀錄片的採訪非常的精彩也能表達出彼此誕生的原因。

為什麼 React 可以被稱為三大框架之一？

那這時候就會有一個大疑問了，既然 React 是 Library，那為什麼我們會把 React 跟 Vue 以及 Angular 這些框架放在一起呢？我個人認為其原因有幾個大要點：

1. 實際開發上 React 會搭配許多套件來一起使用，例如：React DOM、React Router、Redux，這些套件的組合，就像是一個框架一樣。
2. React 雖然比 Vue 早誕生一年（React 於 2013 年誕生，Vue 則是 2014 年），但 React 的社群生態系統非常龐大，足夠讓你整體應用上可以更加快速的開發。
3. 簡化開發流程，React 確實簡化了許多複雜的開發流程，讓開發者可以更專注於開發上，如透過 React DOM 生成 HTML、透過 React Router 來做路由控制等等。

綜合上述原因，React 雖然是 Library，但實際上在開發上我們會搭配許多套件來一起使用，這些套件的組合就像是一個框架一樣，因此 React 也就理所當然的被稱為了「三大框架」之一。

Note
接下來我都會稱 React 為 Framework，這邊就不要過度文字獄了，這邊我也已經有說明清楚為什麼 React 會被稱為 Framework 了。

Framework 與 Library 差異

前面說明了 React 為什麼明明是 Library 卻可以被稱為 Framework 的原因之後，接下來我們就要來細談一下 Framework 與 Library 之間的差異到底是什麼。

Library 的概念你可以把它想像成現實世界的工具箱，裡面有釘子、鋸子、螺絲起子等等，這些工具都是獨立的，你可以自由的選擇要使用哪一個工具，也可以自由的搭配使用，這就是 Library 的概念。

而 jQuery 就是一個相當不錯的例子，jQuery 本身也是一個 Library，它提供了許多的方法讓你可以快速的開發，例如…$.ajax()、$('DOM').click()等等，所以在 React 還沒出現之前，許多的開發者都是使用 jQuery 來開發，你可以看看以前有多少的套件都是依賴著 jQuery 來開發的，例如：Owl Carousel、Fancybox、Bootstrap 5 之前的版本等等。

因此我們可以知道 Library 就僅僅只是提供工具給你使用，而你想怎麼用完全取決於你自己，所以用 jQuery 開發 SPA（Single Page Application）可不可以？當然可以，只是你需要自行去撰寫相對應的套件而已，如 React 需要搭配的是 React DOM 來渲染並生成 HTML。

Framework 的概念則是相對於 Library 來說，Framework 是一個相對完整的解決方案，它提供了一個完整的開發環境，讓你可以直接拿來使用，但是缺點就是會被限制在框架的規範之下，也就是作者的想法與範圍內，因此才會有人說 Vue 有許多額外要學習的東西，除了本身的 JavaScript 的語法要學習外，還要掌握好 Vue 的語法，如：v-for、v-if、v-model等等。

而 Framework 這一點放眼到 Angular 也是相同的，學習 Angular 你也必須要額外學習 Angular 的語法，如：*ngFor、*ngIf、*ngModel 等等，這些都跟 Vue 並無太大差別，但由於我對於 Angular 比較沒有那麼熟悉，所以不會在這邊多介紹並舉例 Angular 的部分，還是著重於 React 以及 Vue 這兩個 Library 與 Framework 的差異上。

讓我們回到比較實務的部分，以 React 來講，我們在開發 Web 網頁時，會需要引入兩個東西，分別是 React 以及 React DOM。這兩個東西就像是一個工具箱，它們分別有不同的用途。

<script src="https://unpkg.com/react@17/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@17/umd/react-dom.development.js" crossorigin></script>

React 本身提供一些基本的語法和 API，例如：React.createElement()、React.Component 等等，這些 API 用於定義和建立 React 元件，以及描述元件的行為和狀態，但是如果你單純只引入 React 而不引入 React DOM 的話，你就無法將 React 的元件渲染到 HTML 上，因為 React 只關注於 UI 的構建與狀態管理等，React 並不關注渲染的部分。

因此，如果要將 React 元件渲染到 HTML 上，就需要引入 React DOM 這個工具，React DOM 提供了一些方法，例如 ReactDOM.render()，這些方法將 React 元件轉換為瀏覽器可以理解並顯示的 HTML 元素，因此 React DOM 是將 React 元件渲染到 HTML 上的重要橋樑，這也是為什麼我們在開發 React 時，會同時引入 React 以及 React DOM 的原因。

React DOM 在設計上的概念就是採用我們常在講的 Virtual DOM（虛擬 DOM），這個概念是我們 React 開發者必定會接觸的一個領域，簡單來講 Virtual DOM 會將 React 元件轉換為一個 JavaScript 物件，這個物件會描述 React 元件的結構和屬性，但這一塊就不是我們要探討的部分，所以就先不談 Virtual DOM 這塊了。

那 Vue 呢？相信 Vue 開發者在開發時，就會發現只需要引入一個 Vue CDN 而已

<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>

這部分是因為 Vue 本身就已經將 HTML 的渲染部分給包裝在裡面了，這部分也非常符合 Framework 的概念，因為人家都幫你準備好了，你不需要特別搭配什麼就可以馬上且快速的開發一個網頁。

Note
其餘 Router 等這類套件先不談，因為這些算是 Single Page Application （SPA）開發的部分，兩者都是依據需求來決定要不要引入，而實戰上兩者都是會搭配 Router 來使用的。

因此簡單來講，Framework 優點是快速開發，但缺點就是會被限制在框架的規範之下，而 Library 則是提供工具給你使用，你可以自由的選擇要使用哪一個工具，也可以自由的搭配使用，這就是 Library 與 Framework 的差異。

彼此初衷與理念

接下來我會來簡單快速聊一下 React 以及 Vue 的初衷與理念，這部分我會盡量簡單的說明，不會過度深入探討，因為這部分是一個很大的主題，我們只需要知道 React 與 Vue 的初衷與理念是什麼，這樣就可以了，畢竟滿多更細的細節都有在紀錄片上說明過了。

React

React 最早是由 Facebook 團隊中的 Jordan Walke 所開發，而 Jordan 當時的出發點是為了解決 UI 的畫面更新與維護的問題。

眾所皆知 Facebook 是一個大型社交網站，隨著使用者越來越多，UI 畫面複雜度當然水漲船高，而這部分也會導致開發上的一些問題慢慢浮現，如：難以維護、難以擴展等等問題，畢竟一個大型網站，不可能只有一個人來開發，而是需要透過一群人共同合作來開發，難道 Facebook 內部沒有自己的框架嗎？當然有，是由兩名軟體工程師創建的框架，名字叫做 Bolt.js 框架。

這個框架是基於 MVC（Model-View-Controller）架構來開發的，以當時的軟體架構模式來說，這並沒有任何問題，但是框架的問題如同前面所言，框架好處在於可以讓開發者快速開發，但是壞處在於框架的規範性較強，這樣就會導致開發者在開發上會有一些限制，而這些限制就會導致開發上的困難，因此 Jordan Walke 才會開始思考，如何能夠解決這個問題。

Note
Facebook 後來成立了一間母公司叫做 Meta Platforms，因此 Facebook 算是早期的公司名稱。

因此考慮到系統的可維護性、可擴展性，Jordan Walke 以 Functional programming 的程式設計規範概念開發了一套 FBolt（Functional Bolt）來解決這個問題，而這個 FBolt 就是 React 的前身。

這邊我就不過度深入探討何謂 Functional programming，因為這部分是一個很大的主題，我們只需要知道 React 是基於 Functional programming 的程式設計規範概念來開發的，這樣就可以了，如果你真的很好奇，我推薦你可以看看我先前撰寫的「簡單趣談 Functional Programming in JavaScript、簡單趣談 Functional Programming in JavaScript 之 Currying」，這兩篇文章我有稍微介紹一下 Functional programming 的概念。

拉回到原本主題上，React 的初衷是為了解決 UI 的畫面更新與維護上的問題而誕生的。

Note
React 剛推出時，並沒有那麼順利，畢竟違反了當時的主流開發軟體架構模式，因此當時的開發者對於 React 的接受度並不高，但是隨著 React 的不斷演進，以及社群的支持，React 逐漸的被接受並且成為了當今前端開發的主流框架之一。

那麼 React 真正被使用是在 Facebook 收購 Instagram 之後才開始的，畢竟當時的 Instagram 僅有 Android 以及 iOS 兩個版本，並沒有 Web 版本，所以收購之後 Facebook 就決定以 React 來開發 Instagram 的 Web 版本，這也是 React 真正被使用的開始。

當然 React 的背後功臣非常多，畢竟 React 打破了當時的開發思維，如果沒有相關的人員來支持，React 也不會成為當今前端開發的主流框架。

Vue

接下來我們來聊聊 Vue 的部分，Vue 的開發者是由一位叫做 Evan You（尤雨溪）的人所開發的，在 Vue 還沒誕生之前，他在網頁上還原出了 Clear APP 的複製版（Clear 是一款 TodoList APP），因此被邀請進了 Google 的實驗團隊（連投遞履歷都沒有，就被電話通知）。

當時 Evan You 在 Google 所使用的第一個框架是 Backbone.js，Backbone.js 也是基於 MVC 架構來開發的，但是 Evan You 認為 Backbone.js 的開發方式並沒有辦法提高並解決他當時被分配到的任務，所以他就開始思考該如何提高自己的開發效率以及解決任務。

然後又參考並借鏡了 Angular 的部分，但 Angular 畢竟也是一個框架，如同前面所言，框架會有一些限制存在，並沒有辦法解決 Evan You 的問題，所以 Evan You 決定創造出一個新的「工具」來解決他開發上的困擾，所以我們可以注意並發現到一件事情，最早 Vue 並不是一個 Framework，而是 Library，是隨著 Vue 的不斷演進，才變成了 Framework 的。

Note
Vue 最早叫做 Seed.js，但 Seed.js 早就被使用，所以 Evan You 以 View 這個單字為基底，丟到 Google 翻譯找到了法語的翻譯 Vue 這個單字，因此就改名為 Vue。

所以 Vue 本身的誕生一開始只是為了解決 Evan You 自己的開發效率問題，他希望事情可以盡可能簡單一點、盡可能的提高開發效率，從沒想過這東西會成為目前前端開發的主流框架之一。

所以我們可以知道 Vue 的初衷是為了解決開發上的困擾，並提高開發效率，減少開發上的困難。

Vue 也跟 React 一樣最初並沒有被看好，畢竟當時只有一個人在開源維護 Vue，對於一個專案來說，這是非常危險的，如果這位開發者突然發生了什麼事情，那麼 Vue 就會淪落到無人維護的地步，但是直到後來 Laravel（PHP MVC 框架） 的作者 Taylor Otwell 剛好正在尋找一個前端框架/庫搭配 Laravel 使用。

那麼 Taylor Otwell 沒有找過並嘗試過 React 嗎？不，其實有，只是對於一個不是專注於 JavaScript 的開發者來講，React 的學習曲線是相對較高的，React 對於 JavaScript 的掌握度要求是相對比較高的，並且設計模式是採用 Functional programming 的程式設計規範概念，這對於一個不是專注於 JavaScript 的開發者來講，是一個相對較大的挑戰。

所以 Taylor Otwell 就找到了 Vue，對於一個沒有那麼熟悉 JavaScript 的開發者來講，Vue 的學習曲線確實比較低，只需要掌握一些基本的 JavaScript 語法並學習 Vue 的語法，就可以開始開發了，這也是 Vue 被 Laravel 的作者 Taylor Otwell 所接受的原因，也因此 Vue 開始被社群所關注並且支持，逐漸的成為了當今前端開發的主流框架之一。

為什麼 React 比較紅？

接下來我要來聊一下為什麼 React 比較紅這件事情，其實這件事情滿具有一定爭議的，而且我本身是 Vue 開發者，但同時也有在撰寫 React 的專案，所以我會盡可能的客觀一點去分享這個議題，如果有不對的地方，也歡迎大家指正。

社群生態系統

首先以生態系來講 React 的生態系確實是比 Vue 還要龐大，畢竟 React 本身就是屬於一個 Library，只需要搭配好相對應的套件，就可以實作出一個應用程式，例如：React + React DOM 就可以實作一個簡單的 Web 應用程式，搭配 React Native 則可以開發出一個雙平台（Android、iOS）的應用程式。

而 Vue 是一個框架的關係，所以預設就被綁定於 Web 開發上，當然 Vue 也有 Vue Native 這個專案，但 Vue Native 終究是將 Vue 的語法轉換為 React Native 的語法，因此 Vue Native 並不是一個獨立的專案，而是一個轉換器（當然還是有其他方式可以解決，但這就不細談了）。

Note
Vue Native 已經被官方停止維護，目前有另一套叫做 NativeScript 可以使用，或是乾脆一點改用 Flutter 語言（由 Google 所推出的跨平台開發語言，支援：Android、iOS、Windows、macOS 等系統）也是可以的。

除此之外，我也透過 API 去撈出了跟 React 以及 Vue 相關的套件數量，結果如下：

社群生態系的龐大也是我們開發者會考量並使用的一個重要因素，畢竟社群生態系的龐大代表著當你遇到問題時，或者需要某些功能時，你可以透過社群的支持來解決，這也是為什麼 React 比較紅的原因之一。

這一段結果是我透過 npm API 去撈出的，好奇的人也可以自己試試看：

// app.js
const searchNpmPackages = async (keyword) => {
  const response = await fetch(`https://api.npms.io/v2/search?q=${keyword}`);
  const data = await response.json();
  return data.total;
};

searchNpmPackages('react')
  .then((total) => {
    console.log(`Total React-related packages: ${total}`);
  });

searchNpmPackages('vue')
  .then((total) => {
    console.log(`Total Vue-related packages: ${total}`);
  });

學習曲線

學習曲線方面，其實稍微有一點主觀，如果你是專注於 JavaScript 的開發者來講，你會認為 React 格外比較親切，為什麼呢？因為整體寫起來就是 JavaScript，你只需要掌握好些許的 React 語法，就可以開始開發了，這對於一個專注於 JavaScript 的開發者來講，是一個相對較低的學習曲線。

這邊就讓我來舉例 React 的程式碼：

function App (){
  const [count, setCount] = React.useState(0);
  
  function sayHi () {
    window.alert('Hello Ray.');
  }

  function handleClick() {
    setCount((prevState) => prevState += 1)
  }

  return (
    <div>
      <button type="button" onClick={ handleClick }>
        Count is: { count }
      </button>
      <hr />
      <button type="button" onClick={ sayHi }>打招呼</button>
    </div>
  )
}

const app = document.querySelector('#app');
const root = ReactDOM.createRoot(app);
root.render(<App />);

透過上面的舉例，我們可以明確看出真的就是整體很 JavaScript，但是如果相同程式碼轉換成 Vue 的話，會是這樣：

<div id="app">
  <button type="button" @click="count++">
    Count is: {{ count }}
  </button>
  <hr/> 
  <button type="button" @click="sayHi">打招呼</button>
</div>

const { createApp, ref } = Vue;

const app = createApp({
  setup() {
    const count = ref(0);
    
    const sayHi = () => {
      window.alert('Hello Ray.');
    };
    
    return {
      count,
      sayHi
    }
  },
});

app.mount('#app');

這兩個範例其實差異並不明顯，所以這邊我在舉例一個案例，以 Vue 來講，你還必須額外學習除了 JavaScript 之外的知識，例如…v-if、v-for、v-model 等等，這些都是 Vue 的語法糖。

底下就讓我們來看一下比較實戰面的 Vue 程式碼：

<!-- App.vue -->
<template>
  <div id="app">
    <input type="text" v-model="message">
    <p>Message is: {{ message }}</p>
    <button @click="reverseMessage">Reverse Message</button>
    <hr />
    <div v-if="show">Now you see me</div>
    <div v-else>Now you don't</div>
    <button @click="show = !show">Toggle Show</button>
    <hr />
    <ul>
      <li v-for="todo in todos" :key="todo.id">{{ todo.text }}</li>
    </ul>
  </div>
</template>

<script setup>
  import { ref, reactive } from 'vue';

  const message = ref('Hello Vue!');
  const show = ref(true);
 
  const todos = reactive([
    { id: 1, text: 'Learn JavaScript' },
    { id: 2, text: 'Learn Vue' },
    { id: 3, text: 'Build something awesome' }
  ]);

  const reverseMessage = () => {
    message.value = message.value.split('').reverse().join('');
  };
</script>

<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>

接著我們可以來看一下，當上面的 Vue 程式碼變成了 React 程式碼時，會長什麼樣子：

<div id="app"></div>

function App() {
  const [message, setMessage] = React.useState('Hello React!');
  const [show, setShow] = React.useState(true);
  const [todos, setTodos] = React.useState([
    { id: 1, text: 'Learn JavaScript' },
    { id: 2, text: 'Learn React' },
    { id: 3, text: 'Build something awesome' }
  ]);

  const reverseMessage = () => {
    setMessage((prevMessage) => prevMessage.split('').reverse().join(''));
  };

  return (
    <div id="app">
      <input type="text" value={message} onChange={(e) => setMessage(e.target.value)} />
      <p>Message is: {message}</p>
      <button type="button" onClick={reverseMessage}>Reverse Message</button>
      <hr />
      {show ? <div>Now you see me</div> : <div>Now you don't</div>}
      <button type="button" onClick={() => setShow((prevShow) => !prevShow)}>Toggle Show</button>
      <hr />
      <ul>
        {todos.map((todo) => (
          <li key={todo.id}>{todo.text}</li>
        ))}
      </ul>
    </div>
  );
}

const app = document.querySelector('#app');
const root = ReactDOM.createRoot(app);
root.render(<App />);

透過上面的範例比較，我相信你可以更看得出為什麼對於專注於 JavaScript 的開發者來講 React 會感受上比較親民，畢竟整體就很 JavaScript 沒錯，但是對於 Vue 來講，你還必須要學習 Vue 的語法糖，其中最明顯差異就是 Vue 跑列表時是使用 v-for，而 React 則是使用 JavaScript 的 Array.prototype.map() 語法。

這也是為什麼有些開發者會戲稱 Vue 許多黑魔法，如果沒有往底層去挖你可能會不清楚 v-for 是怎麼運作的，但是 React 就不會有這個問題，因為 React 就是 JavaScript。

Note
React 主要會使用 JSX 來撰寫 HTML，JSX 是 React 的一個語法糖，它允許你在 JavaScript 中撰寫 HTML，這樣可以讓你的程式碼更加直觀並且易於閱讀。

除錯較易

由於 React 本身是一個 Library，所以在除錯上確實「可能」會比 Vue 容易除錯，畢竟 React 本身就是 JavaScript，所以不會有過多的 API 封裝，但由於 Vue 本身是一個框架，所以提供了相當大量的語法糖語法，當這些語法糖語法出現問題時，你可能會需要花一些時間去了解這些語法糖語法是怎麼運作的。

假設你今天渲染列表使用 v-for 不如預期，或者是 v-if 條件判斷不如預期，這時候你就需要花一些時間去了解這些語法糖語法是怎麼運作的，並且去翻閱 Vue 的官方文件或者是 Vue 原始碼才有辦法解決，但 React 的話，在渲染上則是使用 JavaScript 的 Array.prototype.map() 語法以及條件判斷，這些都是 JavaScript 的基本語法，所以在除錯上確實會比 Vue 容易一些。

刻板印象

之前請 2~3 個旅美的朋友，請他們詢問一下身邊的工程師朋友，他們對於 Vue 的看法，他們大多都是知道 Vue 的存在，但是對於使用卻會猶豫，其原因在於創始人是華人的關係，這樣的刻板印象讓他們對於 Vue 會有一些疑慮，因此在技術選型時，他們會比較偏向選擇 React，儘管 Vue 是由所開源社群維護。

Note
這部分是我個人的觀察，並不代表所有人都是這樣，還是有不少國外的人喜歡 Vue 給予的開發體驗。

背後支持

如同前面所言，React 的背後是由 Facebook 所支持，Angular 則是 Google，但 Vue 則是完全不受限於任何公司，而是完全由社群來維護，對於一個某些公司來講，可能會擔心 Vue 的未來發展，又或者 Vue 會不會突然停止維護等，這些都非常依賴開源社群的支持，儘管 React 也是開源專案，但他們背後還是有 Facebook 這個大公司在支持。

但對於 Vue 來講，完全由社群維護與支持也是一個優勢，因為不受限於任何公司，所以 Vue 的發展方向完全由開源社群來決定，因此 Vue 可以很容易地去吸取社群的意見，並參考其他框架的優點並引入到 Vue 中，所以 Vue 真正厲害的地方在於它的開源社群以及開發者們的支持，並不會有任何公司的限制或者是干涉。

結論

其實透過前面的介紹，不論是使用 React 或者是 Vue，他們都有各自當初被創造出來的初衷，React 是為了解決 UI 的畫面更新與維護上的問題，而 Vue 則是為了解決開發上的困擾，並提高開發效率，減少開發上的困難。

以我自己教學經驗來講，純粹的小白在使用 Vue 時，開發體驗以及成就感確實是比較高的，畢竟僅需要熟悉 Vue 的幾個語法糖以及基本的 JavaScript 語法你就可以快速建立出一個 Web 應用程式，但是 React 則不同，你需要注意的細節非常多，例如…記憶體管理、畫面渲染等等，這些都必須要由開發者自行決定，與 Vue 非常不同，畢竟這些事情 Vue 都已經幫你搞定了。

Note
「小白」意指完全沒有程式相關經驗的人。

我認為 React 跟 Vue 的價值好壞並不是開發者可以決定的，每一位開發者都可以擁護自己所喜好的語言、框架以及庫，畢竟這是一個很主觀的問題，真正有權利評斷這東西的好壞源自於業界，能夠替業界解決問題、快速開發以及提高效率，這才是最重要的。

Vue 能夠並列三大框架之一，代表 Vue 有確實解決了業界的問題，所以才有這個資格被稱為三大框架之一，而 React 也是一樣，React 能夠被廣泛使用，代表 React 也確實解決了業界的問題，所以才有這個資格被廣泛使用。

我見過不少專案一開始都是使用 Vue 來快速開發，接著後期慢慢重構成 React 的也有，當然也有反過來的，從 React 轉向到 Vue 的也有，所以我認為技術並沒有對錯，只有適不適合。

如果是以一個新創公司，需要 MVP 快速上線搶市場，我自己觀點認為確實是比較偏向選擇 Vue，畢竟 Framework 優勢在於快速開發，人家都幫你準備好了，你只需要按照規範來開發就可以了，就算是大型專案也是可以的，並不代表使用 Vue 就代表著遲早會被抓去寫後端或者就不會有前途。

不論是寫哪一個 Vue 或者 React 你會發現彼此都有相識的地方，例如：生命週期、狀態管理等等，這些都是前端開發者必須要掌握的，所以我認為比起思考選擇 Vue 或者是 React，你更應該去花時間打穩 JavaScript 的基礎，因為…

「都是 JavaScript 實作的範疇」

這才是真正核心應該要去思考的問題，對於我們前端開發者來講，這些東西都只是工具而已，最重要的還是你的邏輯思考能力、JavaScript 扎實度以及解決問題的能力，或許哪一天 Vue 或 React 會被淘汰，但身為 Web 的基石之一的 JavaScript 至少在短期內是不會被淘汰的。

Note
語言也是有可能被淘汰，所以我這邊才會說「至少在短期內是不會被淘汰的」。