VT2020-Website-Rendering-Types-Demo: Difference between revisions

From air
Jump to navigation Jump to search
 
(17 intermediate revisions by the same user not shown)
Line 1: Line 1:
= Créer une application Next.js =
= Créer une application Next.js =

Ouvrez votre terminal et accédez au répertoire dans lequel vous souhaitez créer l'application.


<br>
<br>
Pour '''créer une application Next.js''', ouvrez votre terminal, accédez au répertoire dans lequel vous souhaitez créer l'application et exécutez la commande suivante :
Pour '''créer une application Next.js''', exécutez la commande suivante :
<pre>
<pre>
npx create-next-app nextjs-blog --use-npm --example "https://github.com/vercel/next-learn-starter/tree/master/learn-starter"
npx create-next-app nextjs-blog --use-npm --example "https://github.com/vercel/next-learn-starter/tree/master/learn-starter"
Line 10: Line 12:


<br>
<br>
Plaçons nous à l'interieur :
Plaçons nous à l'interieur de ce répertoire :
<pre>
<pre>
cd nextjs-blog
cd nextjs-blog
Line 16: Line 18:


<br>
<br>
Ensuite, démarrez le serveur de développement de votre application Next.js
Ensuite, '''démarrez le serveur de développement''' de votre application Next.js
<pre>
<pre>
npm run dev
npm run dev
</pre>
</pre>
Cela lance votre application sur le port 3000. <br>
Cela lance votre application sur le '''port 3000'''. <br>
Allez voir si ça a fonctionné sur votre navigateur : http://localhost:3000
Allez voir si ça a fonctionné sur votre navigateur : http://localhost:3000
<br><br>
Vous devriez avoir une page d'acceuil comme celle-ci :
[[File:Welcome-to-nextjs.png|left|200px|thumb]]
<br><br><br><br><br><br><br><br>

Maintenant essayons d'éditer cette page.
<br><br>
Assurez-vous que la commande 'npm run dev' est toujours en marche.
<br>
Ouvrez le fichier '''pages/index.js''' avec votre editeur de texte préféré.
<br>
Vous pouvez desormais éditer cette page ou même créer d'autres pages.
<br>


= Source =
= Source =

Latest revision as of 07:35, 19 January 2021

Créer une application Next.js

Ouvrez votre terminal et accédez au répertoire dans lequel vous souhaitez créer l'application.


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

npx create-next-app nextjs-blog --use-npm --example "https://github.com/vercel/next-learn-starter/tree/master/learn-starter"

Cette commande utilise l'outil appelé create-next-app, qui amorce une application Next.js pour vous. Vous avez maintenant un nouveau répertoire appelé nextjs-blog.


Plaçons nous à l'interieur de ce répertoire :

cd nextjs-blog


Ensuite, démarrez le serveur de développement de votre application Next.js

npm run dev

Cela lance votre application sur le port 3000.
Allez voir si ça a fonctionné sur votre navigateur : http://localhost:3000

Vous devriez avoir une page d'acceuil comme celle-ci :

Welcome-to-nextjs.png









Maintenant essayons d'éditer cette page.

Assurez-vous que la commande 'npm run dev' est toujours en marche.
Ouvrez le fichier pages/index.js avec votre editeur de texte préféré.
Vous pouvez desormais éditer cette page ou même créer d'autres pages.

Source

https://nextjs.org/learn/basics/create-nextjs-app