主題:如何藉由學習框架(Vue JS),培養無可取代的工程思維😎
小白🙆♀️心中os:當初學 React 純粹是因為「覺得需要而學」,現在認識 Vue 是為了滿足自己「想重新認識一項事物」的願望,就是這麼存粹,但不浪漫… 🌹
你學過框架嗎?還是說你已經是框架老手?
以往的我,對於 Vue.js 的理解僅限於 JS 的框架(沒錯! 僅此而已🙃
今天…我誤打誤撞,撞見了Vue的新世界,不僅讓我更深入地認識框架,更深化了我的學習思維。
現在我希望點進此文章的每個你,利用10秒鐘,重新思考學習框架,甚至是學習程式的初衷
…
… …
… … …
… … … …
… … … … …
(10秒到!)
先把答案放心裡,請君聽我說下去👂
回想剛踏入前端的你,一定、必定、非得要知道的 3 大天王:HTML,CSS, Javascript
再來,有單挑過天王們的經驗後,接著就開始接受 Javascript 框架的荼毒,多數人都盲著用,秉持著:「會寫會貼就好」&「動得了就行」的態度學習。
當然,這也不全然是壞事。學習不像吃飯,無法一次吃得精光(無法在剛開始就全盤掌握學習的大要和宗旨),也無法端倪每一粒米(事事求精),只能邊吃邊品嚐,或是邊吃盡量消化… 吃中嚐;做中學,這是人類吃和學的極限。
論框架,它既是一門技術又是一項長久積累而成的結晶產物。從框架之中我們可以見到前輩們的智慧,更可以了解程式語言的特性和缺失(不便之處)
因此,學習框架可以說是「學習一項新技術」。和學習任何一項技術相同,學習框架必須從最根本的開始研究, 以下以 「學習 Vue.js」 為例
First step:進入 Vue 官網,找到 「Learn」底下 documentation 的 「Guide」
Second step:了解 Vue.js 的創建目的,建構好環境(官網是用 Scrimba 示範)
Third step:閱讀&隨著 Guide 的引導做最基本的操作
就~ 這麼簡單~ 學習順序永遠都是先官方再秘笈、先基礎在上延伸補強(aka. 工程學習思維)
清楚 Vue.js 的「輪廓」和「基本操作的方式」後,有「需要」(necessity is the mother of invention嘛!)再針對所需之處加深加廣才會是較有效率&符合大腦吸收狀況的學習方式
文章一開始提及的直播,老實說並未帶給我太大實質上的 Vue.js 技能提升,但它提醒了我如何學得聰明(應用工程思維於學習之上)。像是概念的統整,以條列式的形式統整重點
Example:
- data binding 綁定資料
{{ }}
- attribute binding 綁定屬性
v-bind
- conditionals/ loops 條件/迴圈
v-if/ v-for
- 2-way binding 雙向綁定
v-on:click/ v-model
- components 元件
這樣的方式就是一個很優質的知識呈現方式,讓重點概念浮現,次要概念附屬在重點之下(類似DOM tree~)
Basic 的列點結束後,就要針對手上專案或是小成品的功能需求做自我延伸,譬如進階版 Vue.js 的列點可能長這樣(每個人的列點都會有不同):
- template syntax
- class and style binding
- event handling
- components basics
- cookbook
接著再根據列舉主題去深入查資料、試寫,深入其中。這樣才會是較明智&有方向的學習模式
💡統整:
- 強烈學習動機:「想要學」<「需要學」<「必須學」 (無論如何都要秉持著「反覆思考」和「自問自答」原則,去親力親為找尋答案)
- 釐清學習物本體:先去展望要學習的事物的藍圖,不急於在短時間能產出驚人的成果
- 重思考、理解:程式語言太多人懂,會使用框架的人也不計其數,重點是你的「想法」(有想要實踐的草圖)[切莫為學而學 或 純粹為找工作而踏入前端] 和「思維」,盡可能地在學習中反問 2W1H (What/ Why/ How)。這裡奉勸大家不要死背硬記,動腦&理解才是上策
- 框架是為了便利而生,助有想法的各位們一臂之力(省時省事,不再需為無聊細節浪費時間),切勿本末倒置
- 建議:
- 做中學,可能有興趣的領域都嘗試看看
- 不要停留在基礎但也不能因此忽略它的重要性
- 由「結果」學習可能會有意想不到的收穫
程式小白🙆♀️在此與前端之路同道人共勉之💪
__________________________________________________________
假如有人好奇我聽了哪場直播,這裡附上 hyperlink
額外學習資訊參考:Udemy、Github、Youtube tutorial(國內、國外)
如果喜歡這樣的統整,拜託底下留言讓我知道🙏
我會根據留言反應調整之後的文章方向~感恩大家看到這裡!
💃小白下台一鞠躬💃