La communauté ASP.NET Rédo MVP-CODEWISE Rédacteur ASP-PHP.NET gregory@wygwam.com Pierre Lagarde Développeur.NET pierlag@microsoft.com A sp.net au service L’ DES MVPs

Agenda de la journée Part 1 Découverte de ASP.NET Mes premières pages Part 2 Utiliser les starters kits pour accélérer votre productivité Mutualisez et enrichissez des starter kits

Part 1

Découverte de ASP.NET

Mes premières pages

Part 2

Utiliser les starters kits pour accélérer votre productivité

Mutualisez et enrichissez des starter kits

Agenda Qu’est-ce que ASP.NET ?

Qu’est-ce que ASP.NET ?

Qu’est-ce que ASP.NET ? APS.NET c’est : Une architecture qui s’appuie sur le .NET Framework. Un modèle de développement. Une bibliothèque riche de contrôles Qui provient du Framework Qui provient de partenaires (Gratuit ou Payant) Son rôle : Simplifier le développement des applications WEB Améliorer leur exécution . L1

APS.NET c’est :

Une architecture qui s’appuie sur le .NET Framework.

Un modèle de développement.

Une bibliothèque riche de contrôles

Qui provient du Framework

Qui provient de partenaires (Gratuit ou Payant)

Son rôle :

Simplifier le développement des applications WEB

Améliorer leur exécution .

Qu’est-ce que ASP.NET ? (2) Principe: On applique le modèle de programmation Windows au monde du WEB (Événement) Cohabitation : Avec les scripts ASP, la cohabitation est possible tant qu’il n’y a pas partage de session Les applications ASP.NET ne fonctionne que sous IIS5 ou + et Cassini (pour le développement) Windows 2000 Windows XP Windows 2003 serveur L1

Principe:

On applique le modèle de programmation Windows au monde du WEB (Événement)

Cohabitation :

Avec les scripts ASP, la cohabitation est possible tant qu’il n’y a pas partage de session

Les applications ASP.NET ne fonctionne que sous IIS5 ou + et Cassini (pour le développement)

Windows 2000

Windows XP

Windows 2003 serveur

Démo 1 Première exemple Modèle Windows Modèle Web

Première exemple

Modèle Windows

Modèle Web

Caractéristiques Les pages ASP.NET sont compilées Le modèle peut utiliser une technique (Code Behind) permettant une séparation entre le code de présentation (html) et le code applicatif ASP.NET est basé sur un modèle composant coté serveur repose sur le Framework .NET (coté serveur) prend en compte les différentes capacités des navigateurs (support JavaScript, DHTML, …) L2

Les pages ASP.NET sont compilées

Le modèle peut utiliser une technique (Code Behind) permettant une séparation entre le code de présentation (html) et le code applicatif

ASP.NET

est basé sur un modèle composant coté serveur

repose sur le Framework .NET (coté serveur)

prend en compte les différentes capacités des navigateurs (support JavaScript, DHTML, …)

Web Forms Séparation présentation/logique Le contenu et le traitement sont séparés Les développeurs et les graphistes peuvent, en standard, travailler indépendamment Form1.asp Form1.aspx Form1.aspx.vb <balises> <balises> code code Fichiers distincts / séparation logique Un seul fichier ASP ASP .NET <balises> code code <balises> Form1.aspx

Le contenu et le traitement sont séparés

Les développeurs et les graphistes peuvent, en standard, travailler indépendamment

Web Forms Flux aspx / code-behind / événement Modèle de programmation événementiel Déclaration d’un handler, puis implémentation de celui-ci Dans la page ASPX <asp:button id=&quot;b1&quot; OnClick=&quot;b1_OnClick&quot; text=&quot;PostBack&quot; runat=&quot;server&quot;/> Dans le code behind private void b1_OnClick(Object sender, EventArgs e) {label1.Text = &quot;Test&quot; ;} OU Dans la page ASPX <asp:Button id=&quot;Button1&quot; runat=&quot;server&quot; Text=&quot;Button&quot;></asp:Button> Dans le code behind private void InitializeComponent() { this.Button1.Click += new System.EventHandler(this.Button1_Click);} private void Button1_Click(object sender, System.EventArgs e) {label1.Text = &quot;Test&quot; ;} Mapping des noms de contrôles « automatique » (même nom)

