Wilfried Woivré & .Net

Silverlight 3.0 et les .Net RIA Services

AOÛT12

Dans la continuité d’un de mes articles sur Silverlight et les différents moyens d’accéder aux données soit via l’utilisation du JSon, ou par des services Web (WCF …). Il en manquait inévitablement un sur les .Net RIA Services. Alors les .Net RIA Services en deux mots, qu’est-ce que c’est, c’est une nouvelle mouture d’ADO.Net pour Silverlight. En effet, lors de la conception d’application Silverlight, on avait vu que cela péchait pour récupérer les données, vu que Silverlight est une technologie cliente. Il fallait donc, comme le montre le schéma ci-dessous  pour accéder aux données contenues dans notre base depuis notre interface, passer par le code métier et ensuite, via un service arrivé à notre base de données pour effectuer la requête. C’est donc ce que l’on appelle une architecture n-tiers, facile à implémenter et facilement maintenable. image Cependant ce découpage est bien souvent pas respecté pour beaucoup de projets, il n’est donc pas rare de voir les différentes parties clientes mélangées, ainsi que le côté serveur pour des questions de rapidité de développement. On a donc généralement une architecture de ce type pour finir. image Cette facilité de développement, j’avoue peut être intéressante dans l’instant lorsque l’on n’a absolument pas l’habitude de bien séparer les diverses couches d’une application, ou que l’on ne veut pas implémenter de Design Pattern (comme le MVVM) dans son projet en plus. Néanmoins, la reprise de tel projet par la suite est d’autant plus dur … Alors maintenant, voyons comment nous structurons nos données avec .Net RIA Services image Bon maintenant que nous avons vu comment est construit une application Silverlight utilisant les .Net RIA Services, on va pouvoir en faire une. Alors pour base de données, je vais prendre celle de NorthWind non modifié, vous pouvez la trouver à ce lien si vous ne l’avez pas. Alors pour commencer nous allons créer une nouvelle application Silverlight de type Business Application. Ce type d’application est ajouté après avoir installer les .Net RIA Services. Maintenant que notre projet est créé, nous allons accéder à notre base, donc dans notre projet ASP.Net, nous allons créer cet accès avec Entity Framework,  avec lequel nous allons récupérer tous les employés de la base Northwind. Donc jusque là, rien de bien anormal par rapport à un autre projet Silverlight que vous auriez pu faire avant. Maintenant, toujours dans le projet ASP.Net, nous allons créer un nouvel item qui s’appelle “Domain Service Class”, on peut le trouver dans la partie Web, comme on peut le voir ci dessous : image Maintenant, nous avons un deuxième écran qui nous demande quels éléments seront disponibles du côté client. Pour la démonstration, nous allons donc choisir les “Employees”, et la possibilité d’éditer ceux-ci. image Cette classe nous génère donc entre autre ce code ci :
    // Implements application logic using the NorthwindEntities context.
    // TODO: Add your application logic to these methods or in additional methods.
    [EnableClientAccess()]
    public class NorthwindDomainService : LinqToEntitiesDomainService<NorthwindEntities>
    {

        // TODO: Consider
        // 1. Adding parameters to this method and constraining returned results, and/or
        // 2. Adding query methods taking different parameters.
        public IQueryable<Employees> GetEmployees()
        {
            return this.Context.Employees;
        }

        public void InsertEmployees(Employees employees)
        {
            this.Context.AddToEmployees(employees);
        }

        public void UpdateEmployees(Employees currentEmployees)
        {
            this.Context.AttachAsModified(currentEmployees, this.ChangeSet.GetOriginal(currentEmployees));
        }

        public void DeleteEmployees(Employees employees)
        {
            if ((employees.EntityState == EntityState.Detached))
            {
                this.Context.Attach(employees);
            }
            this.Context.DeleteObject(employees);
        }
    }
}
Comme on peut le voir, cette action nous permet de générer tous ce qu’il faut pour lire et modifier des employés de la base, bien entendu rien ne vous empêche d’en rajouter, pour des questions de performances, comme par exemple, une partie qui ne retourne seulement 10 employés de la base au lieu de toute la base. L’autre partie qui est généré sont les metadatas nécessaire pour le bon fonctionnement de la communication avec les .Net RIA Services. Donc maintenant qu’on a crée notre partie accès aux données, ainsi que notre code métier, et le service pour accéder à nos données, nous n’avons plus qu’à gérer le côté client en Silverlight. Alors commençons par la partie XAML, pour notre exemple, nous allons afficher les noms et les prénoms des employés de la base de données :
                <ListBox ItemsSource="{Binding}" Margin="0,50,0,0" Height="300">
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <StackPanel Orientation="Horizontal" >
                                <TextBlock Text="{Binding FirstName}"
                           Width="250" />
                                <TextBlock Text="{Binding LastName}" />
                            </StackPanel>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
