article(s) dans votre panier VOIR

Afficher un tweet depuis les PROPS

  • Vidéo 19 sur 36
  • 2h55 de formation
  • 36 leçons

Un contenu flash devrait s'afficher ici. Votre navigateur ne comporte pas de plugin flash, ou il ne s'est pas correctement initialisé.

Vous pouvez télécharger le plugin flash depuis le site d'Adobe à l'adresse suivante : http://get.adobe.com/flashplayer/.

Pour accéder à la suite de cette formation, vous devez vous abonner.
previous
summary
resume
next
play
Afficher un tweet depuis les PROPS
00:00 / 07:44
HD
fullscreen
Je m’abonne
à partir de 16,6 € / mois
  • Visionnage en ligne
  • Accès illimité à toutes nos formations
OU
J'achète uniquement
la formation
39,90€
  • Téléchargement + VOD à vie
  • Accès uniquement à cette formation

Sommaire de la formation

Détails de la formation

Dans ce tutoriel en ligne sur ReactJS, le formateur vous montre comment afficher un tweet depuis les PROPS. L’objectif de ce cours est de créer un fichier .js contenant le script qui affiche le tweet. Pour y arriver, vous recourez aux props puis vous intégrez le fichier à l’application. Pour ce faire, vous consultez l’arborescence du projet et dans le répertoire Components vous ajoutez un sous-dossier Tweet. Dans ce dernier, vous ajoutez les fichiers index.js, Tweet.js et le fichier de style Tweet.js. Dans l’index, vous implémentez l’instruction export {default} from ‘./Tweet’ ;. Cette dernière vous permet d’importer le script en tant que dépendance. Quant à l’édition du script, vous l’effectuez dans le fichier Tweet.js. Vous importez d’abord la librairie ReactJS à l’aide de l’instruction import React from ‘react’. Cette action faite, vous intégrez le fichier de style en codant import ‘./Tweet.css’. Suite à cela, vous instanciez une variable objet de propriétés en écrivant const Tweet= props =>() ; et vous entrez le JSX dans la parenthèse. Il est convenable d’utiliser la balise div pour englober le JSX en entier, et vous y éditer le code adapté au tweet. Etant donné que vous utilisez une variable objet de propriétés, la syntaxe du code pour utiliser les propriétés de l’objet se présente comme suit {props.avatar}. Cette instruction stipule que vous souhaitez utiliser les propriétés d’un avatar. Il est à remarquer que le props peut être un lien ou une image ou une donnée exploitable. Dans le cas d’une image, vous l’implémentez dans l’attribut src de la balise img. Vous ajoutez ensuite l’instruction export {default} Tweet ; pour faciliter l’intégration du fichier. Par ailleurs, dans le fichier App.js, vous importez les dépendances nécessaires y compris les scripts par rapport au Tweet en utilisant l’instruction import Tweet from ‘../../components/Tweet’. Pour l’affichage du tweet, l’implémentation du JSX s’effectue à l’intérieur de la variable objet App à l’aide de la balise orpheline Tweet qui est englobé dans la balise div. A cet effet, les attributs de Tweet sont les props. Pour conclure, ce tutoriel vous permet d’afficher un tweet en utilisant les props.