方格精選

【前端課程】六角學院切版直播班值得推薦嗎?全勤實戰心得

更新於 2021/09/02閱讀時間約 10 分鐘
一直以來,有不少讀者很非常好奇我是在哪裡進修自己的前端技能,因此在上完第一次六角學院課程時,就寫了一篇 JS 直播班心得文章,此篇文章主要是分享六角學院的 JavaScript 課程:
這一次再分享心得,主要是要跟大家聊聊,在結束 JavaScript 直播班後,我發現自己的切版技能跟不上實作功能的開發速度,於是又再投入了同樣是六角學院開的切版直播班之學習心得。
這一篇的課程會以與前一篇心得不同的切入點來討論,主要會著重在以下幾個重點:
  1. 誰適合上這門課
  2. 課程內容&學習風氣
  3. 上了這門課我進步多少
  4. 課程的推薦指數

誰適合上六角學院JS切版班?

先簡單說一下,在上這門課之前,我自己的切版程度到哪。
如果大家有開發過中大型的專案的話,會發現一個網站中要注意的畫面細節其實非常的繁瑣,小至文字的行高,大至動畫效果。
在上這門課之前,我可以說對於網頁開發上需要擁有的能力,我基本上都不算很專精。
但如果要我臨時切一個新的版型時,我還是切的出來,也可以盡量不破版,但絕對不敢跟你說,我知道為什麼可以這樣做,為什麼在特定元素上需要做這樣的處理。
如果你目前也是處於這樣的狀況:自己看似對 HTML、CSS、RWD 都很熟悉,但實際上根本不曉得自己為什麼要使用 container、utilities、設計原理,那麼這門課就會很適合你。
誠實的說,如果是完全沒有接觸過程式的新手,我個人認為上這門課的 CP 值不會很高原因在於你會花太多時間去理解最基礎的語法,而不是專精在「練功」本身這件事。
加上這門課的強者還不少,當你是一個完全小白的狀況下,有很高的機率會因為看到身邊同學,以鬼一般瘋狂的速度交作業時,你會感到無比的挫折,甚至因此無法跟上課程的進度。
至於已經在職的工程師適不適合這門課呢?我認為如果已經有能力自己修改 Bootstrap 元件、RWD做的得心應手,甚至可以自幹各式各樣動畫套件效果,能從課程學到內容的可能有限。
如果單純想付錢來練練切版速度倒也不是不可以,但與其如此,我會更建議進階的開發者可以直接參考 UI/UX 的網站,找一個自己覺得漂亮的版型練,一樣可以達到練功的效果,與課程的差異就差在有沒有同伴陪你一起練的那種熱血感,及有沒有人幫你檢視程式碼。

為期八週的課程內容

這裡分享一張我自己課程平台內的課程規劃:
基本上,老師每一週都會依照進度直播上課,如果你跟我一樣比較喜歡自己研究,我會建議跳過老師自己的直播課程,留給自己更多的學習時間,切版與 JS 不同,會需要花比較多時間打磨畫面的細節。
由於這一堂課程新手同學也不少,所以講解內容難度我個人認為是偏簡單的,所以課程前期作業壓力沒這麼重時,我都會一邊切當週的作業一邊跟著聽(老師請不要揍我XD)。
但到後期,一週要交出二、三十個頁面時,基本上我都會直接跳過直播課程,事後用兩倍速聽課程,把該聽的重點聽一聽,然後趕快自己去研究作法。
這一門課最難得可貴,真的不是老師的課程有多麽精妙,讓你上一次直接變成程式天才,而是在於六角學院有非常充裕的助教資源,讓你可以一直瘋狂的交作業,助教在丟回來給你更正,你再繼續優化你的作業。
所以老實說,我自己會花大部分的時間自己實作、研究內容,而不是掛在課程平台裡聽課,這對於網頁開發來說,可以說是非常沒有效率的一件事。
這也是為什麼我前面所說,如果你是超級新手,並且沒有事前預期任何有關程式概念的內容,這門課學習的強度可能會讓你很受挫。
另外值得一提的是,我很崇拜的六角學院的創辦人(講師),彷彿不用睡覺一樣,天天掛在課程社群裡回覆同學的問題。
曾經有同梯課程的同學跟我分享:「在六角學院你可以問任何噗攏共的問題,都不會有人責怪你。」
如果你跟我一樣是一個好奇寶寶,常常會很納悶網頁實作上的眉眉角角,而且也不怕發問,那麼就可以天天瘋狂對著助教、老師發送問題光波,大部分的助教、老師,甚至是一起學習的夥伴都很友善,相信害怕發問的習慣在這裡也會慢慢被克服
除了有地方給你發問外,切版的直播班也結合了六角學院一直以來的風格,會在作業中融入遊戲化的元素,讓自己可以看見自己的成長軌跡。

