Voici maintenant le temps réaliser un petit exercice simple qui mettra en vedette un contrôleur, une vue et quelques directives AngularJS. Récits utilisateurs (user story) à réaliser En tant que gestionnaire, je veux afficher la liste des projets à compléter. En tant que gestionnaire, je veux rechercher un projet dans la liste. Pour réaliser le […]
Injection de dépendance L’injection de dépendances (dependency injection en anglais) est un mécanisme qui permet d’implémenter le principe de l’inversion de contrôle. Il consiste à créer dynamiquement (injecter) les dépendances entre les différentes classes en s’appuyant sur une description (fichier de configuration ou métadonnées) ou de manière programmatique. Ainsi les dépendances entre composants logiciels ne […]
Plusieurs versions de Node.js sont disponibles. Des versions stables, d’autres en développement. Comment installer et sélectionner une version de Node.js en fonction de vos besoins et de vos projets? n est la solution qui simplifiera la gestion des différentes versions de Node.js et npm installées sur votre système. Installer n avec npm
|
1
|
$ sudo npm -g n
|
Si n […]
Le dilemme Angular – 4700 étoiles sur GitHub https://github.com/yeoman/generator-angular
|
1
|
$ npm install -g generator-angular
|
ou Angular-fullstack – 4500 étoiles sur GitHub https://github.com/angular-fullstack/generator-angular-fullstak
|
1
|
$ npm install -g generator-angular-fullstack
|
Au CIMMI Au CIMMI, nous avons sélectionné le générateur angular-fullstack pour deux projets. Le premier projet utilise la Stack MEAN (Mongo Express Angular et Node) tandis que l’autre projet vise seulement à […]
Touches utiles tab Complète un nom de dossier ou de fichier.
|
1
2
3
|
$ cd /ho tab
$ cd /home
|
tab tab Affiche le contenu d’un dossier.
|
1
|
$ cd /home/ tab tab
|
Lance la dernière commande avec Bang !
|
1
2
3
|
$ git status
$ !g # lance la dernière commande qui débute par g
|
Les flèches Permettent de naviguer dans l’historique des commandes. La flèche du haut affiche la dernière commande exécutée. Se positionner au début avec Ctrl-a Positionne le […]
La révolution App En septembre 2014, le App Store de Apple a franchit le cap du 1,2 million d’applications offertes pour un total de 75 milliards de téléchargements. [1] http://en.wikipedia.org/wiki/App_Store_%28iOS%29 Durant les 5 dernières années, une révolution s’est opérée dans la façon de développer des applications Internet. Cette révolution croît à une vitesse exponentielle et […]
La plus petite application AngularJS
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<!doctype html>
<html ng-app>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
</head>
<body>
<div>
<label>Nom:</label>
<input type="text" ng-model="votreNom" placeholder="Veuillez entrer votre nom">
<hr>
<h1>Bonjour {{votreNom}}!</h1>
</div>
</body>
</html>
|
J’attire votre attention sur ces nouveaux attributs qu’on nomme directive dans le monde AngularJs: ng-app et ng-model. ng-app L’attribut ng-app (directive) désigne l’élément de base (root) de l’application Angular. Cette directive est habituellement placée sur la balise <body> ou <html>. Voir la documentation de la directive ngApp. ng-model La […]
La majorité des applications web doivent faire appel aux formulaires afin de permettre à l’utilisateur d’entrer des données. Ces données doivent au minimum être validées côté serveur. Afin d’offrir une meilleure expérience utilisateur, la validation côté client est souvent souhaitée. AngularJS a pensé à nous et nous offre un API bien complet afin de gérer […]
Installer et lancer WebStorm Créer un nouveau projet Un nouveau projet Yeoman! Installer Node.js si ce n’est pas déjà fait Passez en ligne de commande et utiliser npm pour installer Yeoman Identifier votre dossier d’installation Yo Installer le générateur Angular Étape 1) Utiliser Grunt et non Gulp […]