Découvrez les tendances technologiques Web de 2017 !

 

Ce mois-ci, s’est déroulée à Toulouse la première conférence DevFest dédiée aux développeurs de la ville rose. L’avis général sur cet événement est unanime : l’organisation et la qualité des conférences étaient un succès ! Les grands thèmes évoqués étaient d’actualité, au programme : Technologies Web & Mobile et Cloud & BigData.

Notre principal objectif : la satisfaction du client !

Alex Danvy (Microsoft), a ouvert la journée avec une Keynote axée sur la transformation du métier de Développeur. Il nous invite à accepter les changements toujours plus rapides que nous impose l’évolution des technologies. Il nous rappelle que notre principal objectif, la finalité de notre métier, ce qui nous pousse à faire du code propre, testé, fiable, performant, etc. : c’est avant tout “la satisfaction du client”. Il nous explique, alors que le Développeur ne correspond plus au cliché de l’expert associable, retranché derrière son écran, mais quelqu’un d’accessible, à l’écoute et pédagogue auprès d’interlocuteurs ne possédant pas son savoir technique.

En dehors des aspects purement techniques, la conférence permet d’avoir une vue globale des tendances. J’étais très impatient de découvrir comment les choses allaient évoluer du côté des technologies Web. Il y a un an, lors de la session 2015 du Devoxx, on nous présentait l’avenir du Web : ECMAScript 6, Angular 2, ReactJS, Web Components, Polymer, GWT 3, etc. avec une conclusion plutôt mitigée qui laissait le Développeur un peu livré à lui-même pour identifier une solution pérenne. A contrario, cette conférence a répondu à mes attentes et m’a beaucoup plus aiguillée.

De Angular à React (ou pas)

On peut tout d’abord remercier Gilles Debunne pour son excellente présentation qui nous éclaire sur le choix entre Angular et React. Son approche est intéressante : éveloppeur chevronné et convaincu par Angular (dans sa version 1.x), il se décide à faire un projet ReactJS, juste pour « sortir de sa zone de confort » et s’ouvrir à autre chose. Il nous livre son retour d’expérience en nous présentant des tableaux comparatifs, par fonctionnalité et en comparant les syntaxes des deux alternatives.
Globalement, il en ressort que la courbe d’apprentissage de React est très rapide avec « cette agréable sensation d’en avoir vite fait le tour ». D’un autre côté, il souligne bien qu’Angular est un framework, une boîte à outils qui contient tout le nécessaire, alors que React est plutôt une librairie. Si on en a effectivement vite fait le tour, il faudra la compléter d’autres librairies pour atteindre le même niveau de fonctionnalité.
Première agréable surprise, pour le Développeur Java que je suis, la démonstration présentée utilise le typage (ES6 ou TypeScript). Ce qui me surprend le plus, c’est que Gilles ne s’attarde pas sur ce point : c’est un détail, une norme, désormais c’est comme ça en JavaScript ! L’écriture de composants semble réellement plus naturelle en React. Les syntaxes présentées sont simples et compréhensibles, surtout lorsqu’elles sont comparées à la syntaxe compliquée des directives Angular. Finalement, la construction d’une application se résume à imbriquer des composants de manière arborescente.
Seule ombre au tableau, le databinding parfaitement efficace lorsqu’il s’agit de propager les modifications vers le bas de l’arbre, ne le permet pas dans le sens ascendant. La philosophie React s’appuie sur une autre approche : le Développeur devra remonter les informations en levant des évènements qui se propageront vers le haut et pourront être catchés par n’importe quel parent.
Sans pour autant prendre parti, notre orateur s’est laissé séduire par React comme la plupart des Développeurs qui utilisent cette solution.

PWA pour Progressive Web Apps

L’année prochaine, nous fêterons déjà les 10 ans des premiers Smartphones sur le marché. Tandis que la recherche de “LA” solution optimale, pour développer en une seule fois une application Web, Mobile et Desktop continue de battre son plein ; trois talks ont évoqué ce sujet en proposant des solutions différentes :

  • Sharing Code Between Web And Native Apps par Sebastian Witalec ;
  • Don’t call me just a WebSite anymore. I’m a progressive WebApp par Olivier Leplus ;
  • Wanna more fire ? Let’s try polymerfire par Sofiya Huts.