我到底在這裡成長了多少?

必須得說,如果在還沒有上切版課程前,我會給自己的切版能力打不及格。
至於上完切版班的我,如果沒有 90 分,至少也會有 80 分的切版實力,在大部分的同學還在找套件製作動畫效果,我已經能完全靠自己將網頁常見的畫面效果手刻了一遍。
從最一開始連 Bootstrap 都用不太好,到現在我完全可以自己用 SASS 用迴圈迭代出通用類別、網格系統,甚至是帶有斷點的通用類別。
基本上現在做響應式網頁時,不太會破版,即便有 bug 也很快就能更正,也可以做出動畫、視差滾動等效果。
當然實力這件事是口說無憑的,接下來給大家展示一下我在這八週所實作出的作品及作品的原始碼,如果大家有興趣的話都可以點擊進去瀏覽一下,也可以看看這八週大家需要完成多少的作業量才可以結業:
1. 簡易履歷:
在這份作業中,可以看得出我最初的實力在哪,這時的我其實超級不會閱讀設計稿,竟然還做了一個 1920px 大小的網頁,想一想都覺得當初的自己很沒有基礎的網頁切版能力。
2. 眼鏡電商網站:
這一份作業因為架構較完整的關係,前前後後大概製作了約三個禮拜的時間,已經可以看出與前一份作業的程度差異。
3. 課程後台介面:
基本的後台介面,看似簡單,卻讓我學會了如何手刻 Modal (互動視窗),但這一部分的效果是課程中沒有教的,主要是我自己負重訓練。
4. 售票網站:
這一個專案狠狠打磨了我對於 RWD 版型的熟練度,這一個專案有很完整的購物車流程,但礙於時間的關係,我只有完整兩三個介面的響應式設計。
5. 瑜珈品牌官網:
所有作業中,設計的最完整的版型,狠狠鍛鍊了我對於 CSS 進階語法的認識。
在這個設計中,我有使用到比較簡單的 SPA 與 Vue 技巧,讓網頁在不套任何第三方套件的狀況下,可以做到基本的頁面切換,當然這部分也是這自己負重訓練。
在這一次的課程中,主要會使用 gulp 進行專案上的換頁效果,但因為我本人很懶,而且對於操作 Command Line 有點疑惑,基於怕阻擋不了自己的好奇心而偏離軌道一直研究,我還是選擇使用自己習慣的手法來進行網頁的切換。
在寫這篇文章的當下,我只有完成首頁的響應式設計,基於有始有終的精神,我應該會在課程作業繳交期限到前,繼續完成作業
當然也有不少人沒有辦法在課程結束前,如期完成所有的任務,光是我自己在的學習小組大概只有不到三分之一的人,每週都如期繳交作業,並且參與小組的會議討論。
所以,即便你已經有程式的底子,想要將這一門課程完整的上完,依然要付出不少努力及心思。
如果你跟我前文所提到,如果你已經是一名工程師的話,上方的作業列表也可以讓你參考,思考自己是不是能在這門課中有所收穫。

推不推薦六角學院的課?

