CATALOGUE Code & Data Apprendre Svelte 3 et SvelteKit 1.0 Création d'une Mini-Application avec HTML et Svelte

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

Challenge
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Apprendre Svelte 3 et SvelteKit 1.0
Revoir le teaser Je m'abonne
Transcription

Cette leçon fait partie de la formation
129,00€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

DescriptionProgrammeAvis

Cette leçon fait partie de la formation
129,00€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

Les objectifs de cette vidéo sont de :
- Maîtriser le binding des éléments d'input en Svelte.
- Savoir comment écrire des fonctions événementielles pour manipuler les données d'un formulaire.
- Comprendre la manipulation dynamique des listes déroulantes et des boutons radio en Svelte.

Dans cette vidéo, découvrez comment créer une mini-application en utilisant HTML et Svelte en suivant des instructions précises.

Cette leçon vous guide à travers la création d'une mini-application qui utilise HTML et Svelte. Vous apprendrez à basculer du texte en majuscule, calculer des sommes dynamiques, manipuler des cases à cocher, gérer des boutons radio avec rotation automatique, et afficher des sélections de listes déroulantes. Le processus inclut la déclaration des variables, l'utilisation des bindings, et la définition des fonctions événementielles dans Svelte.

Vous démarrerez par le binding des différents éléments d'input avec les variables correspondantes et verrez comment les utiliser de manière dynamique pour refléter les changements immédiatement à l'écran. Ensuite, vous allez apprendre à écrire des fonctions événementielles pour réaliser des actions comme mettre du texte en majuscule ou faire tourner une sélection de boutons radio avec une rotation cyclique.

Ce tutoriel inclut également des explications sur la création de listes déroulantes dynamiques et l'affichage immédiat de la sélection choisie. Toutes ces pratiques sont accompagnées d'exemples détaillés et de corrections en direct pour faciliter votre compréhension et mise en pratique.

Voir plus
Questions réponses
Comment binder un input texte avec une variable en Svelte ?
Pour binder un input texte avec une variable en Svelte, vous utilisez l'attribut bind:value de la façon suivante : .
Comment créer une fonction pour inverser la valeur d'une checkbox en Svelte ?
Vous pouvez créer une fonction événementielle qui inverse la valeur d'une checkbox en utilisant une notation ECMAScript 6 pour la flèche d'une fonction : checkboxVar = !checkboxVar.
Quelle est la méthode pour faire tourner la sélection de boutons radio ?
Pour faire tourner la sélection de boutons radio, vous pouvez utiliser une fonction qui incrémente la valeur avec un modulo : rad = (rad + 1) % 3.

Programme détaillé