Angular 2+ par la pratique
Maîtrisez la nouvelle version du framework Angular 2
Voir la bande annonce
Quel est le principe de cette formation ?
Nous allons travailler côte à côte pendant une journée, à créer une application de randonnées, afin de changer de l'habituelle "todo list".
A l'issue de cette demi-journée ensemble, vous aurez appris à :
- créer une Single Page Application (SPA) donnant donc l'illusion de comporter plusieurs pages (comme c'est le cas de "gmail" par exemple)
- créer un système de routage via des urls "simples" et des url qui comportent un paramètre (permettant afficher le détail d'une randonnée)
- requêter un service web distant grâce à un "Observable" et son "subscriber"qui, vous le verrez, sont bien plus que les remplaçants des promises
- développer votre propre système de recherche grâce à un filtre que nous créerons de A à Z (ce qu'on appelle un "custom pipe" dans le monde d'Angular 2)
- créer un formulaire, mais surtout gérer la validité de chaque champ, puis la validité du formulaire dans son ensemble (avec ajout conditionnel de classes CSS, activation/désactivation de bouton de soumission ... etc ...)
- savoir créer des animations sans recourir à des librairies externes
- intégrer des librairies externes dédiées à Angular 2 telles que angular2-google-maps
A l'issue de cette formation, vous pourrez en toute confiance vous lancer dans la création de vos propres applications web Angular 2 ou intégrer une équipe qui utilise le framework Angular 2.
Quels seront les points techniques abordés ?
D'un point de vue technique vous apprendrez à :
- créer une application comportant d'abord un seul module (pour raisons pédagogiques) puis plusieurs modules car vous travaillerez plus souvent sur des applications architecturées de la sorte
- créer des modules comportant components, pipes et services
- maîtriser les quatre formes de data binding (du template vers votre code et inversement)
- faire communiquer des components de parent vers enfant et d'enfant vers parent (oui, Input et Output decorators seront de la partie)
- créer des routes simples puis avec paramètres, redirection et catch all (pour vos 404)
- créer des services et les injecter, occasion idéale de comprendre et de mettre en oeuvre l'injection de dépendance
- effectuer des requêtes http et comprendre les fondamentaux du "reactive functional programming" avec une mise en oeuvre concrète via RxJS (création d'un observable, abonnement, utilisation des opérateurs qui vont serviront dans tous vos projets)
- comprendre et savoir utiliser les pipes fournis par Angular 2 mais surtout créer votre propre "pipe"
- créer des animations à l'aide de triggers, states, transitions, keyframes
- utiliser Google Maps d'une façon propre à Angular 2. Concrètement, nous mettrons en oeuvre l'import d'un module, puis l'utilisation d'input et d'output decorators qui vous permettront d'ajouter une carte à une application web Angular 2, de créer des markers, de gérer les events émis dans une google map
Pas de blabla inutile
15 minutes indispensables en début de formation pour vous aider durant l'installation et l'initialisation d'un nouveau projet.
Attention, ce n'est pas un film : la passivité et les popcorns ne vous rendront pas service (les pop corns à la rigueur mais préférez les fruits). Car même si la formation peut être suivie en une demi journée, comptez au moins une demi journée de pratique personnelle de plus, voire deux afin d'acquérir le savoir faire de tout ce qui est couvert.
A qui est destinée cette formation ?
J'ai pensé à vous, développeuses/développeurs ou étudiant(e)s qui ont peu de disponibilité le soir et le week-end. Je vous ai donc épargné les détours qui vous auraient fait perdre votre temps. Tout comme vous, je consacre chaque année temps et énergie à la veille techno. Et quand il s'agit d'apprendre un framework, je recherche en priorité - pour ne pas dire exclusivement - les formations qui me permettent d'avoir au final une application qui marche, plutôt que des cours magistraux ou des petits bouts d'exemple sans lien les uns avec les autres. C'est cette approche concrète qui a servi de fil directeur à la création de cette formation. J'ai conscience qu'il faut pouvoir s'interrompre fréquemment quand les obligations pro, scolaires ou personnelles l'exigent. C'est pourquoi chaque vidéo dure de 2 à 10 minutes (souvent 5) pour vous permettre de pratiquer par petites doses si vous n'avez que 15 minutes de veille techno à consacrer en soirée ou pendant la pause déjeuner.
Quels sont les pré-requis
- avoir déjà créé une application web comportant HTML et CSS. Si vous savez faire une requête AJAX ou consommer un web service, c'est encore mieux
- avoir des bases en JavaScript, si possible dans sa version ECMAScript 2015 (mais je vous détaillerai les nouveautés d'ES 2015 lorsque je les utiliserai). TypeScript sera présenté au fil de l'eau et ne vous posera donc aucun problème, même si c'est la première fois que vous vous y mettez. A condition, de nouveau, de connaître les bases du JavaScript qu'un développeur web connaît généralement (les types, les fonctions, les propriétés ...)
- avoir un peu pratiqué Twitter Bootstrap. Mais si vous avez des bases en CSS et savez ce qu'est une classe CSS et comment l’ajouter à tag HTML, ça devrait bien se passer
Nota: il n'est ABSOLUMENT PAS nécessaire de connaître AngularJS (la version précédente d'Angular) tant AngularJS et Angular 2 sont différents.
Outre les pré-requis ?
Bien à connaître au préalable, mais pas obligatoire :
- quelques lignes de commandes dans une console (en gros, ne pas être allergique aux lignes de commandes)
- npm et node.js
- connaître un langage orienté objet. Peu importe que ce soit C#, Java ou Python. En gros, être familier des concepts de classe, méthodes, interfaces. Si generics et decorators vous parlent, c'est encore mieux mais pas indispensable
- avoir joué avec un framework JavaScript moderne (AngularJS, React/Reduc, Meteor ...) ou au moins un framework MVC moderne
Si vous déjà une première expérience en Angular 2 ou 4 ?
Si modules, components, services et pipes vous sont déjà (très) familiers, vous pouvez aller plus loin avec 5 mini projets pour se perfectionner sur Angular 2
Votre formateur
Développeur web depuis 2003 dans des entreprises clientes publiques (SNCF, URSSAF, EDF...) et privées (Iron Mountain, Jouve, CDiscount...), dirigeant de la société rennaise Code Concept spécialisée en formation JavaScript Front, Back et mobiles hybrides, Samir Medjdoub a eu comme comme fil conducteur la conscience qu’il est bien plus facile de rester sur la vague que de tenter de remonter après s’être laissé submerger. Fidèle à cette stratégie, il a ainsi pris la vague Angular 2 dès les versions bêta en 2015, celle de Node.js il y a sept années de cela et a eu la chance d'évoluer dans des sociétés qui avaient été parmi les premières en France à adopter MongoDB, conjointement aux bases de données relationnelles. Il a toujours cru que comparaison était raison et a porté une égale attention à React et Redux dès 2015, puis Vue.js en 2016. Meteor et désormais Svelte.js sont les outsiders qui retiennent régulièrement son attention.
Les développeuses et développeurs JavaScript (Front, Back ou Fullstack !) ont de très beaux jours devant eux : les formations de la société Code Concept vous aideront à investir efficacement dans les frameworks, plateformes et librairies JavaScript qui vous ouvriront de belles opportunités en 2020.
Programme de la formation
Installation du start kit Angular 2 et architecture
Valable dans
jours
jours
après votre inscription
Prendre en main le framework en modifiant l’existant
Valable dans
jours
jours
après votre inscription
Passer à la vitesse supérieure en créant module, component et service
Valable dans
jours
jours
après votre inscription
FAQ (questions fréquentes)
Quand débute le cours ? Quand s'achève-t-il ?
Dès maintenant. Il sera en outre mis à jour régulièrement pour coller aux évolutions du framework Angular 2.
N’est-il pas trop tôt pour se mettre à Angular 2 ?
Cela dépend de votre stratégie professionnelle. Si vous avez envie d'être positionné sur un nouveau projet (sortir de TMA par exemple) ou songez démissionner pour avoir une augmentation, Angular 2 sur un CV mais surtout au bout des doigts est une très bonne carte à jouer.
Et pour les indépendants ?
Votre TJM sera supérieur sur de l’Angular 2 car vous aurez moins de concurrents que sur de l’AngularJS.
Et si le cours ne correspond pas à mes attentes, puis-je être remboursé ?
Oui. Vous disposez de 30 jours d'essai durant lesquels vous pouvez être remboursé.
Quelles sont les perspectives après le lancement de ce cours ?
Je souhaite constituer un noyau dur de développeurs qui aiment, tout comme moi, rester sur la vague. Le financement généré par les ventes du cours me permettra de consacrer davantage de temps à tourner des vidéos complémentaires à l'existant. Ce cours permet d'ores et déjà d'être autonome sur Angular 2. Les vidéos complémentaires permettront de se perfectionner.
Si j’achète le cours au prix de lancement et pendant une promo, bénéficierai-je de ces nouvelles vidéos
Oui ! Vous serez notifié par email de la mise en ligne des nouvelles vidéos et y aurez accès immédiatement sans frais supplémentaire d'aucune sorte. Au 22 janvier 2017, ce sont plus de 30 vidéos qui ont ainsi été ajoutées spécifiquement à ce cours depuis son lancement en novembre 2016.
Il y a des vidéos gratuites sur Youtube, pourquoi payer un cours ?
Car il s’agit ici de la création d’une application complète, pas de tutos sur divers sujets pris isolément. On passe de l'unitaire à l'intégré :) En outre, la fréquence des mises à jours sera plus importante ici que sur une chaine Youtube, du fait des moyens supplémentaires obtenus par la vente de cette formation.
La publicité Youtube ne permet pas ce mode de fonctionnement ?
Après deux années années et demi de présence sur Youtube, la réponse en ce qui me concerne est "hélas non", car je suis clairement sur une niche (chaîne de développement / en français / exclusivement sur JavaScript) et ne souhaite pas élargir le thème pour toucher davantage de monde. L'option grand public étant exclue, il faut proposer le meilleur contenu aux développeuses et développeurs les plus motivé(e)s. Je continue Youtube au même rythme, mais ce site en est sa version premium, destinée à celles et ceux qui veulent aller beaucoup plus vite, beaucoup plus loin.
Vaut-il mieux attendre que ces vidéos complémentaires soient tournées ?
Les premiers acheteurs permettront d’enclencher un cercle vertueux dont ils bénéficieront en premier lieu. Plus le démarrage sera efficace, plus je pourrais libérer de temps et donc sortir plus rapidement et plus fréquemment des vidéos additionnelles.
D’autres formations sont-elles prévues ?
Une formation également orientée projet sera lancée en janvier 2017 : "5 mini projets pour se perfectionner en Angular 2". Ce sera la suite de la présente formation, car les prérequis seront de connaître tout ce qui est présenté dans "Angular 2 par la pratique".
RxJS est tellement important pour le développeur Angular 2 qu’il mérite bien une formation complète et dédiée.
Angular 2 étant le pré-requis à Ionic 2, il est prévu également une formation Ionic 2 en mars 2017, tant les applications mobiles hybrides ont gagné du terrain.
Et côté back-end ?
Angular 2 peut être utilisé avec n'importe quelle techno serveur. Mais dans les vidéos complémentaires, je resterai sur les technos JS (Firebase 3, Mongo ...) pour le POST, PUT, DELETE ...
Hors JavaScript point de salut ?
Il y a énormément de technos passionnantes, mais seulement 24 heures dans une journée. Donc effectivement, tout le contenu sera consacré exclusivement aux technos JS, ce qui inclut ECMAScript 6 et TypeScript
Quel est l'avantage de la vidéo par rapport à un livre ?
J'ai pour ma part des dizaines de livres achetés souvent 45 euros chaque (en anglais de surcroît), qui sont obsolètes à peine sortis de l'imprimerie. Les livres sur les sujets de fond (design patterns, architecture ...) ou sur un langage sont irremplaçables et moins sujets à obsolescence. Pour une veille techno sur des frameworks et pire encore sur des frameworks JS, l'édition est un medium trop lent. Surtout vu le rythme des mises à jours et autres "breaking changes" d'Angular.
Pourquoi les prix sont-il indiqués Hors Taxes ?
Car vous venez d'une vingtaine de pays différents. La TVA n'est pas la même partout. La plateforme de paiement ajoute donc, dans le cas de la France, 20% de TVA, pour chaque autre pays, la TVA du pays considéré.
La meilleure façon d'appendre un nouveau framework, c'est de créer une application avec. C'est exactement ce que vous ferons ensemble durant cette journée de formation !