Développement d'applications Web HTML5 L'art et la manière avec Visual Studio 2015 et TFS

Dimension: px

Commencer à balayer dès la page:

Download "Développement d'applications Web HTML5 L'art et la manière avec Visual Studio 2015 et TFS"

Stanislas Joly
il y a 8 ans
Total affichages :

1 Avant de commencer 1. Introduction HTML5 oui, mais pas que HTML JavaScript CSS Les outils 18 Préparation des outils et création du projet 1. Introduction Team Foundation Server Visual Studio ALM Les services de TFS Planning Contrôle des sources Éléments de travail Automatisation de la build Tests et Lab Management Rapports et analyse Visual Studio Online ou serveur dédié Démarrage du projet Création d'un compte Visual Studio Online Création du projet d'équipe Team Web Access Gestion de l'équipe et droits d'accès Les Work Items 37 1/13

2.2 Contrôle des sources 23 2.2.3 Éléments de travail 24 2.2.4 Automatisation de la build 25 2.2.5 Tests et Lab Management 26 2.2.6 Rapports et analyse 27 2.

2 3.3.3 Le Product Backlog Gestion des versions et du planning Visual Studio Création du projet Connexion à TFS et configuration de l'espace de travail Connexion à un projet avec Team Foundation Version Control Création du projet et premier archivage de code Team Explorer Gestion des branches Les requêtes d'éléments de travail Les plug-ins indispensables Web Essentials Chutzpah Extension GitHub pour Visual Studio 71 Architecture d'une application web 1. Introduction Qu'est-ce qu'une web app? Les approches possibles Fonctionnement de l'architecture monopage Le site web seul L'API et ses apps XML et JSON Applications JavaScript ou hybrides client-serveur L'application hybride client-serveur L'application JavaScript Comment choisir? 79 2/13

1 Web Essentials 71 5.2 Chutzpah 71 5.3 Extension GitHub pour Visual Studio 71 Architecture d'une application web 1. Introduction 73 2. Qu'est-ce qu'une web app? 73 3. Les approches possibles 74 3.

3 Création d'api REST 1. Introduction Présentation de REST ASP.NET ou Node.js? ASP.NET MVC Node.js Lequel choisir? Le projet ASP.NET Création du projet Organisation du projet Configuration de MVC 6 et Entity Framework Ajout des dépendances Ajout du fichier de configuration Configuration d'asp.net MVC Entity Framework Création des modèles Création du contexte de base de données Création du Repository Configuration des migrations avec DNVM Création de la WebAPI Création des contrôleurs Les méthodes GET Ajout des méthodes POST, PUT et DELETE Gestion des erreurs Tester avec Fiddler Concepts avancés Objets de transfert de données Asynchronisme 117 3/13

net MVC 93 5. Entity Framework 7 95 5.1 Création des modèles 95 5.2 Création du contexte de base de données 98 5.3 Création du Repository 99 5.4 Configuration des migrations avec DNVM 104 6.

4 JavaScript moderne 1. Introduction Conventions de code JavaScript Style Indentation Terminaison de ligne Opérations sur plusieurs lignes Variables Fonctions Comparateurs d'égalité Boucles et expressions booléennes Commentaires Conventions de nommage Variables et constantes Fonctions Classes et constructeurs Les pièges à éviter null et undefined eval() Les patterns de base à connaître Les classes L'héritage Les membres publics, privés et privilégiés Publics Privés Méthodes privilégiées Les fonctions anonymes à invocation immédiate Les modules Le pattern Module Le pattern Façade Gestion des dépendances avec AMD Les callbacks 148 4/13

2.3 Classes et constructeurs 135 2.3 Les pièges à éviter 135 2.3.1 null et undefined 135 2.3.2 eval() 136 3. Les patterns de base à connaître 137 3.1 Les classes 137 3.2 L'héritage 139 3.

