VT2020-Website-Rendering-Types-Demo: Difference between revisions
(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''', |
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 :
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.