background preloader

Veille Tech AngularJs

Facebook Twitter

TypeScript: langage de transition vers le futur JavaScript. Ce nouveau langage de Microsoft permet de disposer des possibilités de ECMAScript 6 et 7 maintenant, sans attendre leur implémentation dans les navigateurs.

TypeScript: langage de transition vers le futur JavaScript

C'est le premier langage de programmation dont l'usage se veut temporaire. Du fait d'une syntaxe similaire à celle de JavaScript et parce qu'il est compilé dans ce langage, il sera possible, une fois que les fonctions additionnelles qu'il apporte seront toutes implémentées par les interpréteurs, de remplacer le code TypeScript par un code JavaScript. Généré par le premier ou repris tel quel. Donc les développeurs pourront supprimer l'étape de compilation en code JavaScript et TypeScript pourra disparaître! C'est différent de ce que propose Dart, qui offre les mêmes fonctions mais veut lui, remplacer JavaScript dans les navigateurs. TypeScript est utilisé en production avec des retours toujours positifs, car il améliore beaucoup le productivité, et on n'a jamais envie de revenir à JavaScript. Les types statiques Fonctions Par exemple: Devoxx 2016 : Retour sur « D’Angular 1 à Angular 2 : Préparez vous dès maintenant à la migration »

J’ai eu la chance de participer cette année à la 5ème édition du Devoxx France.

Devoxx 2016 : Retour sur « D’Angular 1 à Angular 2 : Préparez vous dès maintenant à la migration »

Je vous propose dans cet article de revenir sur une des conférences que j’ai particulièrement appréciée dont le thème était "D'Angular 1 à Angular 2 : Préparez vous dès maintenant à la migration" présentée par Benoit Lemoine. L’annonce de la sortie d’Angular 2 a été faite en septembre 2014 et cette version 2 n’a pas grand chose à voir avec Angular 1. AngularJS 2.0 changements notables. La version 2.0 d’Angular a maintenant été annoncée depuis un moment comme une refonte complète, et en voyant les importants changements entre les 2 versions, on peut dire que nous avons un gros travail de mise à niveau à fournir.

AngularJS 2.0 changements notables

Alors autant prendre un peu d’avance ! Cette version 2.0 étant en développement actif, elle change donc beaucoup, mais les développeurs ont fait quelques choix d’orientations que nous pouvons commencer à étudier. Pour ce faire, nous pouvons consulter le site dédié à Angular 2.0, sur lequel on trouve la documentation et quelques exemples et articles. $q. A service that helps you run functions asynchronously, and use their return values (or exceptions) when they are done processing.

$q

This is a Promises/A+-compliant implementation of promises/deferred objects inspired by Kris Kowal's Q. $q can be used in two fashions --- one which is more similar to Kris Kowal's Q or jQuery's Deferred implementations, and the other which resembles ES6 (ES2015) promises to some degree. The streamlined ES6 style promise is essentially just using $q as a constructor which takes a resolver function as the first argument. This is similar to the native Promise implementation from ES6, see MDN. While the constructor-style use is supported, not all of the supporting methods from ES6 promises are available yet. It can be used like so: L'API Promise d'AngularJS. Les services standards d'AngularJS $timeout et surtout $http renvoient tous deux des promises, qui sont très pratiques pour gérer des opérations asynchrones.

L'API Promise d'AngularJS

Cette notion de promise existe dans d'autres frameworks, comme jQuery, et AngularJS intègre une implémentation de cette API. Elle peut être utilisée par les développeurs dans l'écriture des leurs propres services pour simplifier la gestion des actions asynchrones. C'est très important de bien comprendre comment fonctionne cette API, qui est probablement la partie la plus ardue d'AngularJS, pour tirer profit de toute la puissance du service $http, et pour gérer facilement les enchaînements d'opérations asynchrones dans une application. Décrire en français le fonctionnement de l'API de promises ne va pas être simple, car il est difficile de traduire de façon élégante les notions qu'elle recouvre sans s'éloigner des termes anglais utilisés comme noms de méthodes.

