前言
今年四月離了職，開始了調光freelancer和轉職計畫...
這個決定已經前前後後思考了一年，畢竟要從一個熟悉的環境離開真的有滿滿的未知和恐懼。

在思考轉職的同時也找了很多關於前端的資料，
從w3schools和youtube上看了一些很基礎的HTML,CSS運用，並嘗試寫點東西。

確定自己不僅僅是一頭熱地栽進去，也確定自己不會三分鐘熱度遇到困難就打退堂鼓後。
開始考慮是要上資策會還是找一間線上課程自學...
經過幾番考慮，最後購買了六角學院的前端工程師課程！

從新手HTML,CSS開始，一直到js,vue滿滿的課程可以學習。

前前後後大概花了五個月，看完了HTML,CSS,bootstrap,js學徒,js核心...
本來想說可以開始著手準備作品集，但總對自己沒什麼自信，對於前端的知識感覺也還一知半解。

無意間看到了網頁切版直播課程，想著！如果真能好好磨練一番。或許對於找工作會自信一些。
但又怕自己程度不夠好，會不會上課到一半完全跟不上進度...那這樣挫折感一定更大！

就這樣抱著這樣的猶豫，卡就刷下去了！
反正開課是一個月後的事！好好再來複習準備準備吧！

就這樣，第一次的直播班就這樣開始了！

第一週：1px也不差的版型控制術
第一次上課意外的很輕鬆，大部分原因也是因為我都聽得懂，
課程上更深入了解了padding,margin的一些運用，像是推擠方向要一致、或用%取代px的用法。
或是img會有額外的padding,要使用display-block拿掉等等...

這些小小的技巧讓我在第一週就開了眼見，原來魔鬼藏在細解裡這句話是真的啊！

第一週作業
第一週作業讓我更熟悉了對版面的控制，還有對一些重複的樣式去做初步的管理。

第二週：flexbox網頁排版術
不得不說flexbox的排版方式解決了初期我在學習的很多困難。
起初我在看前端課程時上面只教到float，一直到我看完HTML的課程時，才剛好更新了flexbox的部分。
所以那時候我的flexbox是上網學的 flexbox froggy
這也讓我瞭解到，未來職業的路上，不只是課程上可以給你幫助，自己上網查找資料一樣也可以讓自己成長。

這次課程學到了container！
這時老師還沒有教我們使用套件，只告訴了我們命名的方式要正確，要語意化...
並提醒我們在一些滿版或圖片排版時要使用上container

第二週作業
第二週作業在寫的時間上其實跟第一週差不多，css還是用途法煉鋼的方式撰寫。
那週活用了flex的排版及container的運用，讓整個版面排版起來更加的愉快方便。

第三週：響應式網頁設計
終於來到了第三週！這時腦袋裡一直浮出當時老師給我們看的難度表

RWD算是一個小魔王關！我本來想說這關我大概就卡死了！因為我重來沒有做過RWD
課程上講解了權重的觀念，在瀏覽器縮小後可以改變新的樣式。
還有寬度的單位要如何用%配置，在寫RWD上才比較不會把自己的code寫死了。

第三週作業
第三週的作業我做了足足一個星期多
記得我的CSS很亂，寫到後來都快搞不清楚自己在寫什麼。
不過也算是超乎了我的預期！居然完成了作業！

第四週：多頁式網頁設計
第四週開始覺得難度有點提升，課程內容多了很多東西，在下課之後才能慢慢吸收。
用了助教幫大家寫的gulp去做多頁式的管理，並使用scss去撰寫樣式。
本來只想用scss去做作業，但被小組隊員們督促要去載入gulp!

花了一個早上摸索居然也讓我學會了如何使用gulp!!
也問了隊員們怎麼使用GitHub Pages好讓我能順利上傳作業!!!
手把手GitHub Pages教學

這才發現學習路上有隊員們的神助攻真的會讓自己更努力，
畢竟隊員們有些都是在工作的工程師了！還這麼努力！我這隻菜鳥不能不加把勁。

第四週作業
第四週作業算是第三週的延伸版，要有基本的首頁、商品頁、登錄頁面等等。基本就是完成一個網站架構。
因為前一週已經把最難的首頁寫完了，剩下的商品頁覺得蠻得心應手。
但也因為第一次使用了scss，所以一併把上週寫得亂七八糟的code修改了一下。

課程到這時才發現對自己的要求慢慢的變高了，不僅想要準時交上作業，也想準時跟上每週的助教分享。
想把每次新學習到的東西都嘗試運用在網頁上，
雖然第一次使用錯誤率很高，花上的時間也比較久。但每次寫完都會有滿滿的成就感！

也開始寫文章記錄我作業的心得，假日也會在youtube上找一些有趣的side project來練習。

