Twoja pierwsza strona

Część sekcji Podstawy Next.js ścieżki React w Coddy. Lekcja 3 z 47.

Czas edytować stronę. app/page.jsx to zwykły komponent React, taki sam jak te, które tworzyłeś(-aś) w całym kursie Fundamentals:

export default function Home() {
    return (
        <main>
            <h1>Welcome!</h1>
        </main>
    );
}

Dwie drobne zasady, które nigdy się nie zmieniają:

Strona musi być domyślnym eksportem pliku: dzięki temu Next.js ją znajduje
Nazwa komponentu zależy od Ciebie; o adresie URL decydują tylko nazwa pliku i folder

Zwróć uwagę, czego brakuje: nie ma rejestracji tras, importów routera ani ReactDOM.render. Piszesz komponent we właściwym pliku i jest to strona.

Wyzwanie

Początkujący

Spraw, aby strona główna witała użytkownika.

W pliku app/page.jsx, wewnątrz <main>, dodaj element <h1> z id="title".
Jego tekst musi być dokładnie taki: Welcome to Next.js.

Spróbuj swoich sił

import './globals.css';

export const metadata = {
    title: 'My App',
};

export default function RootLayout({ children }) {
    return (
        <html lang="en">
            <body>
                {children}
            </body>
        </html>
    );
}