Open3
Learn Next.jsをやる
bani24884先日のNext.js Confで発表されたApp Router対応のチュートリアルをやっていきます。
以下の項目が学べるらしい。
- The Next.js App Router
- Styling and Tailwind CSS
- Optimizing Fonts and Images
- Creating Layouts and Pages
- Navigating Between Pages
- Setting Up Your Postgres Database
- Fetching Data with Server Components
- Static and Dynamic Rendering
- Streaming
- Partial Prerendering (Optional)
- Adding Search and Pagination
- Mutating Data
- Handling Errors
- Improving Accessibility
- Adding Authentication
- Adding Metadata
bani24884Chapter 1 Getting Started
環境構築からローカルサーバーの起動までをやった。
チュートリアル上に記載はないが、nodeのバージョンが以下に指定されているので注意。
System Requirements:
- Node.js 18.17 or later.
- macOS, Windows (including WSL), and Linux are supported.
bani24884Chapter 2 CSS Styling
以下の方法でスタイルの適用方法を学んだ
- Tailwind
- CSS module
またclsxという条件によって適用するcssを変えるライブラリが紹介された。使ってみよう。