React 官方文件中，有條規則明確寫著 "Only call Hooks at the top level"，延伸來說有不少使用 Hooks 的注意事項，例如：不要在 if/else conditions 或 loop 中使用 Hooks。然而，為什麼不能在 conditions, loop 等等情況中呼叫 Hooks 呢？這背後其實與 React Hooks 的資料結構有關，本文將試著閱讀 React Hooks 原始碼來探討這項規則的原因。
在 React Hook 中，處理 Side Effect 最重要的 API 莫過於 useEffect。本文將探討 useEffect 在實務應用的兩大場景「資料獲取 (Data Fetching)」以及「訂閱/取消訂閱外部事件或資源」時，該如何處理才會是相對合理正確的方式，藉此更理解 useEffect 的使用方式。其中也會牽涉到 useEffect 的 dependence 以及 cleanup 運作囉。
JS 原型看似離開發者很遠，實際上很近，因為開發者所使用的原生函式一直都跟 Prototype Chain 有關，此外，Prototype 被污染更是種安全性議題，如果開發上能對原型更理解，就更能避免寫出 anti pattern 的程式碼。
在軟體服務中，如果在錯誤發生時，有良好的錯誤處理與監控的機制，能更快速地查找問題並修復完成，藉此讓使用者困擾的時間下降、體驗更佳。軟體中的錯誤處理範圍涵蓋很大，本文主要分享關於「前端錯誤發生時的處理流程」，包含錯誤畫面的顯示(UI)、錯誤資訊的記錄(Log)、錯誤監控的警告(Alert)。
隨著 React-Redux 版本提升，官方更建議使用 Hooks 的方式，而非過去的 HOC 模式 e.g.`connect`。在本文中，將探討這樣的轉變有什麼好處，以及理解和實作 React-Redux 最重要的 useSelector 和 useDispatch Hooks。
在前端世界中，不常見到單獨使用 Redux，而是 React 與 Redux 共同使用，aka React-Redux。因此在本文中，會探討 React-Redux 的核心部分的實踐，主要聚焦於 Provider 元件與 connect 方法。
這篇文章寫於轉職成前端工程師兩年半後，紀錄些職涯相關思維上的轉變與脈絡，不限於轉職，而是紀錄許多我認為過去的我高估或低估的職涯想法。
前兩篇 Redux 原始碼的文章，實作了 createStore 以及 applyMiddleware 等項目，在這篇文章中，將實作負責整合多個 reducers 的 combineReducers，藉此了解 Redux 是如何實踐這件事。
接續上篇 Redux 系列文章，已實作完 createStore 中的 getState、dispatch、subscribe 後，這篇將進階到實作 Redux middleware 相關的功能，如 applyMiddleware 及 createStore 傳入的 enhancer 等。帶著好奇心，更深入探討 Redux 吧。
很好奇 Redux 是如何在程式中實踐狀態統一控管以及單向資料流的概念，於是決定閱讀 Redux 的原始碼，並解實作基礎的 createStore function，會聚焦在 getState、dispatch、subscribe API。
這篇文章主要紀錄第二份前端工程師求職時所設定的求職條件，以及為什麼設定這些求職條件的詳細原因與反思，最後還有「關於加入新公司一週後再次轉職」的小故事。
學習 JavaScript 執行流程時，會需要深入理解 Event Loop，其中包含 Call Stack、Callback Queue、Macrotasks、Microtasks 等概念，將在本文中整理詳述，期待閱讀完後，能更完整地理解 promise 與 setTimeout 等執行項目混在一起時，誰先執行的相關問題。
在 JS 中 Object 資料型別的複製變數時，是複製地址(address)而非原始值(value)，所以操作複製出的新變數時，容易更動到原始變數，反之亦然，因此容易造成非預期的 Bug 發生。為了解決這類問題，就必須了解 Object 資料型別的兩種拷貝方式：淺拷貝(Shallow copy)與深拷貝(Deep copy)。
在 JS 中，時常會聽到基本型別 (Primitive type) 的變數是 pass by value，物件型別 (Object) 的變數是 pass by reference 的說法，然而當深入查找後，又會發現 pass by sharing，更甚至看到 JS 都是 pass by value，究竟是怎麼回事呢？本文將由記憶體儲存變數的方式、複製變數的方式談起，一步步理解 JS 中的 pass by value、pass by reference 以及 pass by sharing。
在寫 React 時，總是非常順手地使用 JSX 語法，然而用久了總會思考到：究竟 JSX 被編譯後結果為何？背後的 Raw API 為何？JSX 有什麼特色？這些疑問都會在文中探討！
最近在工作時遇到 string 要用 parseInt 還是 Number 轉型的選擇，因此閱讀 ES6 規格與 MDN 的定義，來大致理解 parseInt / parseFloat / Number 三者差異。文中有解釋：為什麼 parseInt(010, 10) 的結果會是 8 的原因。
2019 開始學 JS 時，已經倡導使用 let / const，然而網路上資料常有 var，它們差異在哪？
這篇文章撰寫於我轉職成前端工程師後三個月左右，主要紀錄為什麼轉職成前端工程師，與轉職後是否有期待落差。
這篇文章會說明 float 遇到的問題，以及三種利用「 clear:both 」處理的解決方式。