La première solution (détaillée ici), basée sur Angular 2 et NativeScript est typiquement une démonstration du découplage Vue/Controller apporté par le pattern MVC. La solution, s’appuyant sur le moteur JavaScript de chaque OS Mobile permet de produire des applications natives ou des applications web en mutualisant un maximum de code. L’inconvénient reste qu’il faut continuer d’écrire du code différent pour la vue en dupliquant celle-ci pour chaque plateforme cible.

Les deux autres sessions étaient dédiées aux « Progressive Web Apps ». Un peu comme le « DHTML », ce terme regroupe un ensemble de technologies, permettant à une application Web de couvrir les mêmes fonctionnalités qu’une application native :

  • Responsive Design : CSS3 et Media Queries ;
  • Always up to date : c’est le principe même des WebApp ;
  • Installable ;
  • Offline ;
  • Push Notifications (outside of a web page).

Les deux premiers points sont des aspects déjà connus de longue date. L’aspect “installable” existe déjà plus ou moins mais bien que standardisé par le W3C, cet aspect s’implémente différemment entre Android et iOS. Il s’agit principalement de fournir dans la page d’accueil web, les méta-données permettant de mettre l’application sur son bureau : titre, icônes de différentes résolutions, orientation, status bar. Android utilise un fichier manifest.json, iOS utilise les balises du header.
La gestion du mode “offline” se fait via une nouvelle API : les Service Workers. Il s’agit d’un « proxy » capable d’intercepter les événements liés à une ressource web. Chaque ressource a ainsi un cycle de vie (installing, waiting, active, etc.) et il est possible de gérer le cache de manière fine. De l’aveu même du Mozilla Developer Network, l’API est complexe mais permet de mieux gérer le mode “Offline” que la précédente solution AppCache.
Autre fonctionnalité indispensable pour combler l’écart entre les applications HTML5 et natives : les notifications arrivent dans le navigateur via l’API Web Notifications. Il s’agit ici, d’alerter l’utilisateur en dehors de la page web. L’API permet également de laisser un choix à l’utilisateur lors de la réception du message (pour une app de type TodoList : terminer une tâche, la reporter, voir le détail, etc.). La syntaxe présentée semble assez simple, de plus l’API est supportée par tous les navigateurs récents, exceptée la version mobile de Safari.

La session sur PolymerFire est un exemple d’implémentation d’une PWA basée sur les Web Components Polymer / Firebase. Firebase est une plateforme de Google qui regroupe tous les services permettant le développement d’une application mobile HTML5 : hébergement, base de données, push notifications, authentification avec OAuth, statistiques. Les WebComponent Polymerfire ont l’avantage de réduire la quantité de code JavaScript.

Pour conclure sur cette 1ère édition du DevFest Toulouse

Je suis agréablement surpris car les choses évoluent dans le bon sens ! Lors de cet événement, nous avons tous constaté que le typage en JavaScript est désormais considéré comme la norme. En effet, Angular 2 n’est plus présentée comme une nouveauté, mais comme une solution adoptée ! Dans un avenir proche, grâce aux Progressive Web Apps nous n’aurons plus à développer 3 fois la même application. Nous pourrons alors concentrer notre expertise sur le Web et plus sur un OS Mobile en particulier. Il faut bien évidemment que les grands acteurs du marché respectent les normes du W3C et n’y soient pas réfractaires dans le seul et unique but de maintenir leur marge au travers des Stores.

Pour aller plus loin

Vous souhaitez être accompagnés par PALO IT dans vos projets d’innovation digitale, d’application Mobile ou Web ? N’hésitez pas à contacter notre équipe commerciale pour en savoir plus sur notre offre Innovation et rencontrer nos différents Experts.

Share
Guillaume PARAMELLE
Guillaume PARAMELLE

1248

Leave a Reply

Your email address will not be published. Required fields are marked *