On voulait que notre site, il reflète un peu ce que l’on est, congruence, tussah tussah.
Du coup, on s’est dit que ce qui serait rudement chouette, c’est qu’il soit simple pour tout le monde, pour les lecteurs et pour ceux qui veulent contribuer à la construction.
Dans la boîte, chacun peut s’occuper de ce qu’il lui plaît et lui tient à coeur, pour le site, c’est un peu tout pareil !
On a donc mis en place un mode collaboratif permettant à tout le monde, même Célia (qui est commerciale de profession), d’effectuer une modification du développement à la production, et ce, sans rien installer !
Il y a moultes façons de présenter une application et son fonctionnement aux utilisateurs.
La règle d’or de base veut que l’ergonomie porte le sens de l’application, mais quand tout est neuf, il est bien difficile de s’y repérer, même avec la meilleure ergonomie du monde.
On a de plus en plus souvent de nos jours, une petite introduction en douceur des mécanismes de l’outil, souvent via un petit tutoriel qui nous permet de comprendre comment cela fonctionne.
Des fois, ça peut-être une documentation écrite, parfois des vidéos, parfois autre chose, parfois rien.
Les 25 et 26 septembre dernier, j’ai assisté à la première édition de la déclinaison française de la conférence Socrates (@Socrates_FR). Nous étions 30 Craftsmens passionnés regroupés dans le magnifique château de Rochegude, situé dans le sud de la Drôme, près d’Orange. Socrates est une « un-conférence » pour les développeurs sur 2 jours qui se différencie des autres conférences « classiques » du fait qu’elle est en mode open-space. Contrairement aux autres conférences où les organisateurs choisissent les speakeurs, le programme n’est pas déterminé à l’avance. Chaque participant apporte son expérience et ses connaissances qu’il peut partager comme bon le lui semble. Socrates rassemble des développeurs passionnés de TDD, Software Craftsmanship, DDD … La conférence est en anglais et reste assez agnostique d’un point de vue technique. Cette année, Java, C# et JavaScript étaient les langages les plus représentés
Cette semaine, nous avons été confrontés à un problème particulier avec AngularJs.
Le navigateur affichait +500Mo de charge mémoire sur notre solution AngularJs, ce qui est bien trop avec un seul onglet.
En réalité, en observant les statistiques du nombre de watchersprésents (avec ng-stat ou AngularJs Batarang) dans les différentes pages, nous avons découvert une fuite mémoire.
Chaque fois que nous cliquions sur un produit, 52 watchers s’ajoutaient aux déjà présents. Même comportement si nous revenions sur un produit sélectionné auparavant.
En réalité, la sélection d’un produit provoque un appel au serveur afin de récupérer le template destiné à être intégré dans un contrôle comprenant code html et directives éléments ou attributs AngularJs. Ce code sera donc interprété par le compile d’AngularJs.
Auteur original, de notre ancien blog : Philippe Beroucry
Vous n’avez jamais entendu parler d’AureliaJS et vous n’êtes toujours pas parti en vacances ? Alors, Soft’it vous propose d’assister à un apéro autour de ce framework JavaScript très prometteur.
Ce premier meetup, organisé par Etienne Folio et Quentin Raynaud, permettra d’aborder le futur de ce meetup mais également :
D’échanger autour d’Aurelia
De discuter sur les différents frameworks ES6 actuellement disponibles
La version 1.5 de TypeScript est en production avec un certain nombre de nouveautés. L’équipe de développement ne fait pas que faire évoluer le langage mais ambitionne de le faire devenir un outil incontournable dans le développement de projets web.
Chez Soft’it, la connaissance est bien plus qu’un simple mot. En tenant compte aussi bien de notre Expertise .Net, Coaching qualité ou encore de nos formations, les collaborateurs de Soft’it se mettent régulièrement à jour en matière de nouvelles technologies.
Force est de constater que le nouveau framework JavaScript de Google (AngularJS) s’immisce dans tous les nouveaux projets Web actuels; l’équipe estime que cette technologie doit être impérativement maîtrisée par tous les membres pour garantir des applications Web de plus en plus robustes et puissantes.
Pour la toute première fois sur Paris, le site ng-workshop propose une formation AngularJS du 3 au 5 décembre incitant les développeurs à s’appliquer sur la qualité plus que sur la quantité dans leurs projets. Pour vous donner un avant-goût des futurs articles que nous ferons autour d’AngularJS, nous aborderons durant la formation des sujets tels que :
Construire et tester une
application Communiquer avec un serveur backend Sécuriser votre application Internationaliser une application
AngularJS Packager et déployer son application AngularJS
Trois membres de l’équipe Soft’it vont participer à cette formation :
Bien évidemment, ces trois personnes se feront un plaisir de vous rédigez plusieurs articles sur cette formation pour vous donner l’envie de découvrir ce framework indispensable à l’avenir du développement Web 🙂
Dans cet article, nous allons voir comment le plus simplement possible, vous allez pouvoir utiliser jQuery DataTables (version 1.10 minimum) en mode serveur, pour récupérer vos données via ASP.Net MVC 5.
Il existe déjà plusieurs projets qui montrent comment utiliser ASP.Net MVC avec jQuery DataTables, mais au final, dans tous les exemples que j’ai trouvé, ils utilisaient tous un custom IModelBinder pour pouvoir faire le binding des différentes propriétés avec un View Model. Sauf qu’en utilisant MVC 5 et jQuery DataTables 1.10 (et supérieur), ce custom binding n’est pas nécessaire, et il enlève une bonne épine du pied.
La mise en place d’une DataTables en mode serveur avec ASP.Net MVC va se faire en plusieurs étapes :
Création des View Models
Création de la vue
Création du Controller et des services
Et parce qu’il est toujours intéressant de pouvoir ajouter des filtres personnalisés, nous finirons par :
Ajout de filtres supplémentaires
Création des View Models
DataTables envoie et récupère des données sous un certain format qui lui est spécifique. À partir des informations fournies par la documentation, nous récréons d’abord les View Models.
Et le View Model des paramètres qui sont envoyés par DataTables à la requête AJAX. La seule propriété qui ne fait pas partie de la requête est « SortOrder », qui est une propriété maison permettant de faire un tri sur nos données via la méthode d’extension SortBy<T> de l’objet IQueryable<T>.
Ensuite, la partie JavaScript qui fait appel à DataTables. Il n’y a rien de particulier dans ce code, c’est la configuration de base de DataTables pour :
faire les appels en mode serveur (processing: true et serverSide: true)
lui indiquer que la page à appeler est notre méthode GetData de notre HomeController
une méthode pour récupérer une liste de produits suivant une recherche, un tri, et une pagination
une méthode qui permet de compter le nombre d’éléments suivant le filtre donné (pour que la pagination soit effective côté jQuery DataTables).
Nous avons à présent une démo fonctionnelle qui nous permet de lister les produits de manière paginée, de changer le nombre d’éléments par page, et de rechercher un produit par son nom :
Ajout de filtres supplémentaires
Il peut toujours être intéressant de passer des données supplémentaires à vos appels AJAX qui sont faits par DataTables, ne serait-ce que pour ajouter des filtres, passer un ID supplémentaire, etc…
Toutes ces données sont à ajouter dans le paramètre data de DataTables.
On va modifier un peu la vue et le JavaScript pour ajouter un panel de filtre sur nos prix minimum et maximum; et un bouton pour lancer la recherche.
Nous avons maintenant une vue qui nous permet de sélectionner un prix minimum et maximum. Mettons à jour le Controller et les services pour prendre en compte ces nouvelles données.
Nous passons dans l’appel AJAX deux nouvelles propriétés (MinPrice et MaxPrice), que nous allons mettre dans une classe FilterViewModel très simple :
Et nous faisons évoluer notre méthode GetData du Controller pour prendre aussi un FilterViewModel en paramètre, et passer les valeurs à nos deux méthodes de service :
Nous avons maintenant une démo qui nous permet avec jQuery DataTables 1.10 de faire des requêtes serveur sur notre site MVC 5 en ajoutant des filtres personnalisés, tout cela en quelques minutes seulement.
Et, comme je le signalais au début de l’article, il existe déjà plusieurs projets qui ont été faits pour MVC / jQuery DataTables; projets qui peuvent vous intéresser si vous utilisez des versions précédentes de MVC et/ou jQuery DataTables :