CATALOGUE Code & Data Formation JavaScript Apprendre Vue JS 3 Créer une Application SPA avec Vue 3 et Vue Router

Créer une Application SPA avec Vue 3 et Vue Router

Création d'une application SPA avec vue-router
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Apprendre Vue JS 3
Revoir le teaser Je m'abonne
Transcription
Cette leçon fait partie de la formation
69,00€ Je commande
Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm
DescriptionProgrammeAvis
Cette leçon fait partie de la formation
69,00€ Je commande
Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

Introduction à la mise en place d'une SPA

Objectifs

Les objectifs de cette vidéo sont :

  • Comprendre le concept de Single Page Application (SPA).
  • Apprendre à utiliser Vue.js 3 et Vue Router pour créer une SPA.
  • Maîtriser la gestion des routes et des composants dans une application Vue.js.

Résumé

Apprenez à réaliser une application Single Page Application (SPA) utilisant Vue 3 et le plugin Vue Router.

Description

Cette leçon vous guide à travers les étapes nécessaires pour créer une Single Page Application (SPA) de base avec Vue.js 3 et Vue Router. Vous apprendrez à :

  • Créer et configurer un projet Vue 3.
  • Utiliser Vue Router pour gérer les routes et les composants.
  • Définir des composants qui représenteront les différentes pages de votre application.
  • Appliquer du CSS pour styliser les liens actifs.

En commençant par la configuration initiale du projet, nous vous montrerons comment inclure Vue Router, définir les routes et les composants, et finalement, comment faire fonctionner la navigation dans votre SPA. Cette leçon intègre des concepts tels que créer un projet, manipuler les routes et gérer les composants. Vous finirez par avoir une application fonctionnelle avec des liens de navigation et un style CSS minimal mais efficace.

Voir plus

Questions fréquentes

Qu'est-ce qu'une Single Page Application (SPA) ?
Une Single Page Application (SPA) est une application web qui fonctionne sur une seule page HTML en chargeant dynamiquement les contenus au fur et à mesure, évitant ainsi de recharger toute la page.
Quel est le rôle de Vue Router dans une application Vue 3 ?
Vue Router est utilisé pour gérer les routes dans une application Vue 3, permettant la navigation entre les différentes vues ou composants sans recharger la page.
Comment CSS est-il utilisé pour styliser le lien actif dans Vue Router ?
Le lien actif est stylisé en utilisant la classe 'router-link-active' que Vue Router ajoute automatiquement au lien actif. Vous pouvez définir le style de cette classe dans votre CSS.

Programme détaillé