NextJS

NextJS est un Framework FullStack basé sur ReactJS, côté serveur et côté client.

NodeJS requis

Création du projet :

npx create-next-app@latest

Eventuellement avec le support typeScript :

npx create-next-app@latest --ts

Démarrage du serveur

cd my-next-app
npm run dev

Avec App router, le routage est basé sur la structure des dossiers à partir de app.

• Chaque dossier représente un segment de route
• Les routes se concrétisent et sont accessibles à partir du moment où elles contiennent le fichier page.jsx/tsx

app/layout.jsx correspond au main layout, et permet de définir la structure de base des pages.

export default function Home({data}) {
  return (
    <>
        <UIList objects={data}/>
    </ >
  )
}

export async function getServerSideProps() {
    const res = await fetch(API_URL)
    const data = await res.json()
    return {
        props: {
            data
        }
    }
}

export default function Home({data}) {
  return (
    <>
        <UIList objects={data}/>
    </ >
  )
}

export async function getStaticProps() {
    const res = await fetch(API_URL)
    const data = await res.json()
    return {
        props: {
            data
        }
    }
}