CATALOGUE Code & Data Formation Svelte Apprendre Svelte 3 et SvelteKit 1.0

Contenu premium

Découverte du Site Officiel de Svelte

Chapitre 1 Leçon 3

Découvrez les principaux onglets du site officiel de Svelte et apprenez à utiliser les outils mis à votre disposition pour commencer avec ce framework de développement web.

Apprendre Svelte 3 et SvelteKit 1.0

7h42 77 leçons

Guide d'Installation de Visual Studio Code 04:34

Utilisation de l'Extension Emmet dans Visual Studio Code 05:06

Découverte du Site Officiel de Svelte 05:59

Introduction au REPL de Svelte 06:34

Créer et Utiliser des Composants Svelte 04:09

Installation de Node.js et Configuration de Vite 03:48

Créer votre premier projet Svelte avec Vite 06:17

Création d'un squelette Svelte standard 02:50

Guide d'Utilisation des Interpolations dans Svelte 07:46

Exercice Pratique avec Svelte 05:29

Utilisation des Variables Réactives en Svelte 05:02

Liaisons de données avec Svelte : Mono-directionnelles et bidirectionnelles 09:36

Comment faire communiquer des composants Svelte avec des props 07:58

Utilisation d'un Objet JSON pour Passer des Props en React 02:56

Passer des Fonctions Entre Composants dans Svelte 09:08

Utilisation du code HTML dans les variables JavaScript 02:57

Appliquer des Classes CSS Conditionnellement en HTML 04:55

Utiliser les directives IF, ELSEIF et ELSE en HTML 07:17

Utiliser la Directive Each avec Svelte 08:35

Utilisation des Boucles each avec Index dans Svelte 09:34

Parcours d'objets JSON avec une boucle each en JavaScript 02:22

Gestion des Événements en JavaScript avec Svelte 04:00

Gestion des Événements Clavier en Javascript avec Svelte 06:47

Optimisation des gestionnaires d'événements DOM avec des modificateurs 05:43

Explorer les Composants Svelte 08:25

Modularisation avec Svelte: Création de Composants 14:20

Utilisation des Custom Events en Svelte 09:06

Utiliser les Custom Events pour Transmettre des Données entre Composants 03:23

Transmettre des événements personnalisés dans Svelte 09:42

Transmettre des Événements DOM en Svelte 05:46

Introduction aux Slots Simples dans Svelte 07:26

Utilisation des Slots Nommés dans Svelte 03:24

Comprendre les Slots par Défaut dans Svelte 01:28

Utiliser la directive IF pour les Slots en Svelte 05:39

Utiliser conjointement slots et props pour des composants réactifs 03:28

Le Cycle de Vie des Composants Svelte 01:33

Utilisation du hook OnMount dans Svelte avec Axios 12:59

Utilisation des directives Await pour remplacer OnMount 02:26

Intégration de The Movie Database avec Svelte : Un Guide Complet 13:48

Affichage des données de The Movie Database 10:35

Utilisation des Inputs de Type Number en Svelte 02:24

Introduction aux balises input en Svelte 07:09

Tutoriel: Manipuler les Listes Déroulantes avec Svelte 03:47

Gestion des balises Input de type Date, Color, File, DateTimeLocal, Week et Month 03:35

Intégration et Liaison de Formulaires en Svelte 05:13

Création d'une Mini-Application avec HTML et Svelte 12:10

Comment Valider un Formulaire en Svelte 07:14

Introduction aux Stores Svelte 01:14

Utilisation du RateableStore en Svelte 11:22

Développez une Application Svelte de Gestion de Bibliothèque 18:05

Comment éviter les fuites mémoire dans Svelte avec Unsubscribe 04:30

Accéder aux Variables du Store Svelte 01:36

Gérer la suppression de livres dans un store Svelte 06:17

Créer un Store Personnalisé en Svelte 07:13

Implémentation de ReadableStore dans Svelte 09:01

Optimiser les Animations avec Svelte Motion 10:14

Animer une propriété CSS inline avec Svelte Motion 03:41

Guide des Animations Spring 02:31

