Halaman Pertamamu
Termasuk bagian Dasar-Dasar Next.js dalam perjalanan React di Coddy. Pelajaran 3 dari 47.
Saatnya mengedit sebuah halaman. app/page.jsx adalah komponen React biasa, jenis yang sama dengan yang kamu tulis sepanjang Fundamentals:
export default function Home() {
return (
<main>
<h1>Welcome!</h1>
</main>
);
}Dua aturan kecil yang tidak pernah berubah:
- Halaman harus menjadi default export file tersebut: begitulah Next.js menemukannya
- Nama komponen bebas kamu tentukan; hanya nama file dan folder yang menentukan URL
Perhatikan apa yang tidak ada: tidak ada pendaftaran rute, tidak ada impor router, tidak ada ReactDOM.render. Kamu menulis komponen di file yang tepat, dan komponen itu menjadi halaman.
Tantangan
PemulaBuat halaman beranda mengucapkan halo.
- Di
app/page.jsx, di dalam<main>, tambahkan<h1>denganid="title". - Teksnya harus persis
Welcome to Next.js.
Coba sendiri
import './globals.css';
export const metadata = {
title: 'My App',
};
export default function RootLayout({ children }) {
return (
<html lang="en">
<body>
{children}
</body>
</html>
);
}
Uji dirimuPelajaran ini berisi kuis singkat. Mulai pelajarannya untuk menjawab kuis dan melacak progresmu.