5 4. Les bonnes pratiques Le mode strict Erreurs personnalisées Documentation du code Les outils JSHint Introduction Configuration Déclaration d'exceptions Outils pour le développeur intégrés au navigateur Vorlon.JS 162 Single Page Applications 1. Introduction Choisir un framework AngularJS Introduction Une application AngularJS simple Configuration du dossier wwwroot Premier exemple de code AngularJS Un exemple plus avancé Création du premier module Un premier contrôleur L'injection de dépendances Le scope Les directives Conventions et style Filtres, services, providers, factories 184 5/13

2 Une application AngularJS simple 167 3.2.1 Configuration du dossier wwwroot 167 3.2.2 Premier exemple de code AngularJS 168 3.3 Un exemple plus avancé 171 3.3.1 Création du premier module 171 3.3.2 Un premier contrôleur 173 3.

6 4. Développement de la web app Préparation du projet package.json bower.json Gruntfile.js Création de l'application Angular Création du conteneur de l'application Organisation des sources Gestion des routes Création des contrôleurs Création des vues Chargement de l'application dans la page web Ajout du menu de navigation Utiliser l'api $http Création de BooksService CRUD avec $resources Liste des livres Détail Ajouter un livre Afficher les critiques Ajouter une critique 224 TypeScript 1. Introduction Présentation de TypeScript Le langage Le système de typage Déclaration Les types primitifs 232 6/13

3 Utiliser l'api 210 4.3.1 $http 210 4.3.2 Création de BooksService 210 4.3.3 CRUD avec $resources 214 4.3.4 Liste des livres 216 4.3.5 Détail 217 4.3.6 Ajouter un livre 219 4.3.7 Afficher les critiques 221 4.

7 3.1.3 Le type any L'inférence de type L'objet Les classes Les modificateurs public, private et protected L'héritage Les interfaces Les génériques Les modules Les modules internes Les modules externes ou modules ES Autres éléments intéressants du langage Boucle for...of Les Union Types Les fonctions anonymes fléchées d'es ES6 let et const Les déstructurations ES Les décorateurs Et pour le futur? Configurer le projet pour utiliser TypeScript Installation Compilation En ligne de commande Configuration de la compilation avec Visual Studio Configuration de la compilation avec tsconfig.json Intégration à la build Grunt Utiliser TypeScript avec des librairies JavaScript Les fichiers de définition de type Récupération automatisée des fichiers de définition Utilisation des librairies en TypeScript Coder en AngularJS avec TypeScript Transformation du code AngularJS pour TypeScript Création des modules Configuration de RequireJS Et pour Angular 2? 270 7/13

5.3 Les fonctions anonymes fléchées d'es6 248 3.5.4 ES6 let et const 249 3.5.5 Les déstructurations ES6 250 3.5.6 Les décorateurs 251 3.6 Et pour le futur? 252 4.

8 4.5 Déboguer en TypeScript Dans Visual Studio Dans les autres navigateurs 272 Web apps adaptatives 1. Introduction Responsive design ou site dédié? Le site dédié Le site web responsive Optimisation L'approche RESS CSS Présentation de CSS Les feuilles de style Les sélecteurs CSS Les sélecteurs de base Le sélecteur d'attribut Les sélecteurs hiérarchiques Les pseudo-classes et pseudo-éléments Les media queries La syntaxe Les critères Définir les bonnes media queries pour son projet Le viewport LESS LESS et Sass Fonctionnalités de LESS Installation et utilisation de LESS Les variables Imbrication des fichiers 299 8/13

3.2 Le sélecteur d'attribut 284 3.3.3 Les sélecteurs hiérarchiques 285 3.3.4 Les pseudo-classes et pseudo-éléments 287 3.4 Les media queries 289 3.4.1 La syntaxe 290 3.4.2 Les critères 291 3.4.3 Définir les bonnes media queries pour son projet 291 3.

9 4.2.4 Organisation des fichiers Imbrication de règles Mixins Mathématiques Boucles et conditions Le style de l'application 309 Intégration continue 1. Introduction Build.NET Que fait une build.net? Team Foundation Build Architecture La définition de build Contrôleur de build local ou hébergé Build XAML Les modèles de processus Configuration Création des agents Création de la définition de build Personnalisation du modèle de processus Activité personnalisée Build vnext Configuration Création de la définition de build Exécution Suivi des exécutions Build JavaScript Que fait une build JavaScript? Grunt Présentation 336 9/13

