# [2021夏季 Vue 作品實戰班]-心得牆

<br>

## 面對困難勇於挑戰

我的上一堂課是今年的 js 直播班，起初在 js 上課前還很猶豫要不要一起報名 Vue 直播班，因為那時新工作剛開始，很怕工作和課程無法兼顧，也擔心 js 基礎學不好會跟不上 Vue 直播班的節奏，所以很猶豫。

但工作幾天後就毅然決然報名了，那時候只有一個想法：「既然都要學 js 了，也想要往前端邁進了，那為什麼不一次學好呢？」，猶豫只會延後轉職成功的機會，我覺得我應該可以撐過去，就此展開了這場對自己的自虐之旅。

<br><br>

---
## 水深火熱的 61 天

正式上課前有報名一日 Vue 直播班，希望可以先用一天的時間基礎認識 Vue 的大概概念，結果因為沒有概念，那天上課根本有聽沒有懂，反倒是 Vue 直播班提供的課前預習影片反而更有幫助！

### 第一週 & 第二週
有鑑於之前已經上過 js 直播班了，所以第一週的 todolist 練習和第二週的串接 API 上手很快，沒有甚麼問題，但從第二週就開始構思最終作業的畫面呈現，也試著將畫面呈現出來。

<br>

### 第三週
第三週開始就正式進入 Vue 了，透過課前影音，可以更快上手 Vue 的寫法，這時候也會發現 Vue 的一些語法比 js 方便很多，尤其是 v-for、v-on，省去用 .document 抓 DOM 和建構需要渲染的 html 結構這些麻煩，在撰寫時快速很多。

<br>

### 第四週
第四週作業算是一個關鍵，學習將功能元件化，元件化可以有效減少網頁程式碼的長度，也可以讓元件在不同頁面可以簡單的被呼叫使用。

<br>

### 第五週
前幾週都是練習後台部分，第五週開始做前台，這週的作業剛好也跟 js 直播班最終作業一樣，是串資料並增加購物車功能。

自己在寫的時候除了串資料以外，更多是去設計版面的呈現，從線上商城頁面 → 購物車 → 訂單填寫 → 訂單確認 → 付款完成等一連串畫面設計好，這個想法在後面的作業中也幫自己減輕了不少時間壓力。

<br>

### 第六週
第六週是將前面幾週的檔案帶入到 Vue Cil 的環境中，自己也在這時候將前台的版型又調整了一次，並新增了單個商品的頁面，畫面越來越完整，感覺也離終點進了一點點。

<br>

### 第七週
第七週把後台資料做的更完善，版面也日漸穩定，從開課到現在，對程式碼算是越寫越順手，寫起來也比較有自信了。

<br>

### 第八週
最後一週是把整個網頁全部做完，因為之前完全沒有規劃首頁的版面，所以花了一點時間去設計首頁的規劃，並將一些小功能(如加入最愛)實現出來，雖然網頁還算完整，但還沒有通過第一關審查，只能繼續努力，希望最後可以做出讓自己滿意的作品。

> ps：看到 Ray 助教在 Slack 上給建議的瞬間讓我熱淚盈眶~~直接哭出來~~，感覺自己好像真得可以完成這個不可能的任務，很感動QQ

<br><br>

---

## 回首檢視才發現原來擁有了很多
經歷兩個月的學習和不斷撰寫，很多當初完全不了解的概念在潛移默化中已經被身體和腦袋記住了，比如 this 指向、on/emit，以前看不懂的邏輯和技巧，現在都可以很快地寫出來，並得到自己想要的結果。

在學習過程中，老師、助教、同學們都是很好的學習對象，不會寫的地方可以觀摩作業的參考程式碼、去看看已提交的同學們的寫法，真的找不到解答也可以在 slack 上詢問，基本上都可以得到答案或方向。

直播班可以感覺到不是自己一個人在努力，總會有人走到自己前面，也會有人落後自己，全班一起的學習氛圍很舒服，更能讓自己積極起來，完成讓自己滿意的作品。
<br><br>

---

