Apprendre à programmer avec le framework Angular : démarrer avec l'outil Angular-CLI
Un tutoriel de William Koza
Le 2016-12-07 19:57:49, par wkoza, Membre éclairé
Bonjour à tous,
Dans ce tutoriel, nous allons apprendre à utiliser le client Angular-CLI qui est d'une grande aide pour commencer un projet.
Google nous propose un outil clé en main pour réaliser les tâches de développement les plus courantes. Ce projet est basé sur le projet Open Source ember CLI, qui a maintenant plus de trois ans. Grâce à notre Angular Cli, il est possible de :
Bonne lecture.
Retrouvez les meilleurs cours et tutoriels pour apprendre Javascript.
Dans ce tutoriel, nous allons apprendre à utiliser le client Angular-CLI qui est d'une grande aide pour commencer un projet.
Google nous propose un outil clé en main pour réaliser les tâches de développement les plus courantes. Ce projet est basé sur le projet Open Source ember CLI, qui a maintenant plus de trois ans. Grâce à notre Angular Cli, il est possible de :
- créer une application from scratch via un scaffolding ;
- Générer des squelettes des composants type Components… ;
- Builder un projet ;
- Lancer des tests de type « End-to-End » ou « unitaire » ;
- Proxyfier le back end ;
- Et beaucoup d'autres choses…
-
dukoidMembre expertdevDePassage, certes AngularJS a de grande qualité comme tu le soulignes si bien : la simplicité
MAIS parceque il y a toujours un mais. quand il s'agit de concevoir une grosse application, AngularJS est à la peine, c'est le bordel. ça se complique.
le tout objet permet une meilleure gestion de l'ensemble de la grosse application(qui a un volume et une multitude de services et de données différentes...)
oui Angular est du coup plus complexe.
comme je dis toujours, chaque framework à ses avantages et inconvénients... et réponds à des besoins différents.le 15/12/2016 à 13:01 -
wkozaMembre éclairéBonjour Heliogabale,
Je comprends ta remarque. Ce n'est pas pour "se faire passer pour un développeur au fait des nouveautés", non. C'est juste une deformation de langage car ces termes sont très teintés de sens et parfois plus parlant. J'avoue que je ne suis pas fan du tout français mais je vais faire un effort. Pour le terme proxifier le back end, il faut comprendre mettre en place un système de proxy entre le front-end et le back-end afin de "rediriger" les requêtes vers un autre serveur. Cela permet notamment d'éviter les erreurs de cross-domain.le 23/12/2016 à 12:12 -
HeliogabaleNouveau Candidat au ClubMerci de ta réponse, je comprend très bien.
Mais tu n'étais pas visé personnellement, ni le contenu de l'article.
Mais beaucoup d'articles deviennent souvent incompréhensibles à force de "compulsions syntaxiques".
A +le 23/12/2016 à 16:08 -
ABCIWEBExpert éminent séniorBonne initiative, c'est bien expliqué, continues comme çale 07/12/2016 à 21:05
-
DoksuriExpert confirmécette bande annonce donne envie de voire la suite
simple, clair et concis le 08/12/2016 à 8:56 -
JaroddMembre expérimentéBonjour,
Merci pour ce tuto, mais je trouve qu'il n'est pas très clair.
Par exemple, on ne sait pas comment nommer le fichier typescript (ni s'il faut le mettre dans un répertoire précis). Idem pour index.html, avec le code indiqué on ne charge jamais le fichier js, donc on n'a jamais le résultat attendu (avec le logo), on a juste "Loading...".
J'ai du aller sur le quickstart de la doc officielle pour comprendre ce qu'il me manquait.le 12/12/2016 à 14:53 -
wkozaMembre éclairéBonjour Jarodd,
Ce premier tuto n'est pas fait pour être testé. C'est juste une mise en bouche. Effectivement, il est compliqué de vouloir le tester.
Les tutos suivant permettent de s'exercer grace notamment à angular-cli. Le premier tuto avec des exercices doit arrivé en ligne d'ici la fin de semaine.
A bientôtle 12/12/2016 à 16:25 -
JaroddMembre expérimentéOk. Moi quand je vois du code j'essaye de le tester, c'est plus fort que moi
Vivement la suite alors !le 12/12/2016 à 16:35 -
ascitoMembre éprouvépourquoi les "`"?
Code : 1
2
3
4
5
6
7
8
9
10
11
12import { Component } from '@angular/core'; @Component({ selector: 'mon-premier-component', template: ` <h2>Mon premier Component</h2> <img src="http://gabarit.developpez.be/images/logo.png" /> ` }) export class MonPremierComponent { }
le 14/12/2016 à 2:55 -
WatilinExpert éminentParce que ES6 : https://developer.mozilla.org/fr/doc...9raux_gabarits
C’est plus pratique pour les sauts de ligne. Les chaînes traditionnelles ne les supportent pas (SyntaxError: unterminated string literal) et on est obligé de recourir à des astuces moches :
Code : 1
2
3"Panda\ Poney\ Paprika"
Code : 1
2
3"Panda\n" + "Poney\n" + "Paprika"
le 14/12/2016 à 12:54