3 Build XAML 314 2.3.1 Les modèles de processus 315 2.3.2 Configuration 316 2.3.3 Création des agents 317 2.3.4 Création de la définition de build 317 2.3.5 Personnalisation du modèle de processus 321 2.

10 3.2.2 Configuration de la build Grunt du projet Gulp Préparation des livrables pour la production Présentation Génération des Bundles avec Grunt Exécution de la build Exécution manuelle et automatisée Intégration à TFS Build 342 Les tests 1. Introduction Les tests unitaires Tests unitaires et TDD Anatomie d'un test unitaire Les tests unitaires en.net Création d'un projet de test unitaire Configuration Écriture de tests Exécution des tests Intégration à la build TFS Les tests unitaires en JavaScript Karma Mocha Chai SinonJS Intégration à Grunt Les tests fonctionnels Introduction Plans, suites et cas de tests Planification Création d'un plan de test /13

2 Anatomie d'un test unitaire 345 2.3 Les tests unitaires en.net 345 2.3.1 Création d'un projet de test unitaire 345 2.3.2 Configuration 346 2.3.3 Écriture de tests 347 2.3.4 Exécution des tests 350 2.

11 3.3.2 Création de suites de tests Création de cas de tests Exécution Suivi et rapports Tests de charge Introduction Les tests web Les tests de charge Tests de charge dans le cloud 386 Déploiement et suivi en production 1. Introduction Déploiement continu sur Azure avec Visual Studio Online Présentation Configuration Gestion avancée des déploiements avec Release Manager Présentation Configuration Création du chemin de livraison en production Livraison d'une nouvelle version Suivi et analyse de l'application en production avec Application Insights Présentation Configuration Configuration du service Ajout à un nouveau projet Ajout à un projet existant Récupération et analyse des données Récupération et analyse des premières données /13

1 Présentation 388 2.2 Configuration 388 3. Gestion avancée des déploiements avec Release Manager 392 3.1 Présentation 392 3.2 Configuration 393 3.2.1 Création du chemin de livraison en production 401 3.

12 4.3.2 Informations disponibles de base Données d'utilisation des pages Intégration à une application AngularJS Suivi de la disponibilité Mise en place d'alertes 426 Les nouvelles API d HTML5 1. Introduction Les Web Components Principes Comprendre le Shadow DOM Déclaration de nouveaux composants Utilisation des templates et des imports Utiliser les Web Components avec des librairies JavaScript Géolocalisation Présentation Comment ça marche? Hors ligne Le cache d'application Stockage de données en local Le Web Storage IndexedDB Accès au système FileAPI getusermedia Orientation, accélération et autres capteurs Graphisme avancé /13

Géolocalisation 439 3.1 Présentation 439 3.2 Comment ça marche? 439 4. Hors ligne 441 4.1 Le cache d'application 441 4.2 Stockage de données en local 444 4.2.1 Le Web Storage 444 4.2.2 IndexedDB 445 5.

13 6.1 Canvas Canvas 2D Canvas 3D SVG Les Web Workers Et les autres? 467 Évolution des standards et rétrocompatibilité 1. Introduction Connaître le support d'une fonctionnalité Détection et support des fonctionnalités Modernizr Présentation Utilisation Chargement asynchrone de fichiers Polyfills 474 Index /13

Connaître le support d'une fonctionnalité 470 3. Détection et support des fonctionnalités 471 3.

Documents pareils

HTML5. Développement d applications Web. Visual Studio 2015 et TFS. L art et la manière. avec. Philippe DIDIERGEORGES

HTML5. Développement d applications Web. Visual Studio 2015 et TFS. L art et la manière. avec. Philippe DIDIERGEORGES Epsilon_GT_v8_Mise en page 1 20/07/2015 15:45 Page 29 Développement d applications Web HTML5 L art et la manière avec Visual Studio 2015 et TFS Préface Avant de commencer Préparation des outils et création