Bienvenue à Blogs CodeS-SourceS Identification | Inscription | Aide

The Mit's Blog

En plus d'intégrer et skier, il sait même écrire !
(Blog de Renaud Comte)

Actualités

[SPC12] JS Best Practices for coding Apps

une session de Scot Hillier, un pur MVP codeur et surtout un JS Fan de longue date

SPC 2012_thumb[1]_thumb

image en upload …

SP2013 demande clairement de bien connaitre et comprendre le javascript. Cette session veut nous donner les clés pour bien démarrer

L’ensemble des démos est dispo sur http://hillier.codeplex.com : Merci Scott !

trips and tricks

  • Always use “strict mode”
    • “use strict”;
    • impose plein de contrainte
    • durcit votre code et evite les fautes d’inattention du a la flexibilité de JS
  • Avoid coercitiv operator
    • like == et ===
  • Use pattern to structure your code
    • Singleton
    • Module
      • méthode interne / externe
    • Prototype
      • permet de définir des objets et d’utiliser le NEW

P1040618

  • Deferred object : Promises
    • Simplify asynchronous operations
    • SP demande plus d’une opération async , soit des nested calls …
      • tout devient complexe : spaghetti code ….
    • utilise l’objet Deferred object de JQuery
      • encapsulation de la complexite des nested calls
      • cache des call
    • incontournable si vous voulez survivre dans les apps JS

P1040619

Demo de Deferred

  • Soit une grid avec text et image
    • double call sur l’artiste et ses jaquettes de musiques
  • Création d’une app
    • attention, les apps ont des droits comme un user ! Ne pas le negliger, ex : cross domain …
    • définition des endpoints nécessaires
  • on utilise SP.WebRequestInfo
    • utilise les définition EndPoints
  • l’utilisation du deffered se fait dans la classe de rendu via la fonction de resolve
  • A noter : KnockOut pour le render

P1040620

Using libraries

  • segregate your code into libraries
  • minify libraries
    • soit MS AJAX Minifier
  • consider the use of a CDN
    • pointing an external url in the source element
    • utiliser MS ou Google pour récupérer les libraies JQuery
  • load SP libraries dynamically
    • permet à vos apps d’être contextuel
    • $.getScript

Demo

  • Spinner en html 5 et non un gif animé
  • sous VS
    • en debug : version lisible
    • en release : crucnh version
    • utilisation de ///reference pour l’autocomplete mais sur les fichiers debug
    • reference de script dans le code sur la release

App Practices

  • REST
  • MVVM Pattern
  • App UI guidelines

P1040621

Comprendre REST

    • REST : use URI to specify an operation
    • ODATA : maps CRUD to http verbs GET/POST/PUT/DELETE/PATCH
    • Please use REST
      • vous pouvez utiliser plus facilement toutes les libraries dsiponibles comme KO plein d’autre
      • Plus simple de faire du JS et être 365 ready avec un SP Host App que de faire du Provider Host App juste pour écrire du CS
    • Pour info
      • le CSOM et les ODATA call ne sont que des call sur le REST SVC de SP2013, soit _api

Bref, la voie est tracé, il faut la suivre, tout simplement

  • utiliser le $.getJson
    • vous permet d’utiliser data.d.title directement sans parser le XML Sourire
    • plus efficace que de le faire en JS pur via $.ajax
      • profitez tous de JSON !

P1040622

MVVM

  • Ce pattern permet de séparer litteralement les données de sa presentation et de les synchroniser sur MAJ
  • Le ViewModel sert de bus de communication.
  • La librarie de référence : Knockout.js
    • Arrêtez de concaténer et d’injecter votre html : binder le tout simplement !!!

P1040624P1040625

AppUI guidelines

  • permet de recuperer le charting de votre site SP dans votre App
    • WebTemplate pour ASPX
    • Chrome contol en JS pour les pages HTML

Demo

  • Utilisation de
    • chrome control pour la navigation : var json pour déclarer l’ensemble des pages de l’apps
    • KO
      • KO monitor un tableau
      • tout le code charge des objets JS et les ajoute à la fin au tableau
      • KO s’occupe de binder lui meme la grid

Conclusion

Session de haut niveau si jamais vous n’avez pas toujours plongé dans la puissance du JS et de ses “codes”

Scott donne de vrais bonnes clés pour bien démarrer dans le développements d’application business réelles sans tomber dans les pièges de débutant

Désormais les Best Practices de SP incluent celles du monde Client Side
(Aurelien Verla, si tu lis ce post, je sais que tu savoures ce moment Clignement d'œil )

Pensez à vite downloader ces samples Sourire et ensuite à bien les décortiquer

Ce sera vite une question de qualité et ou de survie

Renaud Comte [MVP]
Live from Vegas

Mots clés Technorati : ,,
Ce post vous a plu ? Ajoutez le dans vos favoris pour ne pas perdre de temps à le retrouver le jour où vous en aurez besoin :
Posted: mercredi 14 novembre 2012 09:37 par themit
Classé sous : , ,

Commentaires

Aurelien a dit :

JavaScript Everywhere !

# novembre 15, 2012 14:18
Les commentaires anonymes sont désactivés

Les 10 derniers blogs postés

- « Naviguer vers le haut » dans une librairie SharePoint par Blog de Jérémy Jeanson le 10-07-2014, 13:21

- PowerShell: Comment mixer NAGIOS et PowerShell pour le monitoring applicatif par Blog Technique de Romelard Fabrice le 10-07-2014, 11:43

- ReBUILD 2014 : les présentations par Le blog de Patrick [MVP Office 365] le 10-06-2014, 09:15

- II6 Management Compatibility présente dans Windows Server Technical Preview avec IIS8 par Blog de Jérémy Jeanson le 10-05-2014, 17:37

- Soft Restart sur Windows Server Technical Preview par Blog de Jérémy Jeanson le 10-03-2014, 19:43

- Non, le certificat public du CA n’est pas un certificat client !!! par Blog de Jérémy Jeanson le 10-03-2014, 00:08

- Windows Server Technical Preview disponible via MSDN par Blog de Jérémy Jeanson le 10-02-2014, 19:05

- Focus Sauvegardes SharePoint par Le blog de Patrick [MVP Office 365] le 10-02-2014, 13:11

- Technofolies, votre évènement numérique de l'année par Le Blog (Vert) d'Arnaud JUND le 09-26-2014, 18:40

- Xamarin : From Zero to Hero par Fathi Bellahcene le 09-24-2014, 17:35