Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Introduction à AngularJS - Clermont'ech

Eric Mas
October 29, 2013

Introduction à AngularJS - Clermont'ech

Présentation pour Clermont'ech le 29/10/2013

Eric Mas

October 29, 2013
Tweet

Other Decks in Programming

Transcript

  1. « AngularJS is what HTML would have been, had it

    been designed for building web-apps. Declarative templates with data-binding, MVW, MVVM, MVC, dependency injection and great testability story all implemented with pure client-side JavaScript! » Philosophie
  2. Affichage d’une page • Template : écrit en HTML •

    Controller : fonction javascript • Model : simple objet javascript
  3. Affichage d'une page • Séparation des vues et de la

    logique de présentation : - La vue a accès aux données via le scope - Le contrôleur publie les données dans le scope • Le scope correspond au contexte d'exécution des expressions de la vue • Le template fonctionne sur les éléments du DOM • Mise à jour de la vue en cas de changement d'état du modèle : dirty checking
  4. Organiser son code : les modules • Permet de structurer

    son application (par composant, par fonctionnalité, … ) • Regroupe des contrôleurs, des directives, des services, … • Une application peut se composer de plusieurs modules (avec un module principal)
  5. HTML étendu : les directives • Extension du langage HTML

    • Définition ou redéfinition d'éléments ou d'attributs HTML
  6. • Karma test runner : moteur d’exécution de tests •

    Angular-mocks : mocks de base pour faciliter l’écriture des tests • Angular-scenario : extension jasmine pour les tests d’interface utilisateur Tester son application
  7. • Injection de dépendances • Directives fournies par AngularJS •

    $http et $resource • Filtres • Formulaires • Routage interne • Événements • Exceptions • ... Autres fonctionnalités
  8. • Communauté AngularJS sur Google+ • Livre Mastering Web Application

    Development with AngularJS • FrAngular (frangular.com) • Wiki angular • Angular-app, ng-boilerplate (github.com/ngbp/ng-boilerplate) Aller plus loin
  9. • Extension Chrome Batarang • Plugin angularjs pour sublimeText et

    WebStorm • Grunt Task Runner et Bower • Générateur Yeoman Outils pour les développeurs