六角學院Vue課程介紹與心得,3大熱門框架首選!

六角學院Vue

你知道什麼是Vue.js嗎?知道代表你對前端開發有一定的認識,不知道也沒有關係!

今天為大家介紹一個優質線上課程,六角學院的「Vue出一個電商網站

上完課之後不僅了解Vue的基本觀念,也對Vue完全的上手,所以決定好好的來分享六角學院Vue課程介紹與心得

本篇內容包含:

  • Vue是什麼?
  • 為什麼選擇Vue.js這個框架?
  • 六角學院介紹
  • 六角學院Vue出一個電商網站課程介紹
  • 六角學院Vue出一個電商網站課程心得
  • 【讀者專屬回饋】

文章最後還有【讀者專屬回饋】哦!

 

Vue是什麼?

Vue.js是一個用於建立使用者介面的開源JavaScript框架 ,和React、Angular為現今最熱門三大框架之一,作者尤雨溪(Evan Yu)於2014年初發布第一版本

和jQuery不同的是,jQuery是以「綁定樣式(class)」並且對樣式做一些畫面上的處理

而Vue則是以「綁定資料」的形式操作畫面,注重MVC模式中的視圖層,並且通過內部元件(組件)化的方式呈現視圖與模型的互動

Vue的這個特色不僅讓程式碼更為簡潔、易管理,同時也更好組織化開發中的網頁專案,適合一般網頁、SPA等開發

六角學院Vue
Vue
(圖片來源 : Vue github)

 

為什麼選擇Vue.js這個框架?

Vue.js 4 大特色介紹

#1直觀語法

Vue的直觀語法讓開發者能夠節省許多開發時間,也讓正在學習的人可以更輕鬆上手

Vue直觀語法
Vue語法

 

#2雙向綁定

直觀的語法再搭配資料雙向綁定的特性,可以有效的減少程式碼撰寫,讓我們更能專注在資料控管的層面

Vue雙向綁定
雙向綁定

 

#3多樣化衍生工具

輕量的Vue.js還有多樣化的衍生工具,讓開發者在開發上更為方便,也因為衍生工具多樣化,許多人也都在研究,所以不用擔心網路上找不到資源

  • Webpack
  • Vuex
  • Vue Router

多樣化的好處不僅可以開發「單頁應用程式(Single Page Application 縮寫為SPA)」,也可以符合一般網頁開發需求,學一套用在多個層面!

Vue多樣化工具
多樣化衍生工具(Webpack、Vue Router、Vuex)

 

#4具有市場競爭力

Vue.js在Github中是成長最多的JavaScript前端函式庫,Github Star平均每天可獲得超過95顆,也因為如此才能和React、Angular兩大框架並駕齊驅

資料參考 : Vue_Github

Vue_Github
Vue Github

 


 

六角學院介紹

六角學院是由兩位導師創辦,主打前端系列課程,包含 : 前端工程師、網頁設計師及UI設計師,線上課程均由兩位導師負責教學

而每種課程裡的每小節都有專屬討論區,只要有問題即可發問,24小時內都會回覆,提供非常完整的售後服務

目前線上學習人數超過兩萬人,是大家公認的前端學習指標

六角學院
六角學院 (圖片來源:六角學院)
想了解更多六角學院課程,成為一名前端工程師嗎?那這篇文章不能錯過!
延伸閱讀: 六角學院課程評價,7個月成功就職月薪45K前端工程師

 

六角學院Vue出一個電商網站課程介紹

課程4大方向

#1手把手基礎開始學

包含Vue.js基礎觀念到進階課程,讓學員從頭開始學習Vue

這部分我認為對於剛擁有HTML、CSS、JavaScript基礎又正在尋找框架學習的人非常有幫助

除了Vue門檻低之外,老師講解也很仔細,我個人也是建立在這樣的基礎學習Vue,收穫非常多也順利擁有一項框架的技能

 

#2Vue Cli、Vue Router、Webpack 各工具

Vue Cli是比較進階的課程,會開始帶你認識以及搭配使用Vue Router、Webpack等等更多的整合工具,完整打造一個SPA網站

個人覺得在這個部分大家可以了解到多樣化的工具以及實際操作過,老師會從安裝到使用以及如何使用一步一步帶你了解與操作

對於複雜的東西可以一個一個清楚了解,這點我覺得是課程做的不錯的地方

Vue多樣化工具
多樣化工具

 

