三大框架之一，用Vue快速建立自己的網站

什麼是Vue

Vue是前端開發框架。透過Vue可以讓開發者輕鬆建置網站、路由、狀態管理及http请求等。若你對這邊很陌生，沒有關係。之後的幾篇我都會逐步向大家介紹。你只要知道Vue框架解決了過去需要自己花許多時間及心力去處理的事情。 Vue讓我們把焦點放在如何打造一個能讓使用者用起來最滿意的網站。

用Vue建立第一個網站

如何透過Vue建置網站可由是否要使用建置工具(Build Tools)，分為兩種。

建置工具(Build Tools)可自動化建立整個網站所需功能的工具。

Vue官方建置工具為Vite 。在這裡Vue也提供了線上建置及本地端建置，線上建置優點就是本機不需要再額外安裝任何軟體。

直接透過StackBlitz 在線上建置Vue網頁。此外，還可以與自己的git repositary同步。

需先安裝Node.js

安裝Node.js後，透過命令列到你要想要建立網站的路徑下執行

npm init vue@latest

接著，建置過程惠詢問你是否需要一些功能，若你還不確定可以都選擇No，等到未來有需要時再加入即可。

根據提示，透過命令列執行以下指令

cd 到專案路徑
npm install
npm run dev

最後，在瀏覽器輸入 localhost:3030

透過以下兩種Html基本上都差不多，這邊主要是使用createApp去建立一個Vue的實例，並透過mount將其渲染到<div id="app">上。即可建立Hello Vue的網頁。

Demo1.html

Demo2.html

今天我們成功透過Vue框架建立了第一個網頁，並學了用3種不同的建立方式：

我個人是比較建議在Local端透過建置工具來建立網頁。下次，我們將以此網頁為基礎進行後續開發。