asp.net from zero to hero

1

A S P . N E T M V C

F r o m z e r o t o h e r o

Software Developmen

t

Done

Right

2

Présentation

Cellenza est un cabinet de conseil IT dédié au technologies Microsoft et aux méthodes Agiles.

Notre mission consiste à jouer le rôle de bras droit et de tiers de confiance pour nos clients afin de les accompagner dans l’adoption des meilleures pratiques techniques et méthodologiques.

Afin de les aider à concevoir, développer et faire évoluer vos applications et SI, nous fédérons au sein de notre cabinet des consultants et coachs Agiles de grande qualité.

3

Nicholas Suter

Architecte logiciel

Spécialisation : homme à tout faire

Qui sommes nous ?

Georges Damien

Consultant .NET

Spécialisation : web

4

Historique de MVC chez Microsoft

Comment ça marche ?

REST et http

Le routage

Razor

Pourquoi on y passe tous ?

ASP.NET MVC : from zero to hero

5

Le pattern émerge dans les années 70 dans des projets Smalltalk… et est formalisé en 1988. C’est une des premières tentatives de formalisation du développement d’IHM.2009 : ASP.NET MVC2010 : ASP.NET MVC 2 Client-side validation,

Data Annotations2011 : ASP.NET MVC 3 Razor2012 : ASP.NET MVC 4 Web API2013 : ASP.NET MVC 5 Unification ASP.NET,

Identity et Web API 2

Historique de MVC chez Microsoft

6

Comment ça marche ?

Vue

Modèle

Ce avec quoi intéragit l’utilisateur

HTML + Razor + Javascript

La logique métier et la persistance des données

C# + SQL Server

La gare de triage : interroge le modèle, choisit et peuple la vue

C#

ContrôleurNavigateur

web

http request

http response

Action

Data

DataVue peuplée

7

REST et http

Architecture RESTfull : qui respecte le protocole http… et donc ses verbes

Verbe http Equivalent CRUD

Description

Supporté par ASP.NET MVC

Supporté par ASP.NET Web API

GET Select Sert à requêter le modèle

Oui Oui

POST Insert Créé un ou des nouveaux éléments

Oui Oui

PUT Update Modifie un ou des éléments

Oui

DELETE Delete Supprime un élément

Oui

8

La configuration du routage se fait dans App_Start/RouteConfig.cs :

Le routage

public static void RegisterRoutes(RouteCollection routes) { routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

routes.MapRoute( name: "Default", url: "{controller}/{action}/{id}", defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional } ); }

9

{controler} = la classe contrôleur{action} = nom de la méthode de la classe contrôleur{id} = identifiant de l’objet à manipuler (optionnel)

Le routage par défaut est suffisant pour de petites applicationsPour les applications plus conséquentes, on utilisera les zones (Area).

Le routage

10

Le routage

1. Réception de la requête http : GET: /Account/Login

2. Exécution de Controllers/AccountControler.Login()

3. Peuplement de la vue Views/Account/Login.cshtml

4. Envoi de réponse http avec la vue peuplée

11

Les zones

A utiliser quand le nombre de vues et de contrôleurs deviennent trop élevésPeuvent avoir un système de routage propre à chaque zone

public class AdminAreaRegistration : AreaRegistration { public override string AreaName { get { return "Admin"; } }

public override void RegisterArea(AreaRegistrationContext context) { context.MapRoute( "Admin_default", "Admin/{controller}/{action}/{id}", new { action = "Index", id = UrlParameter.Optional } ); } }

12

C’est quoi ? Le moteur de rendu introduit avec ASP.NET MVC 3 pour remplacer le vieux moteur ASP.NET Webforms

En quoi c’est mieux ?Moins verbeuxPlus testableSupporte l’Intellisense

Les principesDes helpers HTMLDes boucles, des conditionnelles, des switch…L’accès au Framework

Razor

13

Razor

@using Microsoft.AspNet.Identity@if (Request.IsAuthenticated){ using (Html.BeginForm("LogOff", "Account", FormMethod.Post, new { id = "logoutForm", @class = "navbar-right" })) { @Html.AntiForgeryToken()

<ul class="nav navbar-nav navbar-right"> <li> @Html.ActionLink("Hello " + User.Identity.GetUserName() + "!", "Manage", "Account", routeValues: null, htmlAttributes: new { title = "Manage" }) </li> <li><a href="javascript:document.getElementById('logoutForm').submit()">Log off</a></li> </ul> }}else{ <ul class="nav navbar-nav navbar-right"> <li>@Html.ActionLink("Register", "Register", "Account", routeValues: null, htmlAttributes: new { id = "registerLink" })</li> <li>@Html.ActionLink("Log in", "Login", "Account", routeValues: null, htmlAttributes: new { id = "loginLink" })</li> </ul>}

14

ActionLink Un lien vers une méthode d'action.BeginForm Déclaration d'un formulaire et lien vers la méthode d'action qui restitue le formulaire.CheckBox Une case à cocher.DropDownList Une liste déroulante.Hidden Informations du formulaire invisibles pour l’utilisateur.ListBox Une zone de liste.Password Une champ texte pour mot de passe.RadioButton Un bouton radio.TextArea Une zone de texte (ou champ texte multiligne).TextBox Un champ texte.

Razor

15

Vous aimez vraiment Webforms ? Mais genre… vraiment ? Le ViewState, le cycle de vie de la page, le moteur ASPX, les contrôles, etc.Le pattern est propre et adapté au webLa séparation claire des responsabilités entre les intégrateurs et les développeursLes vues sont du pur HTML (+ JS + CSS), les contrôleurs et le modèle sont du pur C#La testabilité du système (on y reviendra, mais pas forcément aujourd’hui)

Pourquoi on y passe tous ?

16

Allez plus loin : http://blog.cellenza.com http://www.asp.net/mvc

Formations intra (sur mesure) et extra entreprise : http://training.cellenza.com/ formation@cellenza.com

Nous contacter :info@cellenza.com

Nous rejoindre :recrutement@cellenza.com

Allez plus loin