Next.js: Fullstack dalam Satu Proyek

Yang akan kamu pelajari

• Membuat route, layout, dan halaman bersarang dengan App Router
• Menentukan dengan tepat apakah sebuah component milik server atau client
• Mengambil data di server dan mengalirkannya ke browser
• Mengubah data dengan Server Action, termasuk validasi dan penanganan error
• Menjelaskan apa yang di-cache, berapa lama, dan cara menginvalidasinya

Pelajaran

1. 01

   Routing dengan App Router

   Folder adalah URL. Layout, page, segment dinamis, dan file-file dengan nama khusus.

   Baca 30 menit
2. 02

   Server Component dan Client Component

   Keputusan paling penting di aplikasi Next.js, dan arti sebenarnya dari `"use client"`.

   Baca 32 menit
3. 03

   Mengambil data di server

   Component async, bicara langsung ke database, dan tidak pernah mengirim rahasia ke browser.

   Baca 28 menit
4. 04

   Loading state, streaming, dan Suspense

   Tampilkan halaman sebelum bagian yang lambat siap, alih-alih spinner menutupi semuanya.

   Baca 25 menit
5. 05

   Mengubah data dengan Server Action

   Function yang jalan di server, dipanggil dari sebuah form. Plus validasi yang tidak boleh kamu lewatkan.

   Baca 32 menit
6. 06

   Route Handler: membangun HTTP API

   Kapan kamu butuh endpoint sungguhan alih-alih action, dan cara menulisnya dengan benar.

   Baca 25 menit
7. 07

   Caching dan revalidation

   Bagian yang membingungkan semua orang. Apa yang di-cache, di mana, dan cara menyegarkan data usang.

   Baca 32 menit
8. 08

   Penanganan error, not-found, dan metadata

   Gagal dengan elegan, dan dasar-dasar SEO yang selalu ditanyakan ke developer CMS.

   Baca 25 menit
9. 09

   Proxy: kode yang jalan sebelum setiap route

   Redirect, routing bahasa, dan gerbang autentikasi — file yang dulu bernama middleware.

   Baca 22 menit