La tua prima pagina

Fa parte della sezione Nozioni essenziali di Next.js del percorso React di Coddy. Lezione 3 di 47.

È ora di modificare una pagina. app/page.jsx è un normale componente React, dello stesso tipo di quelli che hai scritto in tutto il corso Fundamentals:

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

Due piccole regole che non cambiano mai:

La pagina deve essere l’esportazione predefinita del file: è così che Next.js la trova
Il nome del componente lo scegli tu; solo il nome del file e la cartella determinano l’URL

Nota cosa manca: nessuna registrazione di route, nessun import di un router, nessun ReactDOM.render. Scrivi un componente nel file giusto e sarà una pagina.

Sfida

Principiante

Fai in modo che la pagina iniziale saluti.

In app/page.jsx, all'interno di <main>, aggiungi un <h1> con id="title".
Il suo testo deve essere esattamente Welcome to Next.js.

Provalo tu

import './globals.css';

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

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