自從發布前一篇的課程分享文章後,我開始慢慢收到一些讀者私訊問我,我到底是上什麼課,他們也想要嘗試看看。
這邊我就直接先講結論:「每個人對於課程的需求不同,請依照自身條件來評估自己適不適合。」
依我自己的觀察,其實六角學院的課程評價非常兩極,要馬是推到爆,不然就是覺得六角學院的課很爛,去 Udemy 上還比較實在,性價比還更高一點。
我個人的想法是,學習本身就不是一個有絕對正確答案的命題,適合別人的,不一定適合自己。
在結束軟體業的社群行銷工作後,我最一開始的學習管道是 freeCodeCamp ,免費的課程就足以讓我了解大致上的 HTML 語法。
後來當我更有興趣的時候,到了 Udemy 買了一堂台幣 390 元,由英國教育機構 Appbrewery 推出的全端網站開發課,當時花了一個月的時間就可以做出響應式的網站,也能寫一些簡單的 JavaScript 邏輯。
但對於實戰來說,遠遠不足夠,那門課不僅時代久遠,更沒辦法教會我程式開發所需要具備的邏輯思維。
後來我輾轉從他人推薦中,知道了六角學院,一路以來也買了不少課。
由於幾乎所有課我都上過了,所以可以跟大家分享,六角學院的講師們不一定是最會教的,但一定是最有熱情的,只要你對於前端開發有問題,在社群中,基本上不會漏回任何一則訊息。
關於程式開發的課程,總會有分初階、中階、進階的技術門檻在,而六角學院就是比較偏:讓你在不懂原理的狀況下,就會實作網頁開發,初中階等級的入門課程。
對於求知慾很強的我,其實相對不對足夠,所以比起上課程,大部分的時間我都泡在 MDN 、StackOverflow 或是 W3C 看文件。
但基於軟體工程師本身職業特性,就該要有這樣實事求是、自我鑽研的技能,所以對於六角學院的課程可以做到這樣:新手友善、程式開發邏輯培養的程度,我心懷感激。
不管大家對這門課的評價如何,能讓我保有動力走下去,並且在這裡分享內容的幕後推手,六角學院絕對是很重要的角色。
至於路可以走多遠,造化就在自己究竟付出了多少努力了。
如果你是一名相關背景、科系出身的人,並且來嘴這門課到底有多差勁、新手,那真的是跑錯棚,畢竟六角學院的受眾很明確,主要是針對跨領域、非本科系背景的人來入門,自然而然不會有那些超級無敵硬的內容,主要都還是偏實作居多。
如果你是一名偏新手,想要嘗試看看網頁開發的話,我相信這門課會對你很有幫助。
關於如何挑選到適合自己的課程,我還額外寫了另一篇內容:
希望今天的文章有幫助到正在閱讀的你,如果你喜歡我的文章的話,可以留下你的愛心或是收藏我的文章,也或者可以點選「贊助」,你的一杯咖啡絕對是我持續寫下去的動力!或是透過拍拍手,用你小小的行動支持我的創作!
如果有對跨領領域轉職的議題想要跟我討論,歡迎你下方留言與我討論!
我是Vivian,我們下次見。
關於我:
2019年從英文系畢業,2021下定決心開啟轉職工程師的新生活,相信不斷學習會有成長的一天。
|聯絡我:vivian.enlife@gmail.com
此篇文章會顯示動態置底廣告
為什麼會看到廣告
為了追求可以窩在座位上、可以心無旁騖思考問題、座位可以亂七八糟沒關係、不需要到處哈腰點頭跑客戶,不用腳踩十公分、連妝都可以不用化的職場人生,文組少女毅然決然踏上RD的養成日常。
留言0
查看全部
avatar-img
發表第一個留言支持創作者!
HackMD 是一個協作共筆文件彈性很高的工具,但也因為彈性高,更需要學習系統性的管理方式。 當瞭解 HackMD 的編寫邏輯,就能依照協作文件的性質,來進行不同的管理方式。
前陣子有讀者來信詢問我:「嗨!Vivian,我想要請問妳都是在哪裡學程式的呢?是實體課程嗎?」
HackMD 是一個協作共筆文件彈性很高的工具,但也因為彈性高,更需要學習系統性的管理方式。 當瞭解 HackMD 的編寫邏輯,就能依照協作文件的性質,來進行不同的管理方式。
前陣子有讀者來信詢問我:「嗨!Vivian,我想要請問妳都是在哪裡學程式的呢?是實體課程嗎?」
你可能也想看
Google News 追蹤
Thumbnail
*合作聲明與警語: 本文係由國泰世華銀行邀稿。 證券服務係由國泰世華銀行辦理共同行銷證券經紀開戶業務,定期定額(股)服務由國泰綜合證券提供。   剛出社會的時候,很常在各種 Podcast 或 YouTube 甚至是在朋友間聊天,都會聽到各種市場動態、理財話題,像是:聯準會降息或是近期哪些科
Thumbnail
可能包含敏感內容
先說一下我的背景,非本科系從 2022/3 開始接觸到前端領域,在摸索過程中遇到六角學院,買了 HTML 和 CSS 課程從基礎學起。
Thumbnail
在軟體開發領域中,Backend 和 Frontend 是兩個常被提及的術語。許多同學常常問我,到底是 Backend 比較難還是 Frontend 比較容易?
Thumbnail
在專案建置的過程中引入 Bootstrap 並且客製化其樣式已是非常常見的事,並且隨著對 Bootstrap 以及 Sass 了解的加深,發現客製化的幅度可以非常的大跟彈性,因此想記錄這些研究與實作的過程,如果對你也有幫助,那就太好了。
Thumbnail
链接 :WK89.FUN 特罗姆瑟VS斯塔贝克 时间:2023-06-25 23:00 特罗姆瑟取得各项赛事三连胜,反观斯塔贝克近3场不胜,对比之下,特罗姆瑟是役延续胜绩无难度。 单双:单 🐧QQ:1796469863 ✈️TG:TP96VIP #AK直播软件 #AKapp #AK直播体育情报
Thumbnail
链接:WK89.FUN #KLeague #UlsanHyundaiFC #DaeguFC 比赛时间:2023-06-24 18:30 韩K联赛程:蔚山现代VS大邱FC 蔚山现代至今主场保持不败,9战录得7胜2和,加之上季对大邱FC完成双杀,蔚山现代今铺取3分问题不大。 推荐:蔚山现代主胜 大小分
Thumbnail
在跟社群朋友私訊時,他說我可以考慮分享「我的前端之路」之類的啊。覺得這真是一個很不錯的主題,每個人都有自己的故事!不愧是個老師,會因材施教XD 本科系畢業、碰前端之前 憧憬前端工作,但沒自信、不敢 設計與美感 - 一生從沒碰過的東西 Vue 比 React 簡單? 與設計師的合作 跨足APP
Thumbnail
從身邊最小的事物開始吧! 這是我學習完基礎JavaScript後第一個做成的Project,應該是每個前端都一定會做過的project,但對於自學的我非常有挑戰性,我需要訓練自己在短時間內熟悉JS event並且運用他做出我的第一個搭配大量JS程式碼的網頁作品。
Thumbnail
教到了JS event,非常實用的一堂課程,開始進入監聽階段,可以跟使用者互動,也慢慢建立UX的概念,讓我可以開始自行設計動態網頁,並且優化了第二個靜態網頁,加入了滾動變化的效果。
HTML <script> 中的屬性 - async & defer    CSS JS FE BE WEB
Thumbnail
無須基礎,只要「複製 + 貼上」就能學會 (RWD Bootstrap + jQueryUI + fancyBox + CKeditor + Google Chart) 每個特效均為您示範 WebFomr + MVC 雙重範例 ASP.NET 教學 — 前端特效輕鬆學 (9.9小時) 課程介紹
Thumbnail
*合作聲明與警語: 本文係由國泰世華銀行邀稿。 證券服務係由國泰世華銀行辦理共同行銷證券經紀開戶業務,定期定額(股)服務由國泰綜合證券提供。   剛出社會的時候,很常在各種 Podcast 或 YouTube 甚至是在朋友間聊天,都會聽到各種市場動態、理財話題,像是:聯準會降息或是近期哪些科
Thumbnail
可能包含敏感內容
先說一下我的背景,非本科系從 2022/3 開始接觸到前端領域,在摸索過程中遇到六角學院,買了 HTML 和 CSS 課程從基礎學起。
Thumbnail
在軟體開發領域中,Backend 和 Frontend 是兩個常被提及的術語。許多同學常常問我,到底是 Backend 比較難還是 Frontend 比較容易?
Thumbnail
在專案建置的過程中引入 Bootstrap 並且客製化其樣式已是非常常見的事,並且隨著對 Bootstrap 以及 Sass 了解的加深,發現客製化的幅度可以非常的大跟彈性,因此想記錄這些研究與實作的過程,如果對你也有幫助,那就太好了。
Thumbnail
链接 :WK89.FUN 特罗姆瑟VS斯塔贝克 时间:2023-06-25 23:00 特罗姆瑟取得各项赛事三连胜,反观斯塔贝克近3场不胜,对比之下,特罗姆瑟是役延续胜绩无难度。 单双:单 🐧QQ:1796469863 ✈️TG:TP96VIP #AK直播软件 #AKapp #AK直播体育情报
Thumbnail
链接:WK89.FUN #KLeague #UlsanHyundaiFC #DaeguFC 比赛时间:2023-06-24 18:30 韩K联赛程:蔚山现代VS大邱FC 蔚山现代至今主场保持不败,9战录得7胜2和,加之上季对大邱FC完成双杀,蔚山现代今铺取3分问题不大。 推荐:蔚山现代主胜 大小分
Thumbnail
在跟社群朋友私訊時,他說我可以考慮分享「我的前端之路」之類的啊。覺得這真是一個很不錯的主題,每個人都有自己的故事!不愧是個老師,會因材施教XD 本科系畢業、碰前端之前 憧憬前端工作,但沒自信、不敢 設計與美感 - 一生從沒碰過的東西 Vue 比 React 簡單? 與設計師的合作 跨足APP
Thumbnail
從身邊最小的事物開始吧! 這是我學習完基礎JavaScript後第一個做成的Project,應該是每個前端都一定會做過的project,但對於自學的我非常有挑戰性,我需要訓練自己在短時間內熟悉JS event並且運用他做出我的第一個搭配大量JS程式碼的網頁作品。
Thumbnail
教到了JS event,非常實用的一堂課程,開始進入監聽階段,可以跟使用者互動,也慢慢建立UX的概念,讓我可以開始自行設計動態網頁,並且優化了第二個靜態網頁,加入了滾動變化的效果。
HTML <script> 中的屬性 - async & defer    CSS JS FE BE WEB
Thumbnail
無須基礎,只要「複製 + 貼上」就能學會 (RWD Bootstrap + jQueryUI + fancyBox + CKeditor + Google Chart) 每個特效均為您示範 WebFomr + MVC 雙重範例 ASP.NET 教學 — 前端特效輕鬆學 (9.9小時) 課程介紹