le web mobile avec asp.net mvc et jquery mobile
Post on 10-Jun-2015
790 Views
Preview:
DESCRIPTION
TRANSCRIPT
ASP.NET MVC et jQuery Mobile
Le Web mobile avec ASP.Net MVC et jQuery
MobileGuillaume Leborgne
MVP Client devMCNEXT
François Guillot
ConsultantMCNEXT
http://www.mcnext.com
#mstechdaysASP.NET MVC et jQuery Mobile
Depuis votre smartphone sur :http://notes.mstechdays.fr
De nombreux lots à gagner toutes les heures !!!Claviers, souris et jeux Microsoft…
Merci de nous aider à améliorer les Techdays !
Donnez votre avis !
#mstechdaysASP.NET MVC et jQuery Mobile
ASP.NET MVC et jQuery Mobile#mstechdays
LE WEB
#mstechdaysASP.NET MVC et jQuery Mobile
• Il y a 5 ans
L’informatique & le web
#mstechdaysASP.NET MVC et jQuery Mobile
• Aujourd’hui
L’informatique & le web
#mstechdaysASP.NET MVC et jQuery Mobile
– Desktop– Smartphones– Tablettes– Liseuses– Bornes– TV connectées– Montres– Réfrigérateurs– …
Diversité des terminaux
#mstechdaysASP.NET MVC et jQuery Mobile
Les navigateurs
NokiaBlackberryBadaWebOS
OperaMiniNetFrontMyriadPhantom
SkyFireAmazon Silk…
Google Chrome
Mozilla Firefox
OperaApple Safari
Microsoft Internet Explorer
#mstechdaysASP.NET MVC et jQuery Mobile
Les navigateursAu total, environ 400 navigateurs ou versions différentes…
ASP.NET MVC et jQuery Mobile#mstechdays
APPROCHES POUR DU WEB MULTI-CANAL
#mstechdaysASP.NET MVC et jQuery Mobile
• Application multi-support– Exploite le responsive web
design (bootstrap)• S’adapte au périphérique
– Difficile à implementer sur des pages complexes
Choix de fonctionnement
#mstechdaysASP.NET MVC et jQuery Mobile
• Sites dédiés– Redirection gérée par le
serveur web– Liberté totale de
fonctionnement– Tout est à faire en
double
Choix de fonctionnement
#mstechdaysASP.NET MVC et jQuery Mobile
• Logique commune, affichage dédié– Ergonomie adaptée à
chaque appareil– Utilise le DisplayMode
de ASP.NET MVC– Le principe de
fonctionnement doit rester commun
Choix de fonctionnement
ASP.NET MVC et jQuery Mobile#mstechdays
RÉALISER SON APPLICATIONWEB MOBILE AVEC ASP.NET
démo
#mstechdaysASP.NET MVC et jQuery Mobile
CRÉER UN PROJET MOBILEAVEC VISUAL STUDIO 2013
#mstechdaysASP.NET MVC et jQuery Mobile
• Packages NuGet• Le module de
bundling• WebEssentials• DisplayMode• ASP.NET Web API
Les outils de Visual Studio
ASP.NET MVC et jQuery Mobile#mstechdays
JQUERY MOBILE
#mstechdaysASP.NET MVC et jQuery Mobile
• jQuery: Abstraction du navigateur
• jQuery Mobile: Widgets & abstraction de l’interface
• jQuery Mobile n’est PAS une librairie pour faire des Single Page Applications
Principe
#mstechdaysASP.NET MVC et jQuery Mobile
• Un themeroller• Des widgets imbriqués• Code par markup (data-…)• La gestion des différences
d’implémentation entre navigateurs (touch, …)
• Des classes CSS « clef en main »
Fonctionnement
#mstechdaysASP.NET MVC et jQuery Mobile
• Pensé pour le mobile (cross devices)• Responsive web design• Amélioration progressive• Accessibilité
• -> Accélère beaucoup les développements
Avantages
#mstechdaysASP.NET MVC et jQuery Mobile
• À partir d’Internet Explorer 8• Design parfois uniforme• Parfois lent sur les smartphones bas de gamme• Peut devenir contraignant si on sort des dogmes
d’ergonomie du framework
Défauts
démo
#mstechdaysASP.NET MVC et jQuery Mobile
WEB APP ASP.NET MVCUTILISANT JQUERY MOBILE
#mstechdaysASP.NET MVC et jQuery Mobile
• Attention aux sous-requêtes et à la consommation réseau– Minifier, concaténer et compresser (GZIP) les ressources– Optimiser les images, utiliser des sprites=> Utilisez les bundles ASP.Net, Webgrease, etc
• Tester sur des vrais terminaux, et si possible en condition réelles GSM
• Amélioration progressive=> Modernizr
• Combiner jQuery mobile avec un framework SPA• Tirer parti de HTML5 (app cache, …)
Les bonnes pratiques
© 2014 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.
Digital is business
top related