Menu
CoddyTech

Folder app

Termasuk bagian Dasar-Dasar Next.js dalam perjalanan React di Coddy. Pelajaran 2 dari 47.

Buka daftar file. Proyek Next.js memiliki struktur, dan setiap bagiannya memiliki makna:

app/
    layout.jsx     the shell around every page
    page.jsx       the page at /
    globals.css    styles for the whole app

Dua nama file bersifat khusus, dan kamu akan sering menggunakannya:

  • page.jsx: menjadikan folder sebagai URL yang bisa dikunjungi. app/page.jsx adalah halaman beranda, /.
  • layout.jsx: membungkus halaman-halaman di bawahnya. Layout root memuat <html> dan <body>, sehingga setiap halaman menggunakannya bersama.

Nama-nama ini bukan konvensi yang bisa kamu ubah. Next.js mencari nama file yang persis ini. Dengan cara inilah folder berisi file menjadi aplikasi dengan URL.

Tata letak root dikunci dalam pelajaran ini, jadi shell yang rusak tidak akan pernah membuat aplikasimu berhenti. Kamu akan bekerja di app/page.jsx dan file yang kamu tambahkan sendiri.

Coba sendiri

Pelajaran ini tidak memiliki tantangan kode.

quiz iconUji dirimu

Pelajaran ini berisi kuis singkat. Mulai pelajarannya untuk menjawab kuis dan melacak progresmu.

Semua pelajaran di Dasar-Dasar Next.js