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.

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
  • Apporter un ordinateur portable avec les droits administrateurs
  • Avoir installé sur votre machine : Git, Node 10+, un IDE (VSCode, Atom, ...), un navigateur moderne (Chrome ou Firefox)

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)

Jonathan Barthélémy

Jonathan Barthélémy

Consultant spécialisé dans les technologies du web utilisant Javascript (Vue.js/Nuxt, Node.js, Angular, React).

Après des débuts en tant que développeur dans plusieurs types d'entreprises, Jonathan délivre, depuis maintenant 4 ans, son expertise pour différents clients à travers la formation et l'accompagnement des équipes techniques dans leurs transformations numériques.

Voir son profil détaillé

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 (http://weareants.fr), et encore avant ça, il était ingénieur en dynamique vibratoire pour l'aéronautique.

Voir son profil détaillé

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

FNAC
Alcatel
Voyage SNCF
BNP Paribas
Société Générale
Decathlon

Nos formations en images

Angular
Ruby
CasperJS
DevOps avec Chef

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.

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
  • Apporter un ordinateur portable avec les droits administrateurs
  • Avoir installé sur votre machine : Git, Node 10+, un IDE (VSCode, Atom, ...), un navigateur moderne (Chrome ou Firefox)

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)

Jonathan Barthélémy

Jonathan Barthélémy

Consultant spécialisé dans les technologies du web utilisant Javascript (Vue.js/Nuxt, Node.js, Angular, React).

Après des débuts en tant que développeur dans plusieurs types d'entreprises, Jonathan délivre, depuis maintenant 4 ans, son expertise pour différents clients à travers la formation et l'accompagnement des équipes techniques dans leurs transformations numériques.

Voir son profil détaillé

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 (http://weareants.fr), et encore avant ça, il était ingénieur en dynamique vibratoire pour l'aéronautique.

Voir son profil détaillé

Suivi de formation en option

A l'issue de la formation, nos formateurs peuvent aussi intervenir pour vous accompagner dans la mise en application des compétences acquises :

  • en répondant à vos questions lors de rendez-vous téléphoniques réguliers
  • en étant présents physiquement à l'amorce du projet
  • en réalisant un audit de vos pratiques quelques semaines/mois après la formation

Cette idée vous intéresse ? Faîtes-le nous savoir pour que nous trouvions la formule adaptée à votre situation.