Besoins d'aide ? Posez vos questions sur le Slack : https://goo.gl/U88tW6
Angular est un framewok tendance et très largement utilisé par les développeurs. Je suis là pour vous montrer comment créer un projet Angular avec Angular CLI et comment mettre en place les bonnes pratiques de développement. Cette vidéo est parfaite pour vous si vous souhaitez découvrir ou re-découvrir Angular.
Dans l’épisodes précédent nous avons réalisé ensemble, l’injection dynamique de composants pour afficher different widgets à partir du fichier de configuration à l’aide des variables d’environnement. Si vous n’avez pas encore vu cette épisode, je vous recommande de le visualiser avant de continuer cette vidéo.
Dans cet épisode, nous allons réaliser ensemble notre premier widget réactif qui consommera une API distante. L’API que nous allons utiliser sera celle de giphy, un service d’hébergement de gif animés afin que l’on puisse afficher un diaporama de gif sur une thématique définie.
On pourrait croire qu’il n’y a rien de bien compliqué de réaliser ce type de code mais détrompez vous, le niveau monte encore d’un cran et nous allons avoir besoins d’utiliser de un grand nombre de fonctionnalités Angular comme par exemple, les composants, interfaces, services, variables d’environnement, le service httpClient ainsi que certaines fonctionnalité de la librairie RXJS comme par exemple les observable, les timers ou encore le mapping pour développer un code se basant sur la philosophie “réactive”.
Cette fois encore, il va falloir être particulièrement attentif. Allez, installez-vous, on démarre tout de suite !
----------------------------------------------------
Liens utiles :
Giphy : https://giphy.com/
GIPHY for Developers : https://developers.giphy.com
Design pattern Observer = https://fr.wikipedia.org/wiki/Observa...)
RxJS : https://reactivex.io/rxjs/
----------------------------------------------------
Autres épisodes :
Angular 5 [ep1] Environnement de développement
• Angular 5 [ep1] Environnement de développe...
Commit git : https://github.com/MikhaelGerbet/dash...
Angular 5 [ep2] Le Git flow
• Video
Angular 5 [ep3] Le cycle d’intégration continue
• Angular 5 [ep3] Le cycle d’intégration con...
Angular 5 [ep4] Le code coverage
• Angular 5 [ep4] Le code coverage avec Cove...
Angular 5 [ep5] Le code review
• Angular 5 [ep5] La revue de qualité de cod...
Angular 5 [ep6] Le code review
• Angular 5 [ep6] Les tests de vulnérabilité...
Angular 5 [ep7] Le déploiement sur Github pages avec Travis
• Angular5 [ep7] Déploiement sur Github page...
Angular 5 [ep8] Le préprocesseur CSS avec Sass
• Angular 5 [ep8] Le préprocesseur CSS avec ...
Angular 5 [ep9] Etendre Sass avec Bourbon
• Angular 5 [ep9] Etendre Sass avec Bourbon
Angular 5 [ep10] Etendre Sass et le responsive avec Bootstrap
• Angular 5 [ep10] Etendre Sass et le respon...
Angular 5 [ep11] Les préfixes CSS avec Autoprefixer & Browserslist
• Angular 5 [ep11] Les préfixes CSS avec Aut...
Angular 5 [ep12] Les polices d'écriture et d'icones avec Font awesome, Flaticon et google fonts
• Angular 5 [ep12] Les polices d'écriture et...
Angular 5 [ep13] Formater son code automatiquement avec Prettier et Pretty quick
• Angular 5 [ep13] Formater son code automat...
Angular 5 [ep14] Qu'est ce qu'un Component ?
• Angular 5 [ep14] Qu'est ce qu'une Component ?
Angular 5 [ep15] Qu'est ce qu'un Module ?
• Angular 5 [ep15] Qu'est ce qu'un Module ?
Angular 5 [ep16] Qu'est ce qu'une Directive ?
• Angular 5 [ep16] Qu'est ce qu'une Directi...
Angular 5 [ep17] Qu'est ce qu'un Pipe ?
• Angular 5 [ep17] Qu'est ce qu'un Pipe ?
Angular 5 [ep18] Qu'est ce qu'un Service ?
• Angular 5 [ep18] Qu'est ce qu'un Service ?
Angular 5 [ep19] Les routes : Redirection & 404 personnalisée
• Angular 5 [ep19] Les routes : Redirection ...
Angular 5 [ep20] Grid responsive avec Gridster
• Angular 5 [ep20] Grid responsive avec Grid...
Angular 5 [ep21] Les variables d'environnement
• Angular 5 [ep21] Les variables d'environne...
Angular 5 [ep22] Injection dynamique de component
• Angular 5 [ep22] Injection dynamique de co...
Angular 5 [ep23] Développement de composants réactifs avec RXJS
• Angular 5 [ep23] Développement de composan...
----------------------------------------------------
Comme toujours, ce tutoriel est gratuit.
Chaque tutoriel sur ma chaîne est gratuit, fait avec ❤ et beaucoup de travail, donc n'oubliez pas de laisser un Like .. :)
----------------------------------------------------
Rejoignez-moi sur les réseaux sociaux.
Linkedin: https://goo.gl/MTaQxr
Github: https://goo.gl/waH8K7
Chaîne YouTube: https://goo.gl/JHzcEX
Slack DahshingJS2 : https://goo.gl/U88tW6
----------------------------------------------------
Pour me contacter, écrivez-moi:
[email protected]
----------------------------------------------------
Merci d'avoir regardé cette vidéo, abonnez-vous à la chaîne pour rester informé des prochains tutos !