收穫, 不止 React.js
我是在 ASTRO camp 的分組專案第一次碰到 React.js,那時候是在實作前後分離的專案,而前端我們選擇用 React.js 來開發,在沒有上過課的狀態下,只好自己摸索這陌生的框架,卻不知不覺地在實作上喜歡上用 React.js 來開發。因為 React.js 帶來的便利性真的太多了,例如採用 functional programing,讓程式碼好閱讀和維護。
基礎到進階,一網打盡
在還沒找到工作前就覺得學會 React.js 是一件重要的事,便再次報名五倍紅寶石的 React.js 全攻略 - 入門到進階。奶綠茶老師是業界非常資深的前端工程師,在這邊最常聽到的就是:「這題我面試一定會考!」事實上,老師講得真的就是業界需要具備的即戰能力。
而我覺得在這邊學扎實的基礎功並具備進階自學的能力,這是一門讓前端開發者可以從 junior 成為 senior 的修煉課,而老師會時不時帶入 JavaScript 的基礎概念,讓你溫故知新,知其所以然。
const [count, setCount] = React.useState(0);
React.useEffect(() => {
setCount(count + 1);
}, []);
// 像是如果要達成每次執行都要上個數字加一,以上寫法就是錯誤的,錯在閉包,要改成以下寫法
React.useEffect(() => {
setCount((prev) => {
return prev + 1;
});
}, []);
其實任何框架都離不開 JavaScript 的核心觀念,若老師能一起帶入講解,那就能串連並吸收得更完全,再加上老師在 code 上對自己非常要求 (code潔癖?),所以他會不斷地強調他寫 code 的經驗談,還有各種 React.js 新手或是工作多年的開發者會踩到的地雷!在五倍真的可以吸取更多業界資深工程師的團隊協作經驗,以及業界的第一手消息,這都是自學不曾獲得的收穫。
學 React.js 遇到什麼困難
自己在觀念還不清楚的時候常常會遇到自己無法預期的事件,像是剛認識 React 的我也曾犯了以下的錯:
const Example10 = () => {
const [list, setList] = React.useState(["Ted", "要", "學會"]);
const atAddClick = () => {
list.push("React");
// 這邊的setList無效,因為這邊的帶入值list與第二行的list為相同的記憶體空間,故雖然上一行有用push增加值,但React只要是同一個記憶體空間就不會觸發rerender
setList(list);
};
};
又或是效能上遇到很多瓶頸,因為對觀念不熟或者因為經驗不足,導致很多地方沒有注意到,很多時候都會感到非常無奈,常常在同一個 bug 卡很久,而上網查了非常多資料但都沒有命中重點,最後乾脆就用暴力解決,導致最後的專案有些地方都有效能上的不足,之後面試時也常常就被問起這些狀況該怎麼解決?
來到五倍,聽了奶綠茶的課,才有種豁然開朗的感覺,很多的 bug 都是源自於基礎的不穩,在聽課時,我常有種感覺自己正站在奶綠茶老師肩膀看事情,角度反而更宏觀和多元了!
React.js 上課模式
奶綠茶老師的上課方式由淺入深,基本上都是從觀念入手,老師也很歡迎同學們直接在上課時舉手問問題,在課間因為我有做過專案踩雷的經驗,當下我有滿肚子的疑惑,而老師也不吝解釋,這也是我喜歡五倍的課程的原因,每個老師都提倡有問題就要馬上問,能馬上解決問題讓我很心安。
除此之外,除了讓我們自己把功能寫出來之外,老師還會提供他的程式碼範例,讓我們可以從老師的 Code 去真的認識到正確的寫法跟觀念,老師更會導入大量業界使用情境,聽起來更具體,學習起來也特別有感覺,對於新手來說是非常實用的上課模式,至少我收益良多。
謝謝奶綠茶老師的協助,讓我在面試的時候有好表現
我在面試時只要提到我會 React.js 方面的技能,就會被問到相關的觀念及技術題,通常問題都是觀念導向的,在這方面我也很慶幸能跟到奶綠 React.js 的課,在面試時,能有不錯的發揮。我更相信我在這裡收穫,不僅僅只是 React.js,更是 JavaScript 基礎功的提升,完課之後我終於可以更有信心地繼續我 的 React.js 之旅了。
最後,如果想要更加瞭解 React.js,真的推薦五倍紅寶石的 React.js 全攻略 - 入門到進階,相信我,你一定會在課堂間得到受用無窮的收穫。
👩🏫 課務小幫手: ✨ 想掌握 React.js 觀念和原理嗎? 我們有開設 📒 「React.js 全攻略 - 入門到進階」課程唷 ❤️️