Chapitre 2 Les frameworks de dveloppement Web Plan

Chapitre 2 Les frameworks de développement Web

Plan du chapitre 1. Introduction 1. 1. Définition d’un framework 1. 2. Types de framewoeks 1. 3. Le modèle MVC (Modèle-Vue-Contrôleur) 2. Frameworks Coté Client 2. 1. Bootstrap 2. 2. Angular 2. 3. React 3. Frameworks Coté Serveur 3. 1 Laravel 3. 1. Django 3. 3. Spring 3. 4. ASP. NET

1. Introduction

1. 1. Définition En develpoppement web, un framework est : § un cadre de travail ou un cadre de développement § une architecture prête à l’emploi. § un ensemble d’outils constituant les fondations d’une application § à la fois une sorte de boîte à outils et une méthodologie de travail.

1. 1. Définition Les framework offérent plusieurs avantages : §La rapidité de développement des projets grâce aux outilles disponibles § Une très bonne organisation des projets § Plusieurs frameworks sont basé sur l'architecture MVC, ils bénéficient donc de ses avantages § Composants réutilisables § Respecter les norme actuelles (sécurité , nouvelles technologies).

1. 2. Types des frameworks En developpement web, il existe deux grandes types d’usage pour un framework : § frameworks front-end : Les frameworks de présentation de contenu web, comme Bootstrap, Semantic UI ou Foundation… § frameworks Backend : Les frameworks applicatifs pour le développement d’applications web comme Symphony, Ruby on Rails ou encore Django…

1. 3. Le modèle MVC (Modèle-Vue-Contrôleur) Comme exemple, nous allons prendre un programme PHP qui permet d'afficher une liste d'étudiants a partir d'une base de données. Nous allons voir plusieurs version du programme et déterminer la version la plus efficace.

1. 3. Le modèle MVC (Modèle-Vue-Contrôleur) Version 1 : Un seul fichier « page_etudiants. php »

1. 3. Le modèle MVC (Modèle-Vue-Contrôleur) « page_etudiants. php » Version 2 : deux fichiers « vue 1. php »

1. 3. Le modèle MVC (Modèle-Vue-Contrôleur) « modele_etudiants. php » le modèle Version 3 : trois fichiers « vue 1. php » la vue « page_etudiants. php » le contrôleur

1. 3. Le modèle MVC (Modèle-Vue-Contrôleur) Modèle: gestion des données de l'application Vue: Affichage et interaction avec l'utilisateur Contrôleur: gestion de la logique du code (il prend les décisions)

1. 3. Le modèle MVC (Modèle-Vue-Contrôleur) L'architecture MVC (Modèle-Vue-Contrôleur)

1. 3. Le modèle MVC (Modèle-Vue-Contrôleur) Avantages du MVC Une conception claire et efficace Un gain de temps de maintenance et d’évolution du site (l'ajout et mise à jour des fonctionnalités est très facile) Une modularité qui offre une grande souplesse pour organiser le développement du site entre différents développeurs Une rapidité de développement

2. Frameworks de développement front-end

2. 1. Bootstrap § Bootstrap est un framework CSS qui fournie un cadre pour mettre en forme les pages web. § Bootstrap est une bibliothèque essentiellement de code CSS et avec une partie en Javascripte, § Il offre un ensemble de classe CSS prédéfinit qu’on peut utiliser dans le code HTML, § Il permet de gérer l’adaptation du site web sur des médias de taille différents, (Ressponsive Web design). § Il permet d’économiser énormément de temps et cela en utilisant les parties de code disponibles.

2. 2. Angular § Angular est un framework Java. Script Open Source développé par Google en 2009. § Il offre un haut niveau d'interactivité particulièrement apprécié en éveloppement Front End des applications Web (Saa. S, comparateurs, plateformes interactives). § Le principal inconvénient d’Angular est sa taille par rapport à d’autres frameworks. § Exemples de sites utilisateurs : o netflix. com o upwork. com o Youtube sur PS 3 o weather. com

2. 3. React § React n’est pas exactement un framework d’application web, mais une bibliothèque Java. Script créé et maintenu par Facebook en 2013. § Il fourni seulement les vues et les fonctions de callback pour rendre le code HTML. § Exemples de sites utilisateurs : o facebook. com o instagram. com (qui utilise également Django pour la partie serveur) o 6 play o Yahoo o Airbnb (utilise également Ruby on Rails)

§ Il existe d’autres frameworks concurrents comme: o Foundation, o Vue, o Ember, o Backbone, …

3. Frameworks de développement Back-End

3. 1. Le framework « Laravel » § C'est un famewok PHP open sources basé sur l'architecture MVC et crée en juin 2011, § Ils est actuellement l'un des frameworks PHP les plus populaires, §Il est composé de plusieurs bibliothèques issues d’autres frameworks, §Il permet de gérer les systèmes de cache, les envois d’emails, les sessions utilisateurs, la pagination de votre site ou encore créer des requêtes SQL. § il existe d’autres concurents tel que : Symfony, Zend Framework, Cake. PHP, …

3. 2. Le framework «Django » § C’est un framework Model-View-Template, Open Source , développé en Python, et sorti en 2005, § c’est le plus populaire et le plus ancien, § il fournit des techniques et des outils aux développeurs pour créer des application sécurisées. § Exemples de sites utilisateurs : o liberation. fr o instagram. com o openstack. org o mozilla. org § il existe d’autres concurents tel que : Flask, Tornado, Scrapy, …

3. 3. Le framework «Spring » § C’est un framework Model-View-Controller, Open Source , utilise Java, § c’ est l’un des plus anciens frameworks Java mais certainement l’un des meilleurs. § Il offre de nombreux outils pour développer, configurer et sécuriser des sites web. § Exemples de sites utilisateurs : o Wix, o. Ticket. Master o Bill. Guard § il existe d’autres concurents tel que : Jakarta. EE, Struts, Tapestry, …

3. 4. Le framework «ASP. NET» § C’est un framework Model-View-Controller Développé par Microsoft et supporté par Windows, et lancé en juillet 2000, § le moteur d'ASP. NET est un filtre branché sur le serveur web Internet Information Services (IIS). § Il est distribué avec le framework. NET. § ASP. NET peut être utilisé avec n'importe quel langage de programmation pour la plateforme. NET (Visual Basic . NET, C#, JScript…).