Formation Svelte

Apprenez à développer une application de zéro jusqu'à son déploiement grâce au framework Svelte, une alternative aux frameworks React, Vue ou Angular !

Prix (Formation inter-entreprise)

1700€ HT / personne

Durée

3 jours

Dates

Nous pouvons organiser des sessions à d'autres dates ou dans d'autres villes (Bordeaux, Lille, Lyon, Marseille, Montpellier, Nantes, Nice, Paris, Strasbourg, Toulouse...)

Dans l'écosystème Javascript actuel, les frameworks front-end sont devenus indispensables au développement d'une application web. La sainte trinité Vue-Angular-React tient le haut du pavé et domine très largement le secteur.

Mais des enfants terribles commencent à émerger. S'inspirant de ces références tout en remettant en question une bonne partie de leur fonctionnement, ces alternatives proposent une nouvelle vision du développement front-end.

Svelte est le fer de lance de ces alternatives, et repose sur l'idée d'écrire, embarquer et exécuter le strict nécessaire, et rien de plus.

Cette formation Svelte s'adresse à tou·te·s les développeur·se·s ayant de l'expérience sur des frameworks front-end tels que React, Vue ou Angular, souhaitant explorer une nouvelle voie prometteuse dans l'applicatif web client.

À l'issue de ces 3 jours, vous aurez compris comment Svelte compense les limitations des frameworks classiques, et saurez monter les bases d'une application Svelte depuis zéro jusqu'à son déploiement.

Installations nécessaires sur votre machine : Git, Node 10+, un IDE (VSCode, Atom, ...), un navigateur moderne (Chrome ou Firefox). Et vous devez avoir les droits d'administrateur.

Covid-19 : Nous nous adaptons dans ces moments difficiles. Nous avons mis en place des outils permettant l'organisation de formations à distance.

Les objectifs

  • Comprendre comment Svelte se démarque des autres frameworks
  • Repenser la notion de réactivité d'une application
  • Maîtriser la gestion d'une application Svelte du composant jusqu'au déploiement

Pré-requis

  • Etre autonome en Javascript
  • Avoir une expérience avec un framework type React / Vue / Angular
  • Ordinateur portable à apporter

Le programme de la formation Svelte

Jour 1 : rappels et introduction à Svelte

Rappels JS
  • Valeurs et variables
  • Asynchrone
  • ES6+
Démarrer avec Svelte
  • Qu’est ce que Svelte ?
  • Les outils que nous allons utiliser (NPM, Github, Node)
  • Installer Svelte
  • Structure d’une application Svelte
  • Afficher notre première variable
  • La réactivité avec Svelte
  • Les composants
  • Communiquer via les « props »
  • Pour aller plus loin sur le binding
  • Les classes CSS dynamiques

Mise en pratique sur les différentes notions vues

Structure de Code
  • Insérer une structure de code dans le template
  • If, else, else-if
  • Each
  • Await blocks
  • Les clés

Mise en pratique sur les différentes notions vues

Jour 2 : zoom sur les composants, transitions et les stores

Aller plus loin avec les composants
  • Les différents types de composants
  • La communication entre composants
  • Les événements personnalisés
  • Travailler avec les slots
  • Named & default slots
  • Les cycles de vie

Mise en pratique sur les différentes notions vues

Les transitions
  • La direction de transition avec Svelte
  • Ajouter des paramètres
  • Les transitions CSS et JS personnalisés
  • Les événements de transition

Mise en pratique sur les différentes notions vues

Gérer les données via un store
  • Pourquoi un store
  • Les différents types de store
  • Créer un store writable
  • S’abonner à un store
  • Mettre à jour des données du store
  • Les « auto-suscriptions »
  • Comprendre les stores « readable »
  • Le « custom store »

Mise en pratique sur les différentes notions vues

Jour 3 : les tests et les sappers

Tests
  • Tests unitaires
  • Tests d'intégration

Mise en pratique sur les différentes notions vues

Sapper
  • C'est quoi ?
  • Routing
  • Layout personnalisé
  • Rendu côté serveur
  • Prefetch
  • Export statique
  • Déploiement

Mise en pratique sur les différentes notions vues

Télécharger le programme

Le(s) formateur(s)

Romain Crestey

Romain Crestey

Développeur web indépendant, Romain est fan de NodeJS, React/Redux, Typescript, ThreeJS et quelques autres. Auparavant, il était associé-hacker au sein de Ants, et encore avant ça, il était ingénieur en dynamique vibratoire pour l'aéronautique.

Voir son profil détaillé

A propos de Human Coders

Human Coders c'est un centre de formation pour développeurs avec :

  • une certification Qualiopi, indispensable pour que vous puissiez obtenir des aides au financement via votre OPCO
  • de nombreux clients qui nous font confiance depuis des années
  • un manifeste pour garantir des formations à taille humaine, des formateurs passionnés, de véritables workshops...
  • 80 formations au catalogue, 969 sessions depuis nos débuts en 2012 avec une moyenne de satisfaction de 4,6/5
  • la possibilité de vous proposer un accompagnement personnalisé ou du conseil après la formation

Besoin d'aide ?

