$ 10.00

Tuto Javascript Training Series : Générateur de citations avec JavaScript

$ 10.00

  • Une formation vidéo de 1h02m
  • Téléchargement immédiat et visionnage illimité à vie
  • Satisfait ou remboursé
  • Fichiers sources inclus
  • Découvrez pourquoi vous former avec Tuto.com

Au cours de ce tutoriel 100% Javascript, nous réaliserons un script qui permet de générer une citation aléatoire au clic d'un bouton, mais aussi au chargement de la page. Les citations générées seront toutes accompagnées du nom et d'informations sur l'auteur.

On créera également un bouton qui permet de tweeter la citation sur Twitter, avec un hashtag qui reprend le nom de l'auteur.

Et comme il y a sur Twitter une limite de caractères autorisés, on créera une fonction qui coupera la citation si cette dernière dépasse la limite autorisée.

Au cours de ce tuto Générateur de citations en Javascript, nous verrons :

  • comment travailler avec la console du navigateur,
  • comment travailler avec les tableaux (simples et multidimensionnels
  • comment générer une valeur de type number aléatoire avec l'objet Math, et les méthodes random(), round() et floor()
  • la méthode addEventListener() et l'événement click
  • les méthodes replace(), slice(), et concat()
  • les propriétés length et innerHTML
  • la condition en if, else if, et else
  • comment créer une fonction avec nos propres paramètres

Je reste disponible dans le salon d'entraide et les fichiers sources sont fournies.

Quelques mots sur Javascript Training Series : 
Javascript Training Serie est une série de tutoriels entièrement consacrée au Javascript. L'objectif est de vous aider à progresser en réalisant des exercices concrets
Vous apprendrez à utiliser les propriétés et méthodes Javascript, à créer des fonctions, des conditions, des bouclesécouter des événements, à réaliser vos scripts étape par étape à l'aide de la console du navigateur, et à commenter votre code.
Pour que vous puissiez aussi participer à la réalisation du script, je ne donne pas la solution de manière brutale, j'essaie de vous mettre sur la voie à chaque vidéo.
Dans ces tutos, je n'utilise pas de framework ou librairie, tous les scripts sont réalisés en Vanilla Javascript (Javascript pur).
Pourquoi faire du Vanilla Javascript ? Car une bonne maîtrise du Javascript entraînera une meilleure assimilation des frameworks et librairies (jQuery, Angular, React, Vue ...).
Pour résumer, Javascript Training Serie à pour but de vous rendre meilleur et plus autonome en Javascript.

Table des matières de cette formation JavaScript (durée : 1h02m)

  • On crée le générateur de citations
    • On se pose les bonnes questions et on crée un tableau simple 00:11:31
    • On crée un tableau multidimensionnel 00:08:03
    • On génère une citation aléatoire au chargement de la page 00:06:42
    • On génère une citation aléatoire au clic du bouton 00:07:05
  • On crée une fonction pour partager la citation sur Twitter
    • On crée une fonction pour tweeter la citation 00:10:11
    • On crée une fonction qui coupe une partie de la citation 1/2 00:10:58
    • On crée une fonction qui coupe une partie de la citation 2/2 00:08:07



Formateur : Sébastien Imbert

Sébastien Imbert a publié 23 tutoriels et obtenu une note moyenne de 5,0/5 sur 4 962 tutoriels vendus. Voir les autres formations de Sébastien Imbert

5,0
note moyenne

1
avis laissé
5 étoiles
1
4 étoiles
0
3 étoiles
0
2 étoiles
0
1 étoile
0
  • 5
    avis de komarianne laissé le 23/02/2018
    Encore un excellent tuto de Sébastien. Je me demandais à quoi pourrait me servir un générateur de citations, mais finalement, ce n'est qu'un moyen pour aborder de façon claire et précise les tableaux et la génération d'éléments de façon aléatoire en javascript. Mission accomplie ! Reste à pratiquer pour ne rien oublier... :D

  • Avec quelle version de logiciel ce tuto est-il compatible ?
    JavaScript
  • Quel est le niveau requis pour suivre ce tuto ?
    débutant
  • Que contient le fichier source ?
    Le fichier source contient un dossier "start", qui contient les fichiers html et css, sans le fichier javascript pour que vous puissiez réaliser le script en suivant le tutoriel, ainsi qu'un dossier "end" qui contient tous les fichiers html, css et js.
accédez à plus de 1139 tuto gratuits


non, je ne veux pas me former gratuitement

voir notre politique de protection des données