Nous allons maintenant charger les données depuis la base grâce aux RIA Services :
private void Page_Loaded(object sender, RoutedEventArgs e)
{
    var context = new NorthwindDomainContext();
    DataContext = context.Employees;
    context.Load(context.GetEmployeesQuery());
}
Nous chargeons les données de façon assez simple, grâce à une requête Linq, ou à la méthode context.GetEmployeesQuery() qui renvoie ceci :
public EntityQuery<Employees> GetEmployeesQuery()
{
    return base.CreateQuery<Employees>("GetEmployees", null, false, true);
}
Soit toutes les données de la table Employees. Bien entendu, toutes ces opérations avec .Net RIA Services sont asynchrone afin que l’application reste fluide pour l’utilisateur. Alors pour conclure sur cet article, et sur cette technologie, les .Net RIA Services sont très puissant pour toutes les applications Business, néanmoins la faille que je vois par rapport à un service classique en WCF, c’est que les .Net RIA Services sont orientés uniquement pour Silverlight, alors qu’un service WCF permet de partager l’accès aux services entre divers types d’application. Voilà bien entendu je vous fournis le code source de l’application, il faudra bien entendu changer la chaine de connexion à la base de données. image Ressouces : Un très bon lien sur .Net RIA Services que je vous conseille : http://blogs.msdn.com/brada/archive/tags/RIAServices/default.aspx
Remonter

Entity Framework : Trucs et astuces

MARS21

Un article sur les trucs et astuces avec Entity Framework puisqu'après tout c'est la méthode d'accès aux données que je préfère, donc je vais vous en faire profiter. Dans cet article pas de code source au final, juste divers morceaux de codes et screenshots. Avant la base de données de démos :

Comme vous pouvez le voir, c'est les tables « Orders » et « Order_Details » de la base Northwind. Utilisation des classes partielles : Donc comme vous le savez si vous avez fait du Merise, dans une base de données on ne doit mettre aucunes données calculées. C'est-à-dire que pour une commande, on n'a pas de champ « Total », vu qu'en fait c'est la somme des (prix article * nombre d'exemplaire), c'est donc pour cela que dans notre base de données nous n'avons pas le total. Cependant on peut utiliser les classes partielles pour ajouter cette fonctionnalité à notre code. Pour cela il faut rajouter dans le même namespace que le fichier edmx une classe partielle « Orders ». Voici par exemple un code que l'on pourrait voir : namespace ApplicationConsole1

{ public partial class Orders

{

public decimal Total

{

get { return Order_Details.Sum(n => n.Quantity * n.UnitPrice); }

}

} } Et donc grâce aux classes partielles, nous obtenons :

Voilà j'espère que cette astuce vous fera gagner du temps dans vos prochains développement, en tout cas moi j'en use et en abuse. De plus, les classes partielles sont aussi présentes dans le dbml de Linq To Sql !

Remonter

L’ASP.Net MVC et Silverlight

MARS16

Alors un nouvel article, après un petit moment d'absence.

Cet article va porter sur le modèle MVC dans un site ASP.Net et la possibilité d'intégrer Silverlight dans l'application, sans pour autant modifier l'architecture de l'application.

Alors on va commencer par créer l'application ASP.Net MVC sans le module Silverlight, pour la démonstration, on va créer une application gérant des notes.

Bien entendu, le code source de l'application sera en lien à la fin de cet article.

Donc la création du projet ASP.Net MVC :

alt

Dans cet exemple, on ne va pas utiliser les tests unitaires. On arrive donc à une architecture de type MVC classique.

alt

Maintenant nous allons créer la base de données que nous allons utiliser dans cet application.

Pour ajouter la base de données, nous avons soit le choix de la mettre dans la solution où alors héberger cette base au travers un moteur de base de données. Pour la démonstration, nous allons utiliser Sql Serveur 2008.

On crée donc la base NotesDB comme ci-dessous :

alt

Dans cet article, nous allons Entity Framework afin de relier notre base de données à notre application, on obtient donc un modèle de données de ce type.

alt

On rajoute bien entendu notre fichier « edmx » dans la partie « Models » de l'application.

Maintenant que nous avons relié notre application à la base de données, il nous faut créer les différentes méthodes pour utiliser au mieux cette base. Nous allons donc créer une interface « INoteService » et une classe « NoteService » qui implémentera l'interface précédente. Ci-dessous le code de l'interface.


public interface INoteService

{


IEnumerable<Note> ListNotes();


Note GetNote(int id);


void CreateNote(Note noteToCreate);


void EditNote(Note noteToEdit);


void DeleteNote(Note noteToDelete);

}

Afin de ne pas surcharger l'article, je ne mets pas le code de la classe, mais elle utilise avant tout la syntaxe Linq, et les différentes propriétés d'Entity Framework.

Passons maintenant à la partie « C » de MVC J. On rajoute donc un contrôleur à notre application.

alt

Alors nous allons créer un « NoteController.cs » qui regroupera nos différents contrôleurs, ci-dessous les constructeurs de la classe, et le contrôleur pour la page Index.


public class NoteController : Controller

