Créer une application web avec Next.js

Next.js est un framework JavaScript basé sur React pour créer des applications Web.

Installation

Pour créer une application Next.js, exécutez la commande suivante :

yarn add -D next react react-dom

Créez les 2 fichiers suivants :

// pages/index.js

export default () => <p>Hello world</p>;

// pages/_app.js

export default ({ Component, pageProps }) => <Component {...pageProps} />;

Puis ajoutez les commandes suivantes pour utiliser Next.js plus facilement :

npm pkg set scripts.dev="next dev"
npm pkg set scripts.build="next build"
npm pkg set scripts.start="next start"
npm pkg set scripts.lint="next lint"

PS : Exécutez la commande npm init -f si votre fichier package.json n'existe pas.

Une fois installé, vous pouvez démarrer Next.js avec la commande suivante :

npm run dev

Il existe certaines fonctions propre à next.js :

getStaticProps : fonction utilisé pour récupérer du contenu static durant la phase de build
getServerSideProps : fonction utilisé pour récupérer du contenu depuis un serveur
getInitialProps : fonction utilisé pour récupérer du contenu depuis un serveur ou un client

Références :