Création de notre projet VueJS !

Mehdi Ali Benyahia
3 min readJan 18, 2021

--

Bonjour à tous ! C’est parti, nous allons débuter notre projet ! Dans ce post, nous allons créer nos premières pages en VueJS et développer notre site.

Dans le dernier post, je vous ai dit qu’on aller commencer doucement, tout d’abord nous allons créer notre projet en VueJS.

Nous allons installer VueJS en cli nous allons donc utiliser notre terminal.

!! Avant de débuter, je vous conseille de toujours avoir la documentation de VueJS ouverte cela va vous aider en cas de problème !!

Voici le lien : https://v3.vuejs.org/guide/introduction.html

Let’s go !

Vérifions si nous avons la dernière version de npm et node.

À ce jour, ce sont les dernières versions sinon exécutez la commande suivante : npm install npm@latest -g

Avant de créer notre projet VueJS, il faut l’installer. Toujours dans votre terminal exécutez la commande suivante : npm install -g @vue/cli

Tout est installé ? parfait ! On crée notre projet.

Dans votre terminal, vous allez exécuter la commande suivante : vue create « nom de mon application » comme ci-dessous.

Le nom de mon application sera « Instagram »

Ici, nous allons choisir Vue 3 qui est une version plus récente de VueJS. (si vous avez remarqué dans l’URL de la documentation, c’est Vue 3 ��)

C’est bon, vous avez appuyé sur entrée ? Très bien, je vous conseille d’aller vous faire un petit café ou un thé parce que vous allez patienter un peu le temps que votre projet se crée.

C’est bon, vous êtes revenu ? Super alors on reprend !

Une fois votre projet créé voici ce que vous allez avoir

Ici npm nous donne deux indications « cd + le nom de votre projet » qui va servir à aller dans le vôtre projet ensuite « npm run serve » qui va servir à lancer votre projet et le rendre accessible depuis votre navigateur.

Vous allez entrer exactement les commandes que vous affiche votre terminal.

Une fois, cela fait, vous devriez avoir cela.

Allez dans votre navigateur et entre l’url local : http://localhost:8080/

Et voilà BRAVO ! Vous avez créé votre projet en VueJS ! C’est magique non ?

On se retrouve dans le prochain article ou nous allons crée nos premières pages y ajouter des icones !

N’hésitez pas à commenter et partager les articles !

--

--