#3ES6常用技巧

ES6 : ECMAScript 2015(ES2015),第 6 版,最早被稱作是 ECMAScript 6 縮寫為ES6

是現在業界中要求的必備條件之一,課程中也會介紹並且使用最常用的技巧與用法,讓程式碼更為一致嚴謹

ES6
ES6

 

#4提供完整API 輕鬆開發電商網站

課程中會提供一個電商網站的後端API提供學員串接使用,讓大家可以真的實作出一個電商網站,功能包含

  • 加入購物車、酷碰券設計
  • 切換分頁、首頁
  • 後台介面、新增、修改、檔案上傳、分類、刪除、結帳
  • 產品分頁介面設計、會員登入

在這部分就可以完整的開發出個人的電商網站,也是一個大型專案,不僅可以提升自己實力,還可以拿作品去面試,一舉兩得!

我覺得一般前端線上課程很少會提供後端API提供學員練習與實作,這部分可以說是六角學院特別提供,也為學員之後的就業面試著想

 


 

課程10大重點內容

認識Vue.js 基礎觀念語法

帶你從安裝文字編輯器、安裝編輯器外掛套件、下載六角學院提供的練習專案,一步一步帶你操作,並講解練習專案裡面的所有Vue基礎語法

個人覺得這部分在一開始學習時非常有幫助,也讓學習者大大提升信心,後面課程也都是照著這樣的模式進行,上課起來非常舒適

Vue基礎觀念語法
Vue基礎觀念語法

 

進階模板語法

這個部分是在介紹基礎語法的細節使用,讓學員在撰寫程式碼時更了解語法的特性還有使用的注意事項,內容包含

在這個部分會更加穩固對於Vue基礎語法的認識與使用方法,還有一些注意事項,到這裡已經可以製作出一個簡單的小網頁(Todo List)了!

Vue進階模板語法
Vue進階模板語法

 

Vue.js 元件

元件的課程中會介紹如何使用x-template建立元件,並且教你如何使用元件,後半部也會教如何傳遞資料給元件或是透過元件傳遞資料給HTML標籤

元件在之後的Vue Cli會非常頻繁使用,也是Vue.js框架的一大特色,像積木一樣,一塊一塊的把網頁拼湊起來,管理與撰寫上也更方便容易!

Vue.js 元件
Vue.js 元件

 

常用 ES6 技巧

這個部分會教常用的ES6,讓大家在開發時有嚴謹的模式與了解JavaScript的特性

這邊會開始初步了解與認識ES6的撰寫方式,在未來專案也會頻繁使用,業界也會要求ES6的技巧,這個章節的練習與課程非常實用!

Vue常用ES6技巧
Vue常用ES6技巧

 

Vue 常用 API

這個章節比較偏向使用Vue的特定語法或是套件來解決一些特定的問題,會介紹一些常見的API與使用的方式

Vue常用API
Vue常用API

 

Vue Cli 建置原理與運作原理 (2.0)

Vue Cli課程開始後就是開始建立一個SPA網頁的時候了!這個章節會介紹Vue Cli的建置,一步一步的安裝教學,還有安裝相關資源

建置後裡面的相關文件解說,並且安裝額外套件在建置後的檔案中

這部分比較進階的課程對於剛開始接觸框架的人來說會有比較多東西要吸收,因此在課程中老師也會講解比較詳細,如果不懂重複觀看幾次就能慢慢了解

Vue Cli 2.0 建置與運作原理
Vue Cli 2.0 建置與運作原理

 

Vue Router

這部分會帶大家了解Vue Router的運作以及結構,詳細的講解路由及連結的使用方法與設計,並且使用動態路由切換頁面Ajax結果

Vue Router可說是製作SPA的核心,也是Vue最精華的部分,製作起來非常有趣,老師講解與回答問題也非常有耐心,大家學習時會非常順利

Vue_Router課程介紹
Vue Router

 

Vue Cli 3.0

這個章節在介紹2.0與3.0的差別,並且介紹建置後的文件差異及位置調整

3.0的特色就是多了GUI介面,讓使用者可以更方便的操作,課程中也會告訴大家安裝方法及如何建置,最後還有2.0搬家到3.0的教學

Vue Cli 3.0
Vue Cli 3.0

 

Vuex 管理大型網站資料狀態

這個章節會介紹什麼是Vuex ,了解Vuex運行狀態以及資料控管方式,對於大型專案中這是一項非常好用的工具