{


private INoteService _service;


public NoteController() : this(new NoteService()) { }


public NoteController(NoteService service)

{

_service = service;

}


public ActionResult Index()

{
return View(_service.ListNotes());

}

Pour la création des vues, nous allons utiliser le simple clic droit sur la méthode Index.

alt

Donc pour les autres vues, on utilisera le même principe. Faisons un point sur l'architecture du projet actuellement :

alt

Nous avons donc nos 3 contrôleurs (MVC) :

  • Account
  • Home
  • Note

Notre partie modèle (MVC) contenant :

  • L'accès à la base de données via Entity Framework
  • Notre classe, et son interface, pour accéder à la table Note

Notre partie (MVC) vue contenant pour chacun des contrôleurs :

  • Les différentes vues associés : Par exemple, pour nos Notes, nous avons « Index », « Create », « Edit », « Delete »

De plus nous avons aussi le dossier « Shared » qui contient les différentes pages d'erreur, puisque c'est toujours plus jolie qu'une fameuse page jaune, et aussi les différentes MasterPage de l'application.

Maintenant passons à l'intégration de Silverlight dans ce projet. Comme on peut le voir ci-dessus, le principe de l'ASP.Net MVC injecte des données dans la page, afin qu'elle soit affichées et traitées dans l'application. On peut donc chercher comment ajouter ces données dans l'application Silverlight, cependant les personnes ayant développé le framework ASP.Net MVC ont pensé à nous les développeurs Silverlight, puisqu'il nous ont fournit la classe « JsonResult ». Donc pour passer les données à l'application Silverlight nous allons ajouter une méthode au contrôleur.


public ActionResult List()

{

return Json(_service.ListNotes());

}

Cette méthode va nous permettre de sérialiser la liste des notes au travers du navigateur.

Passons à la création du projet Silverlight que nous nommerons « SLNotes » (oui je sais, je fais dans l'original aujourd'hui)

alt

On relie notre application Silverlight dans notre projet « Notes ». Maintenant passons à la création de l'application, cependant éviter que cet article ne soit trop long, je vais juste créer la partie qui affiche la liste des Notes. Il nous faut donc pour cela une « ListBox », dont voici le code :


<ListBox x:Name="lstNotes" ItemsSource="{Binding}">


<ListBox.ItemTemplate>


<DataTemplate>


<StackPanel Orientation="Horizontal">


<TextBlock Text="{Binding DateSaisie}" Margin="5" />


<TextBlock Text="{Binding Libelle}" Margin="5" />


</StackPanel>


</DataTemplate>


</ListBox.ItemTemplate>


</ListBox>

Maintenant passons à la partie du code behind qui elle sera nettement plus interessante, du moins à mon goût J

void Page_Loaded(object sender, RoutedEventArgs e)

{


WebClient wc = new WebClient();

wc.OpenReadCompleted += new OpenReadCompletedEventHandler(wc_OpenReadCompleted);

wc.OpenReadAsync(new Uri("http://localhost:1295/Note/List"));

}


void wc_OpenReadCompleted(object sender, OpenReadCompletedEventArgs e)

{


DataContractJsonSerializer json = new DataContractJsonSerializer(typeof(List<Note>));

List<Note> notes = (List<Note>)json.ReadObject(e.Result);

lstNotes.DataContext = notes;

}

Donc dans le Page Load, on retrouve nos objets que nous avons sérialiser tous à l'heure. Puis par la suite, lorsque le traitement est terminé nous ajoutons nos objets à notre liste.

Maintenant que l'application Silverlight est prête, il faut l'ajouter dans notre application. Afin de ne pas recréer une énième vue, nous allons ajouter notre objet Silverlight dans la page Index

<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
<param name="source" value="ClientBin/SLNotes.xap" />

<param name="onerror" value="onSilverlightError" />

<param name="background" value="white" />
<param name="minRuntimeVersion" value="2.0.31005.0" />

<param name="autoUpgrade" value="true" />
<a href="http://go.microsoft.com/fwlink/?LinkID=124807"
style="text-decoration: none;">
<img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight"
style="border-style: none" />
</a></object>

Comme on peut le voir on utilise la balise object pour intégrer notre partie en Silverlight et non la balise <asp:Silverlight /> qui demande quand à elle de rajouter un Script Manager ainsi qu'un formulaire, ce qui n'est pas utile dans cette application.

altOn voit ici dans le résultat que nous avons bien notre Note qui s'affiche dans la ListBox.

Donc pour conclure cet article, ce que je peux c'est que l'intégration d'une application Silverlight à l'intérieur d'un site en ASP.Net MVC peut enrichir de façon très conséquente vos applications.

Cependant un point négatif que j'ai repéré, c'est qu'il faut soit relier les entités à nos applications Silverlight via WCF par exemple, ou il faut recopier intégralement les entités à l'intérieur de nos applications Silverlight, comme j'ai du le faire dans ce cas ci.

Et voilà comme promi le code source de l'application (note : il faudra sûrement modifier le port de votre Visual Studio ou alors modifier le code source pour l'application Silverlight)

alt

Remonter