Modèle de programmation événementiel

Déclaration d’un handler, puis implémentation de celui-ci

Dans la page ASPX

<asp:button id=&quot;b1&quot; OnClick=&quot;b1_OnClick&quot; text=&quot;PostBack&quot; runat=&quot;server&quot;/>

Dans le code behind

private void b1_OnClick(Object sender, EventArgs e)

{label1.Text = &quot;Test&quot; ;}

OU

Dans la page ASPX

<asp:Button id=&quot;Button1&quot; runat=&quot;server&quot; Text=&quot;Button&quot;></asp:Button>

Dans le code behind

private void InitializeComponent()

{ this.Button1.Click += new System.EventHandler(this.Button1_Click);}

private void Button1_Click(object sender, System.EventArgs e)

{label1.Text = &quot;Test&quot; ;}

Mapping des noms de contrôles « automatique » (même nom)

Démo 2 La même démo en détail Découverte du flux aspx Compilation Intellisense Debug

La même démo en détail

Découverte du flux aspx

Compilation

Intellisense

Debug

Web Forms Les contrôles serveur Nombreux contrôles disponibles dans le framework Compatible avec tout navigateur HTML 3.2 Déclenche des événements côté serveur Contrôles basiques TextBox, CheckBox, Radio, Button Contrôles avancés AdRotator, Calendar, DataGrid, Validator L3

Nombreux contrôles disponibles dans le framework

Compatible avec tout navigateur HTML 3.2

Déclenche des événements côté serveur

Contrôles basiques

TextBox, CheckBox, Radio, Button

Contrôles avancés

AdRotator, Calendar, DataGrid, Validator

Web Forms Les contrôles serveur basiques <asp: textbox id=text1 runat=server/> text1.text = “Hello World” <asp: checkbox id=check1 runat=server/> check1.checked=True <asp: button id=button1 runat=server/> button1_onClick() <asp: calandar id=calandar1 runat=server/> calandar.onChange() <asp: DropDownList id=DropDownList1 runat=server /> DropDownList1.SelectedItem.Text = “Hello”

<asp: textbox id=text1 runat=server/> text1.text = “Hello World”

<asp: checkbox id=check1 runat=server/> check1.checked=True

<asp: button id=button1 runat=server/> button1_onClick()

<asp: calandar id=calandar1 runat=server/> calandar.onChange()

<asp: DropDownList id=DropDownList1 runat=server /> DropDownList1.SelectedItem.Text = “Hello”

Démo 3 L’état des composants coté client Contrôle Web Avancé (Calendar, …) Découverte du Viewstate IsPostBack

L’état des composants coté client

Contrôle Web Avancé (Calendar, …)

Découverte du Viewstate

IsPostBack

Web Forms Comment ça marche ! Aucun état sur le serveur : data émise/renvoyé dans le formulaire : champ caché Mécanisme de PostBack sur la même page Control générant un postback : Boutons, case à cocher, radio bouton… Test IsPostBack() dans le source L4

Aucun état sur le serveur :

data émise/renvoyé dans le formulaire : champ caché

Mécanisme de PostBack sur la même page

Control générant un postback :

Boutons, case à cocher, radio bouton…

Test IsPostBack() dans le source

Certain contrôles permettre d’aider le contrôl de saisie des formulaires RequiredFieldValidator RangeValidator CompareValidator CustomValidator RegularExpressionValidator Utilise du script client ou non suivant les possibilités du navigateur Aucun code à fournir pour les utiliser Web Forms Contrôles de validation

Certain contrôles permettre d’aider le contrôl de saisie des formulaires

RequiredFieldValidator

RangeValidator

CompareValidator

CustomValidator

RegularExpressionValidator

Utilise du script client ou non suivant les possibilités du navigateur

Aucun code à fournir pour les utiliser

Demo 4 Adaptation des composants Contrôle de validation

Adaptation des composants

Contrôle de validation

Session serveur Cookie Less Sauvegarde d’état coté server Session[&quot;MyData&quot;] = &quot;Valeur&quot;; Récupération de la valeur String s; s = Session[&quot;MyData&quot;] ;

Cookie Less

Sauvegarde d’état coté server

Session[&quot;MyData&quot;] = &quot;Valeur&quot;;

Récupération de la valeur

String s;

