Angular/Tutorial/OpenClassrooms

De WikiSys
Aller à : navigation, rechercher

Historique

  • Aux débuts du développement web, seul le HTML permet de créer des sites. Les sites web en 1990 ressemblent à des documents texte, car il n’existe pas vraiment d’autres possibilités.
  • Ensuite, en 1998, le CSS arrive pour aider à créer des mises en page plus esthétiques.
  • Finalement, à partir du début des années 2000, le JavaScript commence son règne sur le développement web, permettant des interactions entre l’utilisateur et la page.
  • À partir de 2005, le système AJAX (Asynchronous Javascript And XML) permet des interactions entre l’utilisateur et des backend HTTP : il est enfin possible d'échanger des informations et de générer du contenu à partir de ces interactions.
  • En 2010, la première version d’AngularJS est lancée. Elle permet de créer plus facilement des Single Page Applications, des applications web qui imitent les applications natives :
    • pas de rafraîchissement du navigateur,
    • temps de chargement réduits,
    • une UI beaucoup moins “internet” etc.

Cette version permet déjà de faire énormément de choses, mais souffre d'une syntaxe plutôt complexe ainsi que des limitations du JavaScript. Voilà pourquoi Google choisit de complètement réécrire le framework pour sa version 2. Aujourd’hui, nous en sommes à Angular 5.x (maintenant appelé simplement “Angular”) ; la version 3 ayant été sautée pour des raisons sémantiques tout simplement.

TypeScript

  • plus strict que JavaScript compilé en JavaScript
  • le typage strict, qui permet de s’assurer qu’une variable ou une valeur passée vers ou retournée par une fonction soit du type prévu ;
  • les fonctions dites lambda ou arrow, permettant un code plus lisible et donc plus simple à maintenir ;
  • les classes et interfaces, permettant de coder de manière beaucoup plus modulaire et robuste.

Node.js installation de ng

su
cd ~/Angular
npm install -g npm@latest    (npm est le gestionnaire de paquets officiel de Node.js)
ng new mon-premier-projet
cd mon-premier-projet
ng serve --open
firefox:http://localhost:4200

On utilise les styles en SCSS plutôt qu'en CSS tout code CSS valable est aussi valable en SCSS.

On utilisere également Bootstrap pour les styles de l'application pour faciliter la mise en page.

Tutoriels