Comment configurer un projet Next.js dans Ubuntu

Next.js est un framework bien connu pour React qui vous aide à créer des sites Web rapides et modernes, faciles à utiliser et dotés de fonctionnalités puissantes telles que le rendu côté serveur, la création pages statiques et création d'API.

Si vous souhaitez démarrer un projet Next.js sur vos systèmes basés sur Ubuntu, ce guide vous guidera tout au long du processus, étape par étape.

Conditions préalables

Avant de commencer à configurer un projet Next.js, vous devrez installer quelques éléments sur votre système Linux, notamment :

• Node.js : Next.js est construit sur Node.js, vous devez donc avoir Node.js installé.
• npm : npm (Node Package Manager) est utilisé pour gérer les packages et les dépendances de votre projet.

Passons en revue le processus d'installation de Node.js et de npm.

Étape 1 1 : Installez Node.js et NPM sous Linux

Avant d'installer un nouveau logiciel, c'est une bonne idée de mettre à jour votre liste de packages pour vous assurer que vous installez la dernière version du logiciel disponible dans les référentiels.

sudo apt update

Ensuite, vous pouvez installer Node.js (installe également npm), ce qui est préférable pour installer la version de Node.js marquée comme LTS (Long-Term Support), car il s'agit de la version la plus stable et la plus utilisée.

sudo apt install nodejs

Une fois l'installation terminée, vérifiez que Node.js est correctement installé en vérifiant sa version :

node -v
npm -v

Vous avez maintenant Node.js et npm installés sur votre système.

Étape 2 : installer et configurer le projet Next.js

Maintenant que Node.js et npm sont installés, il est temps de créer un nouveau projet Next.js. Le moyen le plus simple d'installer Next.js consiste à utiliser create-next-app, qui est un package officiel fourni par l'équipe Next.js. .

sudo npm install -g create-next-app

Maintenant que create-next-app est installé, vous pouvez créer un nouveau projet Next.js.

npx create-next-app@latest my-next-app

Ici, my-next-app est le nom du dossier de votre projet. Vous pouvez le remplacer par le nom de votre choix. La commande npx téléchargera et exécutera le package create-next-app, et configurera un nouveau projet Next.js pour vous.

Une fois l'exécution de la commande terminée, vous aurez un nouveau dossier appelé my-next-app avec la structure de base d'une application Next.js.

Étape 3 : Exécutez votre projet Next.js

Une fois le projet créé, allez dans votre dossier de projet et démarrez le serveur de développement :

cd my-next-app
npm run dev

Cette commande démarrera le serveur de développement Next.js. Par défaut, le serveur fonctionnera sur http://localhost:3000.

Ouvrez votre navigateur et accédez à cette URL. Vous devriez voir la page d'accueil Next.js par défaut.

Vous pouvez commencer à créer de nouvelles pages dans le dossier app. Par exemple, créez un nouveau fichier about.js dans le répertoire app pour créer une page À propos.

Conclusion

Vous avez configuré avec succès un nouveau projet Next.js sur votre machine Ubuntu ! Vous pouvez maintenant commencer à créer votre application Web en ajoutant de nouvelles pages, composants et fonctionnalités.

Next.js facilite la création d'applications Web modernes. Grâce à ce guide, vous avez appris à installer et à configurer un projet Next.js.