## 受益良多的附加服務
Vue 直播班也有跟 js 直播班一樣的「每日作業」、「每日助教」、「週二助教直播」，不過不一樣的是卡伯斯老師還加碼在假日的下午開了直播 demo 當週作業的寫法，簡直是做作業時的救星 QQ

* ### 每日任務
每天都會有不一樣的任務，就像是每天學習一個小知識的感覺，比如五月的時候，洧杰老師加開了 Bootstrap5 實戰營，加上 Vue 直播班這邊的作業，五月真的忙到不可開交，很多影音課程都沒有時間看，不過有固定在做每日任務，這讓之後寫作業時可以有更多的想法和做法，也比較不會有學習停滯的焦慮感。

<br>

* ### 每日助教
想當初 js 直播班自己並沒有使用到每日助教的服務，Vue 直播班用過服務之後就一試成主顧了，六角的助教群簡直太強大了，只要提出問題，最快當天、最慢隔天就能獲得解答或方向，每次都可以即時的解決自己寫程式上遇到的瓶頸，把問題解決的感覺真的很好！感謝所有的助教們，你們真的太棒了！

<br>

* ### 假日加碼直播
感謝卡伯斯老師特別犧牲自己的假日，為我們加開假日的直播，線上即時示範當週作業的 live demo，也會分享很多前端的小知識，透過假日老師的分享，真的吸收了很多課堂外的知識點。

live demo 可以快速了解大致的撰寫流程，也可以學到不同的寫法，或者是邏輯思考的方向，換自己動手寫的時候會比較順手。

<br><br>

---

## 即使後悔也買不到早知道
課程的兩個月間，一直犯著一個錯誤，那就是「就算有想法，也懶得記錄。」

一開始如果已經有最終作業的想法，應該要早點記錄下來，或是開始設計版面，這樣在後面製作時就不用花很多時間去調整版面或是想文案。

起初沒有好好規劃最終作業的方向，只用一些模糊的概念去製作每一個版型、產品文案，結果越到後面，整個專案的方向已經跟原本想的完全不一樣了，浪費了很多時間做切版重構。

之後在做任何專案時應該要記取教訓，將想法或畫面記錄下來，規劃作業流程，畢竟有了大概雛型之後比較不會出現沒有方向的狀況，在調整上也會更方便。


<br><br>

---

## 既然已經決定了道路，硬著頭皮都要走完
卡伯斯老師在上課前一直有說到後期會很痛苦，但不知道為什麼自己就這樣撐過來了。

可能是因為六角學院都盡可能地提供各種資源幫助解惑，所以在撰寫作業上遇到的困難沒有想像中的那麼堅不可摧，常常是老師、助教、同學的幾句話就可以打通思路，或者是起來走一走、動一動，回到座位時通常都可以想通之前困擾很久的問題。

今年 5 月初剛好進入疫情第三警戒，六角學院的老師們真的很願意奉獻，相繼開了 6 月的程式體驗營；7月也要再開 Vue 的體驗營，真的提供了很多資源讓想轉職前端的人能夠有個機會踏入這個領域。

切版班已經開始上課了，但是因為 Vue 最終作業還沒完成所以壓力很大，不過既然已經報名了，那就硬著頭皮努力衝看看，就如同 5 月一次上兩堂課的自己，覺得會撐不到最後，但仍然堅持完成兩堂課的主線和每日任務，如今兩堂課都結束了，而且最難的 Vue 最終作業也有了雛形，我相信接下來的課程自己也可以完成的！


第一次接觸前端的我們就像個剛學步的嬰兒，想嘗試著走一步、走兩步，卻因為跌倒而感到喪氣，想放棄努力。

但六角學院的老師群和助教群就像一旁守護的大人，他們會扶起跌倒的我們、教我們走路得訣竅，並鼓勵我們繼續嘗試。

走到後面才發現自己不知不覺中學會了走路，甚至已經走到了終點，回首當初那些不可能，早就已經在無形之中被自己化解了。

**「當寫程式頻頻碰到瓶頸、快要放棄時，就毅然決然拋下困擾很久的問題。起來走一走，放鬆過後，會發現原本的問題已經不再是問題！」**