Vous souhaitez discuter avec nous à propos de votre projet de formation ?
Vous voulez plus d'information sur une formation ou notre fonctionnement ?


Rappel Email

Nos forces

  • Des formations à taille humaine
  • Des formateurs passionnés
  • Des véritables workshop
Accéder au Manifeste

Nos clients

Leboncoin.fr
EADS
La Poste
INRIA
Société Générale
Voyage SNCF

Formation Svelte

Apprenez à développer une application de zéro jusqu'à son déploiement grâce au framework Svelte, une alternative aux frameworks React, Vue ou Angular !

Dans l'écosystème Javascript actuel, les frameworks front-end sont devenus indispensables au développement d'une application web. La sainte trinité Vue-Angular-React tient le haut du pavé et domine très largement le secteur.

Mais des enfants terribles commencent à émerger. S'inspirant de ces références tout en remettant en question une bonne partie de leur fonctionnement, ces alternatives proposent une nouvelle vision du développement front-end.

Svelte est le fer de lance de ces alternatives, et repose sur l'idée d'écrire, embarquer et exécuter le strict nécessaire, et rien de plus.

Cette formation Svelte s'adresse à tou·te·s les développeur·se·s ayant de l'expérience sur des frameworks front-end tels que React, Vue ou Angular, souhaitant explorer une nouvelle voie prometteuse dans l'applicatif web client.

À l'issue de ces 3 jours, vous aurez compris comment Svelte compense les limitations des frameworks classiques, et saurez monter les bases d'une application Svelte depuis zéro jusqu'à son déploiement.

Installations nécessaires sur votre machine : Git, Node 10+, un IDE (VSCode, Atom, ...), un navigateur moderne (Chrome ou Firefox). Et vous devez avoir les droits d'administrateur.

Covid-19: Nous restons ouverts. Cette formation est disponible à distance.

Les objectifs

  • Comprendre comment Svelte se démarque des autres frameworks
  • Repenser la notion de réactivité d'une application
  • Maîtriser la gestion d'une application Svelte du composant jusqu'au déploiement

Pré-requis

  • Etre autonome en Javascript
  • Avoir une expérience avec un framework type React / Vue / Angular
  • Ordinateur portable à apporter

Le programme de la formation Svelte

Jour 1 : rappels et introduction à Svelte

Rappels JS
  • Valeurs et variables
  • Asynchrone
  • ES6+
Démarrer avec Svelte
  • Qu’est ce que Svelte ?
  • Les outils que nous allons utiliser (NPM, Github, Node)
  • Installer Svelte
  • Structure d’une application Svelte
  • Afficher notre première variable
  • La réactivité avec Svelte
  • Les composants
  • Communiquer via les « props »
  • Pour aller plus loin sur le binding
  • Les classes CSS dynamiques

Mise en pratique sur les différentes notions vues

Structure de Code
  • Insérer une structure de code dans le template
  • If, else, else-if
  • Each
  • Await blocks
  • Les clés

Mise en pratique sur les différentes notions vues

Jour 2 : zoom sur les composants, transitions et les stores

Aller plus loin avec les composants
  • Les différents types de composants
  • La communication entre composants
  • Les événements personnalisés
  • Travailler avec les slots
  • Named & default slots
  • Les cycles de vie

Mise en pratique sur les différentes notions vues

Les transitions
  • La direction de transition avec Svelte
  • Ajouter des paramètres
  • Les transitions CSS et JS personnalisés
  • Les événements de transition

Mise en pratique sur les différentes notions vues

Gérer les données via un store
  • Pourquoi un store
  • Les différents types de store
  • Créer un store writable
  • S’abonner à un store
  • Mettre à jour des données du store
  • Les « auto-suscriptions »
  • Comprendre les stores « readable »
  • Le « custom store »

Mise en pratique sur les différentes notions vues

Jour 3 : les tests et les sappers

Tests
  • Tests unitaires
  • Tests d'intégration

Mise en pratique sur les différentes notions vues

Sapper
  • C'est quoi ?
  • Routing
  • Layout personnalisé
  • Rendu côté serveur
  • Prefetch
  • Export statique
  • Déploiement

Mise en pratique sur les différentes notions vues

Télécharger le programme

Le(s) formateur(s)

Romain Crestey

Romain Crestey

Développeur web indépendant, Romain est fan de NodeJS, React/Redux, Typescript, ThreeJS et quelques autres. Auparavant, il était associé-hacker au sein de Ants, et encore avant ça, il était ingénieur en dynamique vibratoire pour l'aéronautique.

Voir son profil détaillé

A propos de Human Coders

Human Coders c'est un centre de formation pour développeurs avec :

  • une certification Qualiopi, indispensable pour que vous puissiez obtenir des aides au financement via votre OPCO
  • de nombreux clients qui nous font confiance depuis des années
  • un manifeste pour garantir des formations à taille humaine, des formateurs passionnés, de véritables workshops...
  • 80 formations au catalogue, 969 sessions depuis nos débuts en 2012 avec une moyenne de satisfaction de 4,6/5
  • la possibilité de vous proposer un accompagnement personnalisé ou du conseil après la formation

* Nombre de personnes ayant répondu au questionnaire de satisfaction sur cette formation depuis 2012