Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
Svelte.js 3 par la pratique
Highest Rated
Rating: 4.5 out of 5(47 ratings)
265 students

Svelte.js 3 par la pratique

Créer des applications légères et performantes avec Svelte.js
Last updated 6/2019
French
French [Auto],

What you'll learn

  • Apprendre à créer des applications légères et performantes avec Svelte

Course content

3 sections51 lectures5h 20m total length
  • Démo de "Switter"2:26
  • Création d'une nouvelle application Svelte.js3:33
  • Structure d'une application Svelte.js5:36
  • Mettre à jour une variable et l'afficher5:58
  • Gérer le 'click' event pour ajouter un nouveau message4:21
  • Parcourir une collection de messages côté template2:46
  • Two-way binding avec bind:value2:46
  • Vider le textearea après soumission1:01
  • Création d'un nouveau component Svelte6:28
  • Passer une prop à un composant enfant2:54
  • Dispatcher un custom event d'un composent enfant vers son parent8:22
  • Ajout d'un input pour l'auteur4:09
  • Gérer le format des dates6:36
  • La réactivité en Svelte5:15
  • Ajouter une class CSS conditionnellement5:10
  • "if" côté template2:21
  • Définir une valeur par défaut1:29
  • Afficher ou masquer un component5:36

Requirements

  • Connaître les fondamentaux de JavaScript et HTML

Description

Svelte n'est pas un framework de plus : c'est un framework ET un compilateur. Il permet ainsi de créer des applications web en créant des components - comme Angular, React ou Vue vous ont habitué à le faire - mais là où Svelte va plus loin, c'est en vous permettant de réduire considérablement la taille du build grâce à sa fonctionnalité de compilateur. Pour le dire vite, Svelte vous permet de créer des composants puis de les compiler en JavaScript pur. Autrement dit, votre build ne contiendra pas de code spécifique au framework Svelte. L'avantage est double :

- vous générez un build (très) allégé

- le navigateur de vos clients aura à télécharger et parser beaucoup moins de code, d'où de bien meilleure performances


Dans cette formation qui va à l'essentiel, vous apprendrez à créer en un temps record vos premières applications Svelte.js.

Le projet 1 baptisé "Switter" est dans l'esprit de "twitter". Il vous permettra d'assimiler les fondamentaux de Svelte tels que :

- création de formulaires

- event listeners

- one-way et two-way binding

- création de components

- communication entre components via props et custom events

- reactivité

- ajout conditionnel de classe CSS

- loops

- affichage conditionnel


A l'issue du premier projet, vous pourrez commencer à créer vos propres petits projets.


Le projet 2 "Gymscheduler", qui vous permettra de créer un programme de musculation sur une semaine. Ce sera l'occasion :

- d'utiliser des lifecycle hooks

- de vous perfectionner sur les formulaires (ajout de menus déroulants)

- d'ajouter dynamiquement d'autres formulaires de personnaliser les saisies utilisateurs

- de pratiquer les fondamentaux du projet précédent (customs events, props ...)


Le projet 3, "Expensetracker" sera un gestionnaire de dépenses. Ce projet sera l'occasion de :

- faire du CRUD vers une base de données Firestore

- faire des requêtes Ajax

- gérer des stores

- d'effecter des animations de données numériques

- d'animer les éléments du DOM pour améliorer l'expérience utilisateur


Svelte est déjà en v3. Il est donc mature, ce qui vous garantira :

- qu'il est opérationnel

- qu'il est là pour durer


Enfin, si vous connaissez déjà un des trois frameworks du moment (Angular, React ou Vue), l'apprentissage de Svelte sera très aisé. Si c'est votre premier framework, cette formation vous permettra de démarrer sur un framework moderne qui monte très fort, tout en vous familiarisant avec les concepts utilisés par les big three (Angular, React et Vue).Cette formation résolument pratique vous rendra la tâche plus aisée encore.


Bienvenue sur cette formation qui vous permettre de devenir opérationnel rapidement en Svelte.js.

Who this course is for:

  • Développeuses et développeurs web en poste, freelances, étudiant(e)s en informatique, autodidactes motivé(e)s