Animation des Éléments HTML avec Svelte Transition 07:32

Comment désactiver des images dans Svelte avec une animation de sortie 03:41

Gestion des animations dans les balises HTML 03:22

Apprendre à gérer les animations avec Svelte 02:17

Introduction aux Applications Monopages (SPA) 03:07

Utiliser Svelte SPA Router pour les applications monopages 06:21

Passage de Données dans l'URL avec Svelte 04:36

Gestion de la Navigation dans une Application SPA avec Svelte 02:49

Créer une Application SvelteKit de Démonstration 03:01

Structurer un Projet SvelteKit 02:23

Créer un squelette d'application SvelteKit 04:52

Créer et configurer un composant SvelteKit avec un alias personnalisé 07:02

Uniformisation de Mise en Forme avec SvelteKit 08:33

Définir des Styles Globaux avec SvelteKit 02:51

Organiser des pages avec des layouts spécifiques dans SvelteKit 01:03

Charger des Données Asynchrones dans un Composant SvelteKit 03:30

Récupération de données multi-sources avec SvelteKit 03:31

Tutoriel sur le Routage Dynamique avec SvelteKit 14:20

Gestion des Erreurs 404 dans SvelteKit 06:23

Détails de la leçon

Description de la leçon

Le site officiel de Svelte propose plusieurs onglets essentiels pour les développeurs. L'onglet « Tutorials » offre un tutoriel complet pour débuter avec Svelte, organisé en deux volets avec du texte explicatif et du code interactif. L'onglet « Docs » est idéal pour une documentation approfondie, tandis que l'onglet « Examples » permet de voir et de modifier des exemples concrets. L'onglet « REPL » est un environnement de programmation interactif, vous permettant de saisir et d'exécuter du code Svelte immédiatement. L'onglet « Blogs » fournit les dernières nouvelles sur Svelte, classées par ordre chronologique inverse. L'onglet « FAQ » offre des réponses aux questions courantes pour les nouveaux utilisateurs.

Le tutoriel en ligne est interactif et vous permet de voir en temps réel le rendu de votre code. Vous pourrez également accéder aux codes JavaScript et CSS générés. Contrairement à la documentation, plus adaptée aux utilisateurs avancés, le tutoriel pas à pas est parfait pour les débutants. De nombreux exemples et un outil REPL interactif vous permettront de comprendre les capacités de Svelte. Le blog vous tiendra informé des dernières mises à jour, comme la sortie de SvelteKit en version 1.0.

Objectifs de cette leçon

L'objectif est de présenter les différentes ressources disponibles sur le site officiel de Svelte pour permettre aux utilisateurs de commencer efficacement avec ce framework.

Prérequis pour cette leçon

Il est recommandé d'avoir des connaissances de base en développement web, notamment en HTML, CSS et JavaScript, pour tirer pleinement parti de cette vidéo.

Métiers concernés

Les compétences acquises avec Svelte sont utiles pour les métiers de développeur front-end, développeur full-stack, et ingénieur logiciel, notamment pour la création d'interfaces utilisateur performantes.

Alternatives et ressources

Les solutions alternatives incluent d'autres frameworks JavaScript comme React, Angular ou Vue.js, chacun offrant ses propres avantages en termes de performance et de fonctionnalité.

Questions & Réponses

L'onglet « Tutorials » propose un tutoriel interactif et complet pour bien commencer avec Svelte, avec du texte explicatif et du code modifiable.

REPL signifie Read, Eval, Print, Loop. Il s'agit d'un environnement de programmation interactif permettant de saisir et de voir immédiatement le rendu du code Svelte.

L'onglet « Examples » propose de nombreux exemples modifiables de code Svelte pour illustrer les différentes fonctionnalités et possibilités de ce framework.

Acheter maintenant

Je m'abonne

Découverte du Site Officiel de Svelte

Introduction et premiers pas

La syntaxe de base de Svelte

Conditions, boucles et gestion événementielle

Les composants

Slots et Lifecycle hooks

Gestion des formulaires

Les stores de Svelte

Animations et transitions

Une application SPA avec Svelte

SvelteKit