這時的心態跟一開始上課時有些不一樣，不再那麼害怕會跟不上進度。
反而是更想好好的跟上進度，然後準備下次又有新的東西可以吸收和運用！

第五週：後台表單設計
這週開始使用了Bootstrap和學習使用scss的@import讓css模組化。
從一開始語意畫的命名，再到原件組成的方式命名有些許不習慣。
但學習Bootstrap其實不難，運用得當讓寫畫面變快很多！

第五週作業
第五週作業是我做的最滿意的作業之一
不只速度有提升，作業完成度自己也很滿意！在一週內順利交出了四頁的內容。

手寫 SCSS 結構參考

@import "variable";// 變數  
@import "reset";  // reset.css  
@import "base"; // 全站設定
@import "util"; // 工具類 class，.mb-1、.pr-3

// layout 共同框架,第一層
@import "layout/header";
@import "layout/footer";
@import "layout/menu";
@import "layout/aisde";

// 頁面設計
@import "pages/index";     
@import "pages/cart"; 

第六週：格線系統
這週重新認識了Bootstrap的container如何運用，以及如何運用Gird去排版！
另外還整合了Bootstrap到自己的scss中，這又是另外一個境界了！
不僅可以去改變它原本的設定，連padding、margin等等這些通用元件都可以自己更改。
靈活性和使用性更是大大的提升！

第六週作業
第六週作業自己做得很開心。
因為覺得Gird的排版真的快速很多，也越來越能掌握Bootstrap要如何運用於RWD上。
這週也是我第一次使用@import的方式去引入scss，
雖然一開始有遇到連接不到，或是覺得在跑網頁時會要等待許久的問題...
但習慣之後就會發現你的scss終於也可以好好的整理，不會再變成很長一串了。

第七週：視差滾動
這次課程帶我們介紹了AOS視差滾動觸及
瞬間讓你的網頁像是提升了一個檔次！！

載入幾行的程式碼，就可以讓網頁動起來。
不只更加見識了套件的強大之處，也發現要做好網頁真的還有很多無窮無盡的東西可以鑽研和學習！

第七週作業
第七週老師說可以拿之前的作業來套，
但因為看到網頁做得很漂亮，就激起了我也想要寫寫看的慾望。

從一開始覺得會跟不上進度的我，到現在會想嘗試做做看！真的差很多
也對自己要完成100%的課程有了些自信！
有點不敢相信自己可以完成，也很開心自己做到了！

第八週：CSS模組化管理
最後一週分享了很多同學的模組化結構，比起自己才嘗試沒幾次真的是落差很大啊ˊˋ
也講了我們從第一週上課時，老師一直說要語意畫的命名，到現在進階成結構化的命名...
這些都讓我更瞭解如何去讓你的code可以重複的使用，而不用再花時間一個一個刻。

再加上scss的管理，引入Bootatrap等等，
即使網頁越做越大，但code還是可以有方法的去管理、歸納。

第八週作業
第八週作業大概花了一週多的時間才處理完畢！
首先觀察那些相同的樣式，相同的組件要怎麼先去制定。
光是整理好那些相同的參數，更改Bootstrap的通用元件等等...就花上一天的時間。
排版的部分也比起之前駕輕就熟了很多...
整體來說把之前所學的運用了進去，也認識了一個新的套件swiper...

雖然覺得自己的最終作業不盡完美。但也算是給自己好好的磨練了一番！

總結
就這樣！八週的時間...
好多學員都覺得不夠不夠！我也這樣覺得！！
因為學到了好多新的東西，才真的發現還有好多可以精進的地方！！

一開始我只會寫css，還是個寫單頁式網頁都會把css搞到好多行的菜鳥
到現在會使用scss，引入不同套件使用，加快了自己寫網頁的速度等等...
都是我意想不到的收穫，也是在這個菜鳥階段的我收穫最大的部分！

也在短短八週遇到了好多的第一次
第一次寫RWD、第一次寫scss、第一次使用GitHub...
還有課堂之外的改變
開始寫學習blog、開始上網看別的教學做side project...

這些滿滿的收穫居然都在短短兩個月內做到了，
超感謝老師時時刻刻體醒我們要刻意練習，
超感謝助教群們的作業提醒，還有每週的助教分享，
超感謝同期學員和隊員的督促和作業討論！

也因為我菜鳥的經驗，其實還有好多好多學習資源我都還看不懂，
覺得只學到課程的70%左右而已，但已經覺得自己進步了很多！

未來期許
現在的新目標是著手整理之前的作品，然後好好的把履歷上線，
雖然js還只有菜菜的程度，也還不會vueˊˋ但希望能嘗試投遞履歷，把自己丟上市場檢討還缺少什麼！

希望未來的學習之路可以讓自己變得更強大！
也報名了2月的js課程，希望能再度給自己磨練一番！！

2021期許自己轉職成功