Formation Nuxt

Concevez des applications web réactives avec Nuxt, le framework construit autour de Vue pour lui apporter de toutes nouvelles fonctionnalités.

Durée de formation : 2 jours

Lieux de formation :
  • Strasbourg
  • en intra-entreprise

Public

Cette formation à Nuxt est destinée aux développeurs/intégrateurs qui souhaitent dynamiser leurs sites web ou développer une application web en exploitant toute la puissance du framework et de ses composants.

Objectifs

Être capable de créer et organiser plusieurs composants Vue, de les mettre en oeuvre dans une application Nuxt, de les faire interagir entre eux et partager des données. Connaître les différences de rendu possibles à l'aide du framework. Connaître les avantages de Nuxt et son architecture globale. Être capable d'initialiser une nouvelle application Nuxt et de la déployer en ligne.

Prérequis

Être familier avec HTML, CSS et connaître les notions de base de JavaScript (variables, fonctions, boucles, conditions) ou d'un langage équivalent.

Moyens pédagogiques

Durant chaque formation, les participants et participantes auront l’opportunité de mettre en application leurs apprentissages grâce à de nombreux cas pratiques et exercices. Ces exercices seront ensuite corrigés et explicités par le formateur ou la formatrice. Dans le cas de sessions inter-entreprises, à Strasbourg ou à Paris, la formation est dispensée dans les salles pédagogiques adaptées à des apprentissages informatiques : capacité de 1 à 8 personnes, équipement informatique fourni pour chacun des stagiaires, vidéo-projecteur et paperboard.

Suivi et appréciation des résultats

L'exécution physique de l'action de formation est suivie à l'aide de feuilles de présence émargées par demi-journée par les participants et le formateur. Sanction : attestation de présence et bilan des acquis.

Dernière mise à jour de ces informations :

L'Univers de Nuxt

  • Versions de JavaScript, ECMAScript
  • NodeJS et NPM, Webpack, Babel
  • Import/export de modules
  • Vérifier la syntaxe avec eslint
  • Choisir son éditeur et ses outils

Un nouveau projet Nuxt

  • Initialiser un projet propre
  • Options, dépendances et plugins
  • nuxt.config.js
  • Organiser son projet

Les bases de Nuxt

  • Structure des fichiers .vue
  • Rendu et Virtual DOM
  • Créer des composants réutilisables
  • Réactivité et MVVM
  • Usage de styles CSS et Sass

Composants Nuxt

  • template, script et style
  • États, données (data)
  • Propriétés (props) et méthodes
  • Imbrication de composants
  • Attributs HTML spécifiques à Vue et Nuxt
  • Boucles et conditions
  • Slots
  • Mixins
  • Références (refs)

Cycle de vie

  • Gestionnaires d'événements
  • Propriétés computed et watch
  • Gestion des formulaires (v-model, etc)
  • Hooks
  • Notions de performance

Vuex

  • Vuex et Store
  • Partage de données inter-composants
  • State, getters, actions, mutations
  • L'importance du Store dans une application

Données avancées

  • Utiliser Axios avec une API
  • Promesses, écriture de code asynchrone
  • Chargements avec fetch et asyncData

Magie de Nuxt

  • Routing automatique
  • SSG : génération de site statique
  • SSR : rendu côté serveur
  • Optimisations SEO
  • Balises meta
  • Lazy loading

Travaux Pratiques

  • Réalisation d'une application Nuxt
  • Multi-composants et multi-fonctionnalités
  • Petits défis à résoudre

Besoin d'un financement ?

Une formation est un investissement : pour mieux vous permettre de vous former, des possibilités de financement vous sont proposées dont la prise en charge par votre OPCO.

Voir les différents financements

Avant cette formation, préparez-vous avec :

À la suite de cette formation, nous vous recommandons :

Envie de connaître la date
de nos prochaines formations ?

Calendrier des formations

Nous contacter

Téléphone : 09 54 96 50 50 Adresse e-mail : contact alsacreations point fr

Alsacréations
10 Place du Temple Neuf
67000 Strasbourg, France

En soumettant ce formulaire vous acceptez que les informations saisies soient utilisées pour permettre de vous répondre. Votre e-mail ne sera pas mémorisé pour un autre usage. En savoir plus