s = Session[&quot;MyData&quot;] ;

Accès aux données ASP.NET utilise le connecteur ADO.NET pour se connecter aux bases de données 4 éléments sont nécessaires pour récupérer un ensemble d’enregistrement provenant de la base Une Connection (Connexion à la base) Un DataAdapteur (Requêteur) Un DataSet (Conteneur d’enregistrement) Un contrôle qui permet d’afficher un ou plusieurs élément d’un DataSet

ASP.NET utilise le connecteur ADO.NET pour se connecter aux bases de données

4 éléments sont nécessaires pour récupérer un ensemble d’enregistrement provenant de la base

Une Connection (Connexion à la base)

Un DataAdapteur (Requêteur)

Un DataSet (Conteneur d’enregistrement)

Un contrôle qui permet d’afficher un ou plusieurs élément d’un DataSet

Accès aux données Exemple de contrôle d’accès Défini par <asp:DataGrid /> Afficher les données sous forme de table Permet de spécifier Le style (couleurs, polices, bordures, etc…) Des couleurs alternées L’entête Le pied de page La pagination Permet la mise à jour Permet le t ri de colonne Un enregistrement représente une ligne de la table

Défini par <asp:DataGrid />

Afficher les données sous forme de table

Permet de spécifier

Le style (couleurs, polices, bordures, etc…)

Des couleurs alternées

L’entête

Le pied de page

La pagination

Permet la mise à jour

Permet le t ri de colonne

Un enregistrement représente une ligne de la table

Démo Connexion DataSet DataGrid

Connexion

DataSet

DataGrid

Questions / Réponses

Cache et User Control Static Dynamic Dynamic Static

Code behind Séparation entre page et code La page web hérite d’une classe qui elle même dérivée de Page. <%@Page Language=&quot;C#&quot; Inherits=&quot;DemoCode&quot; Src=&quot;DemoCode.cs&quot; %> {…} public class DemoCode : Page {…} Objet Page (Framework) Objet DemoCode (Page ASPX) Objet DemoCode (Code behind) Flux Html Requête Web

Séparation entre page et code

La page web hérite d’une classe qui elle même dérivée de Page.

<%@Page Language=&quot;C#&quot; Inherits=&quot;DemoCode&quot; Src=&quot;DemoCode.cs&quot; %>

{…}

public class DemoCode : Page

{…}

Démo 4 Les Contrôles Utilisateurs Cache

Les Contrôles Utilisateurs

Cache

Configuration Déploiement Simplicité de déploiement: Déploiement par simple copie de fichier Lock image et non le fichier Permet la mise à jour « dynamique » des applications Configuration de l’application par : Web.config Global.asax Le répertoire /bin est l’assembly de l’application

Simplicité de déploiement:

Déploiement par simple copie de fichier

Lock image et non le fichier

Permet la mise à jour « dynamique » des applications

Configuration de l’application par :

Web.config

Global.asax

Le répertoire /bin est l’assembly de l’application

.NET c’est quoi ? Composants Sécurité Flux XML Simplicité et puissant Protocoles Standard Services Web Clients Riches Pages Web Mobilité XML Modèle Relationnel Toutes les bases

Le cœur du Framework CLI CLR Framework Class Library Données et XML Services Web Windows Forms Web Forms Common Language Specification VB C++ C# … J# Visual Studio .NET Soumis à l’ ECMA Soumis à l’ECMA Spécification ouvertes Accès aux données basé XML Basé XML, SOAP, GXA

Les classes du .NET Framework System System.Data (ADO .NET) System.XML System.Web (ASP .NET) Diagnostics Configuration Collections Net IO Threading Text Security Common OLEDB SQLTypes SQLClient XPath XSL Runtime InteropServices Remoting Serialization Serialization Configuration SessionState Caching Security Services UI HTMLControls WebControls System.Drawing Imaging Drawing2D Text Printing System.Windows.Forms (Windows / Windows CE / PocketPC) Design ComponentModel Schema Reflection Resources Globalization ServiceProcess Description Discovery Protocols

La compilation à la volée Fichier ASPX Browser Web IIS Réponse Réponse Classe de la page Instanciation, traitement, affichage Classe générée Génère Instancie Analyse moteur ASPX Requête Requête Classe Code Behind

WebService

Localisation

sécurité

Debug / Trace