Qu'est-ce qu'une promise ? Enchaînement de promises. Les services AngularJS - Angular-js.fr. Les services AngularJS permettent de partager du code dans toute votre application, grâce à ce que l’on appelle l’injection de dépendances.

Les services AngularJS - Angular-js.fr

AngularJS propose un grand nombre de services (et providers) prêts à l’emploi. Ceux-ci sont précédés du symbole $. En voici quelques exemples : Tutoriel AngularJS. Organisation Avant de créer tout plein de templates et de contrôleurs, voyons comment organiser nos fichiers.

Tutoriel AngularJS

Le but est de pouvoir facilement s'y retrouver tout en évitant la duplication de code. Je vous propose donc cette arborescence très simple mais bien adaptée pour les petits projets comme le nôtre (je vous rappelle qu'ici on fait une application qui n'a que 2 vues) : routeApp/ ├── index.html ├── js/ │ ├── script.js │ └── vendor/ │ ├── angular.js │ └── angular-route.js ├── partials/ │ ├── home.html │ └── contact.html └── web/ ├── css/ │ ├── style.css │ └── style.min.css └── img/ ├── logo.png ├── favicon.ico └── ... Votre premier module AngularJS. Spécifier le contrôleur Avant tout, on déclare notre contrôleur, comme on l'a vu au chapitre précédent, avec son nom et ses dépendances.

Votre premier module AngularJS

Ici, il ne dépend que du service $scope. Et par la même occasion, on initialise la liste des todos avec un tableau vide. Nouvelles Chroniques d'Amethyste. Après les services, le binding et les routes, les directives sont le dernier grand pilier de l’architecture Angular.

Nouvelles Chroniques d'Amethyste

Partons à leur découverte ce qui clôturera ma série de tutoriel Angular 1 avant d’attaquer Angular 2. Pour des raisons que j’ignore, la majorité des exemples que je trouve sur le net sont, me semble t’il, très compliqués. Je préfère nettement faire 10 démos très simples, plutôt qu’une seule qui démontre 10 concepts en même temps. Alors c’est quoi? Comprendre les bases d'angularJS et savoir quand l'utiliser. Introduction AngularJS fait partie de la nouvelle vague de frameworks JavaScript, à l’instar de Backbone.js et Ember.js, pour ne citer que les plus connus.

Comprendre les bases d'angularJS et savoir quand l'utiliser

Il s’inscrit dans un mouvement d’innovation côté front-end, pour notre plus grand bonheur. Aujourd’hui, les sites où le JavaScript ne sert qu’à faire disparaître une balise <p> ou changer le style d’un <div> se font de plus en plus rares et sont pour la plupart des sites éditoriaux. On voit de plus en plus apparaitre des sites web poussés, et certains ressemblent à des applications bureau (enrichi par le cloud) avec une ergonomie ultra simple et une grande facilité de prise en main. Heureusement, les besoins ont évolué, mais les outils aussi. jQuery qui, je pense, parle à tout le monde, se présente plus sous la forme d’une libraire, alors qu’AngularJS est un vrai framework : il va structurer votre code et vous imposer une architecture. Installez votre environnement - Développez vos applications web avec AngularJS. AngularJS apprendre à utiliser angular js de Google.

Angular JS c'est quoi? AngularJS est un framework écrit en javascript par Google libre et open-source qui permet d'améliorer, au même titre que JQUERY, la syntaxe de javascript ainsi que la productivité du développeur. Angular en basé sur la logique MVC. (modèle vue controller). Apprendre les bases d'angularJS. AngularJS : le framework JavaScript de Google au crible. La popularité du framework JavaScript ne cesse de croitre. Quelles sont ses véritables points forts comparés à ses concurrents ? Qu'apporte AngularJS 2.0 qui vient de sortir ? Télécharger AngularJS (site du projet)1- AngularJS est devenu la référence des infrastructures JavaScript côté client Sur le terrain des infrastructures JavaScript, historiquement très nombreuses, plusieurs solutions commencent à s'imposer. AngularJS. Un article de Wikipédia, l'encyclopédie libre.

L'article doit être débarrassé d'une partie de son jargon (indiquez la date de pose grâce au paramètre date). Développez vos applications web avec AngularJS. One framework. - Angular.