系列文章
Day01 - 系列文介紹、規劃
前言 大家好，我是 Leo，這是我第一次參加 IT 鐵人，心裡滿是期待。過去只有在 Medium (筆名 Airwaves) 上經營自己的技術部落格，每年到了...
Day02 - 為什麼你需要 Next.js ?
為什麼你需要 Next.js ? 對於工程師來說選擇用什麼樣的技術，背後都是取決於商業策略需要什麼，以常見的 SSR (Server Side Renderi...
Day03 - 深入淺出 CSR、SSR 與 SSG
前言 在這篇文章中，我們來聊聊 CSR、SSR 與 SSG 的不同，這三者皆是現今常被提到的網頁技術，而 Next.js 同時支援了這三種技術，我們可以在不同的...
Day04 - Next.js 的 file-based routing
Page Next.js 的 routing 跟一般常見的 react + react-route-dom 的組合不太一樣，是採用 file-based rou...
Day05 - 使用 Link 實作換頁
Link 在了解了 Next.js 的三種路由方式後，接下來就讓我們來聊聊怎麼在 component 切換頁面吧！ 在 Next.js 中切換頁面是用 clie...
Day06 - 用 Next.js 做一個簡易產品介紹頁，使用 file-based routing
前言 在前幾篇文章中，我們瞭解了 Next.js 的 file-based routing 機制，知道了三種不同的 routing 模式，並且也知道要怎麼使用...
Day07 - 在 Next.js 中使用 pre-rendering (getStaticProps) — Part 1
前言 Next.js 的 pre-rendering 實作是這個框架的一大賣點，在 Next.js 中的 pre-rendering 有兩種實作方法，一個是 S...
Day08 - 在 Next.js 中使用 pre-rendering (getStaticProps) — Part 2
前言 在前一篇文章中，我們暸解了如何使用 getStaticProps 讓 Next.js 可以在打包階段產生靜態的 HTML 檔案，讓使用者在瀏覽指定網站時，...
Day09 - 在 Next.js 中使用 pre-rendering (getServerSideProps)
前言 Next.js 的 pre-rendering 分成兩種形式，一種是 SSG (Static Side Generation)，另一種是 SSR (Ser...
Day10 - 為什麼官方不推薦使用 getInitialProps
getInitialProps 是較為老舊的 API Next.js 9.3 版本後，官方釋出了兩個新的 API 分別為 getStaticProps 與 ge...