Formation Formation Svelte : développer des applications web légères, performantes et rapides

Introduction à Svelte et son écosystème

• —Comprendre les frameworks JavaScript : Vue, React, Angular.
• —Positionnement de Svelte : le compilateur, avantages clés.
• —Installation de Node.js et SvelteKit.
• —Création du premier projet Svelte.
• —Structure d'un projet SvelteKit.

Les fondamentaux de Svelte : Composants et Réactivité

• —Anatomie d'un composant Svelte (.svelte).
• —Variables réactives avec `let`.
• —Déclarations réactives avec `$:`.
• —Rendu conditionnel et boucles(`if`, `each`).
• —Passage de props aux composants.

Gestion des événements et liaisons bidirectionnelles

• —Écoute des événements DOM (`on:`).
• —Modificateurs d'événements (`once`, `preventDefault`).
• —Liaisons (`bind:value`, `bind:checked`).
• —Manipulation des événements personnalisés (`createEventDispatcher`).
• —Bonnes pratiques d'organisation des événements.

Le cycle de vie des composants Svelte

• —Comprendre les fonctions de cycle de vie (`onMount`, `beforeUpdate`).
• —Utilisation de `afterUpdate` et `onDestroy`.
• —Exécution de code asynchrone au montage.
• —Nettoyage des abonnements et timers.
• —Scénarios d'application des hooks de cycle de vie.

Stores Svelte : Gestion simple de l'état

• —Introduction aux stores lisibles et inscriptibles (`writable`, `readable`).
• —Comprendre les stores dérivés (`derived`).
• —Abonnement et désabonnement aux stores.
• —Utilisation des stores pour partager l'état entre composants.
• —Bonnes pratiques de structuration des stores.

Transitions et animations avec Svelte

• —Comprendre les animations et transitions par défaut.
• —Utilisation des transitions (`fade`, `slide`, `fly`).
• —Création de transitions personnalisées.
• —Animer des listes (`flip`).
• —Optimisation des performances des animations.

Actions et Attributs avancés

• —Comprendre le concept d'actions Svelte.
• —Création et utilisation d'actions personnalisées.
• —Utilisation des attributs spread (`{...props}`).
• —Slots nommés et slots par défaut.
• —Slots de portée et leurs applications.

Routage et navigation avec SvelteKit

• —Principes du routage basé sur les fichiers.
• —Création de routes statiques et dynamiques.
• —Chargement de données dans les routes (`+page.js`, `+page.server.js`).
• —Navigation programmatique et déclarative.
• —Gestion des erreurs et chargement (`+error.svelte`, `+layout.svelte`).

Formulaires et Interaction Serveur avec SvelteKit

• —Gestion des formulaires HTML standards.
• —Actions de formulaire (`form actions`).
• —Validation côté client et côté serveur.
• —Soumission de données avec `use:enhance`.
• —Intégration d'API externes via les points de terminaison SvelteKit.

Optimisation et déploiement d'applications Svelte

• —Comprendre la phase de compilation de Svelte.
• —Optimisation des performances : lazy loading, tree-shaking.
• —Déploiement d'une application SvelteKit.
• —Pré-rendu et génération de sites statiques (SSR, SSG).
• —Introduction au concept d'adaptateurs pour le déploiement.

Tests et débogage d'applications Svelte

• —Stratégies de test pour les applications Svelte.
• —Introduction aux tests unitaires avec Vitest.
• —Tests de composants avec Testing Library.
• —Utilisation de l'extension Svelte DevTools pour le débogage.
• —Bonnes pratiques de débogage et résolution de problèmes.

Projet Pratique : Construction d'une application complète

• —Conception et architecture d'une application SvelteKit.
• —Application des concepts de composants, stores, routage.
• —Intégration d'éléments UI et UX.
• —Utilisation des actions de formulaire et interaction serveur.
• —Revue de code et meilleures pratiques de développement Svelte.

OPCO

Formations financées via votre opérateur de compétences

FAF

Aide à la formation pour les indépendants

France Travail

Des aides pour les demandeurs d'emploi

Employeur

Votre entreprise peut financer votre formation

FNE-Formation

Un soutien pour les entreprises en transformation

- Connaissances solides en JavaScript (ES6+ recommandé) - Familiarité avec les concepts de développement web (HTML, CSS) - Compréhension de base des outils de ligne de commande

- Un ordinateur avec un système d'exploitation moderne (Windows 10+, macOS 10.15+, Ubuntu 20.04+ ou équivalent) - Accès à une connexion internet stable - Un éditeur de code (VS Code recommandé) - Node.js (dernière LTS) et npm ou Yarn installés - Un navigateur web moderne (Chrome, Firefox, Edge)

5 tests d'évaluation sont proposés à l'apprenant en fin de formation pour connaître son niveau sur chaque compétences visées.

Plateforme et contenus e-learning à disposition. Test de positionnement Quizz & Evaluations

Nous vous recevons lors d’un rendez-vous d’information préalable gratuit et confidentiel en visioconférence pour analyser vos besoins et co-construire votre parcours personnalisé. Chaque demande s’accompagne de la remise d’une convention ou d’un contrat précisant l’ensemble des informations relatives à la formation (Tarifs, calendrier, durée, lieu…). Ce contrat/convention sera transmis électroniquement par email.

A partir de l’accord de prise en charge par le financeur sollicité, le bénéficiaire peut démarrer sous un délai de 11 jours ouvrés. Si vous financez votre parcours de formation par vos propres moyens, alors le délai d'accès est immédiat. Vous pouvez entrer en formation tout au long de l’année.

♿️ Nous accueillons les personnes en situation de handicap. Les conditions d’accessibilité aux personnes handicapées sont inscrites sur le site imi-education.fr, rubrique Accessibilité.

Saskia Cazettes Pour tout renseignement : 07 80 91 06 14 / saskia.c@imi-executive-solutions.com

23 mars 2026

La formation alterne apports théoriques, mises en situation pratiques et échanges entre participants. Chaque concept est directement appliqué via des exercices concrets et des cas réels.

Oui, chaque participant reçoit un support de cours complet (format numérique et/ou papier) qu'il peut conserver à l'issue de la formation.

Certaines de nos formations sont éligibles au Compte Personnel de Formation (CPF). Consultez la fiche formation ou contactez-nous pour vérifier l'éligibilité.

Plusieurs dispositifs de financement existent : CPF, OPCO, plan de développement des compétences, financement individuel. Notre équipe peut vous accompagner dans vos démarches.

Oui, notre équipe reste disponible pour toute question post-formation. Vous bénéficiez également d'un accès à nos ressources en ligne pendant 6 mois après votre parcours.

Cette formation est conçue pour les débutants et les développeurs expérimentés qui souhaitent se lancer dans le développement avec Svelte.

Un ordinateur avec un navigateur web et un éditeur de code, ainsi que Svelte installé sur votre machine.

Oui, un certificat de formation sera délivré à la fin de la session, après avoir réussi l'examen final.

Notre organisme de formation s'engage à accueillir et accompagner les personnes en situation de handicap. Notre référente handicap, Mme Lorène Travaux est disponible pour étudier avec vous les adaptations pédagogiques, techniques ou logistiques nécessaires avant toute inscription. Contactez-nous à hello@imi-executive-solutions.com ou au 06 72 09 69 52.