# 前言 幾篇文章下來，我們已經建立「暫存區」、「儲存庫」的觀念，同時學習到幾個重要的指令： git add git commit 這兩個行為如同添加商品到購物車，然後結帳的動作。 用一個「激問句」來開啟這篇文章的主題： 你會在不查看購物車有什麼商品的狀況下，就直接點結帳嗎？ # 查看 Git 目前的狀態 查看狀態的指令，是指令派的使用者「必學」的指令。 在執行 git add 後，與執行 git commit 前，終端機畫面其實不會告訴我們目前哪些資料是在暫存區，Git 於是提供一個指令讓我們可以查詢： git status我們在一個「空資料夾」執行 git init...

# 前言 你可能會疑惑，我們還沒接觸元件，為什麼現在在講元件的生命週期 事實上，一個 Vue 實體，就是一個元件，所以我們只要開始使用 Vue 之後，就必須跟元件的生命週期打交道了。 # 元件的生命週期 之前應該有說明過「元件」是啥東東了，現在又出現了看起來很困難的詞彙：生命週期。 人的生老病死，月的陰晴圓缺，這種生命週期相信大家應該都能體會。 沒辦法理解的地方大概是，「程式」的生命週期是什麼東西… 事實上就跟你我理解的生命週期一樣，Vue...

# 前言 今天的主題是最近跟一個朋友討論 Git 時，他提出跟我所理解的 Commit 不同的觀點，筆者認為很有意思。 原本打算把這個議題紀錄在上一篇文章的「常見問題」，不過內容打完之後，發現 廢話太多 內容太長，想要刪減內容卻發現無法一言以蔽之，決定還是獨立成一篇文章。 絕對沒有要水一天的意思！！ 先說這個問題的答案：因人而異、因專案而異。 # 每個 commit 都應該是一個完成品才對吧？ 朋友提出了一般聽到發佈「版本」、發佈「新版」時會意識到的事情，這個用詞大多是會出現於「已經可以使用的產物」上。 例如： 工程師寫好的第一版程式 Windows 發佈的安全性版本 蘋果發佈了新版的...

# 前言 標題又出現了一個看起來很難懂的專有名詞：狀態。 這篇文章來聊聊 Vue 的「狀態」是什麼意思。 在開始說狀態之前，先簡單說一下 setup() 生命週期鉤子。 # setup() 再把那個最初的範例請出來 Vue.createApp({ setup() { const message = '一段文字' return { message } },}).mount("#app");還記得之前把 createApp...

# 前言 歷經那麼多天的廢話，終於可以進入重頭戲，來學習怎麼發布一個版本吧！ 記得在建立 Git 儲存庫的文章中有提到，如果要發布一個版本，會歷經把檔案放到 暫存區，再把 暫存區 的檔案提交到 儲存庫 兩個階段。 言下之意，我們會使用「兩個」指令來提交一個版本。 老樣子，指令介紹完再說明 Fork GUI 操作。 給立志成為指令派的讀者：在 Fork GUI 最後有補充一個指令細節，建議也可以讀一下 Fork 的部分。 # 提交一個版本 # 第一步：將檔案加到暫存區 初始化儲存庫 ( git init ) 之後，即便已經有了地端儲存庫 ( .git )，Git...

# Vue 的核心 這個主題寫在這篇其實有點「晚」了 不過也因為寫在這篇，相信有追完前面幾篇的讀者，已經能體會 Vue 有多「漸進」了。 之前有提到，尤大大當初只是想使用「一部分」框架的功能，卻要引入「整個」框架，覺得很麻煩。 於是在設計 Vue 的時候，讓大家可以做到「小專案引入核心功能」，如果有需要再引入更多功能，後面帶到「路由 (Routing)」、「狀態管理器 (Pinia)」就是個例子。 而上段提到 Vue 的核心功能，其實大家已經認識了： 「宣告式渲染」、「元件系統」。 # Vue 實體 我們再把那個一直用到的例子搬出來看： 如果你想線上玩，我放這裡 <div...

# 前言 這篇文章要來說明「建立儲存庫」的操作，讓大家對 地端儲存庫 與 遠端儲存庫 有更進一步的認識。 以「基特平台」例子來說，建立儲存庫的概念，就是要在商家的銷售網站上面「建立帳號」，帳號存有專屬於這個商家的「購物車」跟「已購買清單」。 換言之，我們準備來對「工作目錄」動手腳，讓 Git 在這個資料夾內建立「暫存區」跟「儲存庫」。 本文的目的只有一個，學會 git init 這個指令的用意。然後就沒有然後了 # 建立本地的儲存庫 建立本地儲存庫，具體來說是要在「工作目錄」建立 .git 隱藏資料夾。 接下來會分別說明 指令 與 Fork GUI 的操作方式。 GUI 派的讀者可以直接跳到...

歷經了前面幾篇文章，讀者大概已經對框架有最基本的認識， 我們來 “Get our hands dirty”，開始寫扣吧！ # 建構 Vue 框架的幾種方式 建立起 Vue 的開發環境有幾種方式 # 透過 CDN 使用 Vue 如同我們學習 jQuery 一樣，CDN 是我們的好朋友。 透過這個老友一樣可以讓我們享受到 Vue 的美好： <script...

# 前言 這篇來說明要使用 Git 前「一定」要做的事情：設定使用者名稱、信箱。 以及可以選擇性操作的：設定 Git 預設文字編輯器。 # 設定 Git 的使用者名稱與信箱 # 用指令更改： 我們開啟終端機，並且透過下面兩個指令來設定 Git 使用者資訊。 (建議兩個指令「分開複製」到終端機執行) git config --global user.name "這裡改你的名字"git config --global user.email "這裡改你的信箱"實際輸入的內容看起來會像這樣： git config --global user.name...

# 前言 上一篇文章，已經大概說明為什麼會需要使用框架，同時也大概說了為什麼要寫 Vue 這篇文章，來聊聊原生 JS 跟 Vue 的比較吧 雖然上一篇好像在嘴這件事，不過這方式真的很容易能看到框架的優點 # Vue 幫做了什麼事情？ 如果你已經有學過原生 JS 控制 Dom 的運作，那大概看得懂這段 code 在做什麼事情： <div class="message"></div>const $message =...