Vuex這個工具比較建議在大型的專案使用,功能會讓程式碼及資料較好管理,如果是小型專案使用起來反而會更麻煩

但是業界都是大型專案,因此這部分也是非常推薦大家學習並且練習,未來就業面試可能會加分,工作起來也會比較上手

Vuex管理大型網站資料狀態
Vuex 管理大型網站資料狀態

 

製作電商網站與提供完整API資源

最後的部分就是做出屬於自己的電商網站啦!課程中會提供電商網站的API,上面也有介紹過,功能包含

做完之後也可以放上雲端給老師助教code review,讓你的作品更有品質,面試時也會更加分,最後記得放上Github,為自己的side project留下一個完美的作品!

電商網站完整API資源
電商網站完整API資源

  


 

六角學院Vue.js入門影片

上篇



下篇

  

六角學院Vue出一個電商網站課程心得

這是我第一個購買的六角學院課程,當初會購買的原因是因為決定走前端工程師這條路,而我看104上基本都需要會三大框架其中之一

而六角學院是一個中文授課課程,也剛好有Vue課程,上網查了一下三大框架最容易入門也是Vue,因此就買了課程組合包,而學習中也發現這門課的優缺點

優點

  • 售後服務完善
  • 「24小時內回覆問題」、「問題問到飽」、「專屬討論及發問社團」
  • 講解仔細,安裝教學步驟不馬虎
  • 課程系統安排適合初學者入門

缺點

大家上同一個課程,作品其實大同小異,面試官很有可能會看過一樣的作品太多次,而這個缺點也不是不能解決,就是在製作作品前預先想好主題,避免造成重複主題

 

個人心得

上完課程後有了對Vue的認識與使用,再加上有了一個完整的作品,製作履歷上也方便許多,不會讓自己的履歷看起來空洞無內容

而且在面試時面試官通常會對你的作品感到有興趣,其實不是很了解,但也是會看你個人的態度與想法,這時只要是認真上課做作品的

通常都能夠講解的很完整,過程中還可以加入一些你製作時的想法,適時的加入專業名詞,面試官會覺得你很認真且有能力,會大大提升你錄取的機率!

總歸來說,這門課適合 「擁有HTML、CSS、JavaScript基礎」、 「想要學習前端框架」、 「為就職準備」的人,而認真上課與練習,收穫會非常多!

 


  

讀者專屬回饋

因為個人在準備就職前花了很多心思與時間,我能了解決定前的糾結與決定後的堅持是很不簡單也很辛苦的

因此我決定在這邊免費回饋給我的讀者一個專屬的「客製時間進度規劃討論

如果您是透過我的連結與購買教學步驟購買課程的讀者,除了您已經決定開始學習之外,另一方面也是給予我的文章肯定

而我將會與您聯絡並且幫助您規劃與討論您的時間進度規劃

 

如何獲得回饋?

獲得專屬回饋的步驟很簡單,請遵循下方每一個步驟指示 :

  1. 按下方按紐進到六角學院Vue課程頁面
  2. 購買Vue課程
  3. 購買完成後請您截圖「付款成功畫面(包含網址)」
  4. 透過Email將您的「截圖畫面」傳送到 stupidnote@stupidnote.com
    (讓我核對一下是否為我的讀者)
  5. 等待我與您聯絡

 

 

客製時間進度規劃討論 是什麼?怎麼討論?

等待我確認完您的Email之後,我將會與您聯絡並且共同討論5件事項:

  1. 了解您對於網頁前端的了解
  2. 了解您有多少以及有哪些時間可以準備
  3. 了解您預計到什麼樣的程度
  4. 給予您課程的準備方式與建議
  5. 最後共同討論與制定您的專屬時間進度規劃表

 

總結

如果你是一位想要成為前端工程師的人,那六角學院可以說是全台最大的前端線上課程,也包含完善的售後服務

老師教學仔細,課程內容含金量非常高,非常推薦一起進來學習,社團內也有很多轉職成功案例 : 半年畢業即就業行政轉職前端工程師

雖然都是不同職業轉職,但卻有一樣的共通點,就是他們努力的學習並且認真的發問

如果你也想轉職或是學習前端,我推薦你「六角學院」!

有任何問題歡迎底下留言告訴我!我看到之後會第一時間回覆你唷!

 

Leave a Comment

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

Scroll to Top