這一集用最新的Vite工具去創建初始檔案
為什麼用Vite?
用於創建和構建Web應用程序以下優點：
- 相對於其他工具例如Webpack和Parcel有更快的啟動時間：Vite使用預組件來提高啟動速度，這意味著您可以更快地開始構建應用程序。
- 即時熱更新：Vite可以提供即時熱更新，這意味著您可以看到對代碼所做的更改而無需刷新瀏覽器。這使開發過程更加高效和愉快。
- 小型體積：Vite的體積很小，這意味著它可以更快地下載和安裝。
- 支持多種框架：Vite支持多種前端框架，包括Vue、React和Svelte。
- 可擴展性：Vite是可擴展的，這意味著您可以使用插件來添加新功能。
- 更簡單：Vite的配置非常簡單，因此您可以立即開始使用它，而無需花費大量時間學習複雜的設置。
- 更熱：Vite具有出色的熱重載功能，這意味著您可以看到對代碼所做的更改而無需刷新瀏覽器。這使開發過程更加高效。
開始創立
- 首先在你的command line 打以下指令，去創建你想要用的技術
註: 依照你的喜好用npm or yarn 都可以
npm create vite@latest2.選擇你想要的框架和技術
- 你會看到以下檔案架構
4.啟動專案
npm run dev- 進去你的Broswer，並輸入你的port吧
- 你會看到成功畫面
接下來請看影片教學，如何整理專案以及理解裡面架構
影片教學
結論
Vite是一個功能強大和易於使用的工具，可用於創建文件。它具有快速的啟動時間、即時熱更新、小型體積、支持多種框架和可擴展性等優點。
下一集教學，教大家做應用程式安裝TailwildCSS到VIte專案裡
額外資源教學
如何用FIgma製作個人作品集教學 - https://vocus.cc/article/645c733dfd89780001ffe890
學習如何設計好產品 - 使用者經驗設計 | 易用性 | 通用設計 - https://vocus.cc/article/64637f74fd8978000175c0f8
前端教學架設TodoApp
- https://vocus.cc/article/64637f74fd8978000175c0f8
學習如何用HMTL5和CSS3，跟JayLin一起做一個NFT卡片完整課程 - https://vocus.cc/article/64637f74fd8978000175c0f8
更多相關教學文章
JayLinXR YT: https://www.youtube.com/@jaylinxr
JayLinXR IG: https://www.instagram.com/jaylin_xr/
JayLinXR FB: https://www.facebook.com/JayLinXR
