Sveltekit

Objectifs

- Structurer un projet Sveltekit
- Charger les données d'une page
- Gérer les formulaires
- Créer une API REST simple
- Gérer les erreurs
- Développer une application SvelteKit de l'installation jusqu'au déploiement

Programme de la formation

Jour 1
- Rappels JS
- Définir les variables avec `const` et `let`.
- Déclarer les variables avec la déstructuration.
- Manipuler les tableaux avec `.map` et `.filter`.
- Utiliser `async` et `await` pour gérer les opérations asynchrones.
-Rappels Svelte
- Comprendre la réactivité de Svelte
- Gérer les évènements
- Revoir le principe des stores
- Utiliser les slots
- Premiers pas
- Comprendre l'histoire du web front-end.
- Aborder la définition d'un framework front-end.
- Lister les ressources utiles
- Se lancer avec SvelteKit
- Structurer un projet
- Utiliser `$lib` pour partager des fonctions entre composants
- Routing
- Apprendre à configurer des routes et leur associer des pages spécifiques.
- Mutualiser des éléments d'interface avec les layouts
- Rendre les urls dynamiques
- Chargement de données
- Charger les données d'une page avec la fonction `load`
- Utiliser la fonction `load` pour les layouts
- Gérer les headers et cookies
- Apprendre dans quelles situation utiliser la fonction `load` universelle
- Anticiper le chargement des données au survol
- Stores Kit
- Obtenir des informations sur la page actuelle avec le store `page`
- Utiliser le store navigating pour détecter les actions de navigation.
- Mettre à jour son application chez ses utilisateurs avec le store `updated`
Mise en pratique
- Créer la structure des pages pour l'application
- Définir un layout commun pour partager des éléments d'interface
- Charger les données de la page de liste de Pokémon et détail d'un Pokémon
- Afficher un loader lors de la navigation
Jour 2
- Stratégies de rendu
- Clarifier les différents types de rendu et leurs implications (MPA, SPA, SSR, CSR, ...)
- Utiliser les options de page SvelteKit pour choisir sa stratégie
- Formulaires
- Utiliser les formulaires avec SvelteKit
- Apprendre à distinguer différentes actions utilisateur dans les formulaires.
- Valider un formulaire côté serveur
- Ajouter du progressive enhancement
- API routes
- Créer des endpoints de type GET
- Créer des endpoints de type POST et autres méthodes HTTP
- Erreurs et redirections
- Apprendre à gérer les erreurs et à fournir des réponses appropriées aux utilisateurs
- Créer une page d'erreur
- Gérer les cas d'urgence avec la page d'erreur de secours
- Gérer les redirections
- Déploiements
- Choisir son adapteur de déploiement
- Déployer une application sur Vercel
Mises en pratique
- Créer d'un formulaire d'inscription
- Rendre les pages qui le peuvent complètement statiques
- Sauvegarder son inventaire via la création de endpoints dédiés
- Gérer les erreurs
- Déployer son application sur Vercel

Validation et sanction

Attestation de formation

Type de formation

Non certifiante

Sortie

Sans niveau spécifique