鐵人檔案
我平常主要使用 Nuxt 做前端開發，但接下來想往 React / Next.js 的職缺挑戰。於是就把鐵人賽當作訓練營，30 天每天記錄學習，邊補基礎、邊實作，也順便整理一些面試常見問題。
內容會從 React Hooks、組件思維一路寫到 Next.js 的路由、SSR/SSG、Middleware，再延伸到部署、SEO，以及面試常問的情境題。文章不會太硬，重點是「邊學邊寫」，就算不是大神，也能和大家一起交流。
希望 30 天後，能把這些筆記變成自己準備面試的武器，也讓同樣在轉換框架或準備面試的朋友有些參考 🙌
學 React 時，大家最常用的 hook 是 useEffect，但有些場景用 useEffect 會出現畫面閃爍，這時候可能useLayoutEffect也...
在 React 中，我們常常需要管理狀態。最常見的 Hook 是 useState，但有時候會聽到「這裡用 useReducer 會比較好」。那麼，這兩個差在哪...
你可能遇過這樣的場景：在 useEffect、setTimeout、或 setInterval 的 callback 裡，讀到的 state / props 好...
在 Day 13，我們學到 每次 render 都會捕捉當下的 props 和 state。這會導致 callback 使用的值是「舊的」，形成 stale c...
React 開發常見的問題是：「我要把 state 放在哪裡？」 一些狀態放在 component 裡（local state）就好。 一些需要跨層級共享，可...
在 React 專案裡，有時候會遇到這種情況：只是一個資料要傳給最底層的子元件，結果中間的好幾層元件都被迫加上 props，明明它們完全用不到這個資料？ 這就是...
你有沒有遇過這種情況：父元件更新後，明明子元件的 props 沒有改變，卻還是跟著重新渲染？這時候，React.memo 就派上用場了。 概念解釋 React....
本文參考自 Dan Abramov 的文章 Before You memo()（Overreacted），並整理成學習筆記。 前言 在 React 中，當我...
本篇內容參考自 Overreacted 網站的 “How Are Function Components Different from Classes?”。...
本篇內容參考自 Overreacted 網站的 "How Does setState Know What to Do?" 在 Class...
