Tout savoir sur le développement d’applications web

Au sommaire

• Qu’est-ce qu’une application web ?
• Différents types d’applications web
  • Les applications web statiques
  • Les applications web dynamiques
  • Les applications web hybrides
  • Les applications web progressives (PWA)
• Quelques exemples d’applications web
  • Les plateformes de commerce en ligne
  • Les solutions de gestion de la relation client (CRM)
  • Les logiciels de gestion intégrée (ERP)
  • Les systèmes de gestion de contenus (CMS)
• Le processus de développement d’une application web
  • 1. La planification
  • 2. Les requis
  • 3. Le design et le prototypage
  • 4. Le développement logiciel
  • 5. Les tests et l’assurance qualité
  • 6. Le déploiement
  • 7. La maintenance
• Les technologies utilisées pour construire des applications web
  • Le code côté client
  • Le code côté serveur
• Les frameworks web
  • Bien choisir son framework
  • Les frameworks du front-end
  • Les frameworks du back-end
• Combien coûte le développement d’une application web ?
• Les clés du succès
  • Avoir des objectifs clairs
  • Investir dans les interfaces utilisateur
  • S’assurer de la sécurité
  • Avoir une infrastructure performante
  • Prévoir la montée en charge
  • Avoir une application résiliente
  • Trouver le bon partenaire technologique

Qu’est-ce qu’une application web ?

Les applications web sont le plus souvent des applications de type client-serveur qui reposent sur les technologies du web pour le rendu de l’interface et les interactions avec l’utilisateur. Elles sont donc généralement accessibles via un navigateur standard (Google Chrome, Firefox, Microsoft Edge, Opera, Vivaldi, etc.). C’est le cas par exemple pour les suites applicatives Google Workspace et Microsoft 365.

Elles se distinguent d’un site web classique par leur interactivité et par la capacité donnée à l’utilisateur de manipuler des données et d’accomplir des tâches parfois sophistiquées. De fait, en matière de fonctionnalités, elles se rapprochent souvent des applications traditionnelles, tout en s’en distinguant souvent quant à l’aspect, l’expérience utilisateur et parfois la facilité d’utilisation. Si vous avez déjà eu l’occasion d’utiliser l’application desktop Microsoft Office et sa version application web, Office 365, vous savez de quoi il retourne.

L’interface utilisateur d’une application web peut aussi être encapsulée dans une application de visualisation web, ce qui permet de réaliser autant des applications mobiles (grâce à UIWebView sur iOS et WebView sur Android) que des applications “desktop” (grâce au framework Electron par exemple, qui inclut le moteur de rendu web Chromium). Une application de visualisation web est en fait un navigateur réduit à sa plus simple expression, sans interface de navigation, qui ne permet d’accéder qu’à une seule application en ligne. Des applications courantes comme WhatsApp, Twitch, Microsoft Teams et Slack reposent sur cette technologie.

Les applications web offrent de nombreux avantages :

• Quand elles s’exécutent côté client dans un navigateur, aucune installation complexe n’est nécessaire pour l’utilisateur. Elles sont ainsi immédiatement fonctionnelles.
• Elles n’exigent pas de l’utilisateur d’effectuer des mises à jour logicielles. C’est toujours la dernière version qui “tourne”.
• Elles sont généralement peu exigeantes du côté matériel (espace disque, puissance de calcul) pour le client.
• Elles sont par nature multiplateformes sur ordinateur de bureau (Windows, Mac, Linux). C’est aussi souvent le cas pour les applications web optimisées pour le mobile (iOS et Android).
• La même application et vos données peuvent être utilisées facilement sur différents appareils, l’ordinateur de votre entreprise et votre ordinateur personnel par exemple, ce qui peut être utile dans un contexte de télétravail.
• Les données stockées à distance ouvrent la porte à des usages collaboratifs simplifiés (plusieurs utilisateurs modifiant en même temps un même document, par exemple).
• Etc.

Différents types d’applications web

Les applications web statiques

Plutôt que d’assembler des pièces de contenu dans des processus côté serveur avant de les envoyer à l’utilisateur, ce genre d’applications web s’appuie entièrement sur le navigateur client pour gérer l’interaction et le rendu du contenu. En d’autres termes, une application web statique ne dépend pas d’un serveur pour la fourniture de contenus dynamiques, mais seulement d’un serveur web standard qui délivre des fichiers statiques. Elle repose entièrement sur les technologies du web et est donc composée de fichiers HTML, CSS, JavaScript et d’images (GIF, JPEG, SVG). La manipulation du rendu (HTML+CSS) se fait au sein du navigateur, via JavaScript.

L’un des avantages des applications web statiques est l’économie en ressources côté serveur, puisqu’elles sont simplement des fichiers stockés sur un serveur web ordinaire (HTTP) et envoyés tels quels à l’utilisateur final. Vous n’avez pas à gérer d’infrastructure capable de supporter la montée en charge provoquée par la multiplication de processus actifs sur votre serveur au fur à mesure que le nombre d’utilisateurs de l’application croît. Aussi, il est possible de produire des applications capables de fonctionner hors-ligne. Cela étant dit, leur domaine d’application est somme toute limité.

Les applications web dynamiques

Les applications web dynamiques reposent sur un serveur web pour servir les fichiers au navigateur client (Apache, Nginx, Lighttpd, etc.) et sur un serveur applicatif pour produire le contenu qui répond aux requêtes du client. La technologie du serveur applicatif peut faire appel à différents langages de programmation comme nous le verrons plus loin.

L’inconvénient de ces applications dynamiques est qu’elles ont besoin d’une connexion permanente au serveur sur lequel une instance de l’application s’exécute. Cette connexion peut être exigeante en bande passante pour une application complexe et, sans connexion adéquate, l’utilisateur risque de subir des lenteurs et des dysfonctionnements. En cas de coupure à l’accès Internet, l’application ne peut plus du tout fonctionner. Aussi, plus il y a d’utilisateurs, plus l’infrastructure côté serveur doit être robuste pour supporter la montée en charge.

Les applications web hybrides

Nous les citons pour être exhaustif d’un point de vue théorique et parce que cette dénomination est parfois utilisée. Ces applications dites hybrides ont une partie des fonctionnalités qui s’exécutent en local au sein du navigateur grâce à JavaScript et une autre qui est traitée sur un serveur distant. Elles tiennent donc à la fois de l’application web statique que de l’application web dynamique. Dans la pratique, la plupart des applications web dynamiques actuelles sont en fait aussi hybrides dans une certaine mesure, puisqu’elles font appel à des scripts JavaScript exécutés en local (ne serait-ce que pour injecter du contenu dans le HTML du client via Ajax, une technique basée sur JavaScript).

Les applications web progressives (PWA)

Les applications web progressives (PWA) sont une manière de développer des applications web, qui vise plus particulièrement le mobile et qui met l’accent sur la qualité de l’expérience utilisateur, quels que soient l’appareil utilisé et la qualité de sa connectivité. C’est une sorte une norme qui est soutenue par Google, notamment pour sa plateforme Android. Il est possible de mesurer le pourcentage de conformité d’une application au “standard” PWA. Dans la pratique, il s’agit d’applications web statiques (voir plus haut).

Quelques exemples d’applications web

Les applications web sont omniprésentes sur Internet. Dès que vous êtes sur un site transactionnel, vous faites en fait face à une application web. Elles sont aussi de plus en plus courantes en tant que SaaS (“software as a service” ou logiciel en tant que service). Ces logiciels, gratuits ou vendus sur abonnement, sont accessibles via un navigateur et peuvent être presque aussi sophistiqués qu’une application native pour ordinateur. La suite Office 365 est un bon exemple de SaaS et depuis peu de temps, Adobe propose une version application web tout à fait convaincante de son logiciel phare, Photoshop. Ce qui démontre qu’il est possible de faire des choses très ambitieuses avec les applications web.

Les applications web peuvent aussi se faire discrètes à un tel point que la plupart de leurs utilisateurs ignorent qu’ils interagissent avec une application web. C’est le cas des applications web encapsulées, qui se présentent sur l’ordinateur comme une application standard et qui ne nécessitent pas l’usage d’un navigateur. Ces applications sont réalisées à l’aide de frameworks comme Electron qui combine le moteur de rendu Chromium (le moteur d’affichage du navigateur Chrome) et le runtime Node.js.

Les plateformes de commerce en ligne

Les sites de commerce en ligne sont des applications web qui peuvent prendre à charge de nombreuses fonctionnalités, allant du traitement des commandes à la gestion du stock. Les très gros acteurs comme Amazon ont développé leur propre application qui répond très spécifiquement à leurs besoins. Les petites et moyennes entreprises ont recours à des solutions SaaS comme Shopify par exemple. Ce genre de plateforme offre tous les outils nécessaires à la création et au lancement de sites de commerce électronique, y compris la gestion des produits et de la chaîne d’approvisionnement, et l’intégration des systèmes de paiement.

Les solutions de gestion de la relation client (CRM)

Un logiciel de CRM (pour “customer relationship management”) est un outil conçu pour aider les entreprises à offrir à leurs clients une expérience unique et à entretenir la relation avec eux afin de développer les ventes. Il fournit un portrait complet de toutes les interactions avec les clients et offre des outils sophistiqués de suivi des ventes. Il permet un travail collaboratif entre différentes équipes comme les ventes et le marketing. Des exemples de solutions de gestion de la relation client populaires sont les plateformes Salesforce et HubSpot.

Les logiciels de gestion intégrée (ERP)

Un logiciel d’ERP (pour “enterprise resource planning”) constitue la colonne vertébrale de bien des entreprises en centralisant de nombreuses fonctions essentielles comme la gestion des ressources humaines, la gestion comptable et financière, l’aide à la décision, etc. Ces importants logiciels sont de plus en plus proposés en tant que SaaS, c’est-à-dire en tant qu’application web sur abonnement. Parmi ces solutions en ligne, on trouve Microsoft Dynamics 365, Oracle NetSuite ERP, Sage X3 ERP, SAP Business ByDesign, Plex Manufacturing Cloud, etc.

Les systèmes de gestion de contenus (CMS)

Pour gérer des contenus en ligne, c’est-à-dire bâtir un site web, on a aujourd’hui recours à deux solutions. La première est d’installer une application, par exemple Drupal ou ProcessWire, sur un serveur. La seconde, plus simple, est d’avoir recours à une plateforme SaaS où tout est préinstallé, par exemple Wordpress.com, Squarespace ou Wix. Dans tous les cas, ce sont toujours des applications web pour la partie “back office”, c’est-à-dire les interfaces qui vous permettent de gérer vos contenus.

Le processus de développement d’une application web

Le processus développement d’une application web est similaire à celui de toute autre application. Il passe par des étapes toutes indispensables à la réussite du projet.

1. La planification

La planification est une phase fondamentale du développement d’une application web, basée essentiellement sur des rencontres exploratoires et d’analyse avec l’équipe multidisciplinaire chargée du développement. Elle vise à atténuer les risques et à partir sur de bonnes bases. Il ne faut pas la bâcler ou l’esquiver, car c’est souvent là que se décide le futur succès ou l’échec. Elle sert à définir le concept, à préciser les contours du produit final, à identifier le public cible et à jauger la pertinence de chaque fonction offerte.

2. Les requis

Cette étape reprend le travail effectué à l’étape de planification et ajoute un niveau de détail supplémentaire pour aboutir à un inventaire le plus exhaustif possible des besoins et des objectifs de l’application web. La transcription de ceux-ci se détaille en fonctionnalités applicatives qui pourront être priorisées en équipe (par “sprints” dans le cadre d’un développement mené avec la méthodologie Agile) pour le design et le développement. À la fin de cette tache, vous avez normalement tous les éléments pour évaluer les coûts du projet.

3. Le design et le prototypage

Lors de cette phase, une fois les requis bien définis, on réalise une schématisation de l’architecture de l’application web. Celle-ci peut prendre différentes formes. Elle peut décrire l’architecture technologique (matérielle et logicielle) et les interfaces exposées à différents services ou à des sources de données, par exemple.

Aussi, une analyse de l’expérience usager (User Experience) permet de bâtir des maquettes fonctionnelles (Wireframes) pour valider la fonctionnalité visuelle (User Interface), l’ergonomie et l’usage efficient de navigation au sein de l’application. L’objectif de la conception UX/UI d’une application web est de créer d’excellentes expériences utilisateur via des interfaces interactives, intuitives, fluides, efficientes et conviviales. Le succès d’une application web repose en grande partie sur la qualité de son design qui influe sur la façon dont les utilisateurs adoptent et utilisent toutes les fonctionnalités.

Diverses preuves de concepts peuvent donner lieu à des prototypes fonctionnels. Ceux-ci sont testés et validés du côté frontal (Front-End) avec des utilisateurs représentatifs du public cible avant de pouvoir se lancer dans la prochaine étape. Spiria offre un service de “processus Découverte” qui inclut ces trois premières phases. Son l’objectif est de planifier tout futur produit logiciel et d’offrir en fin de parcours des prototypes fonctionnels et une feuille de route claire et complète.

4. Le développement logiciel

Comme le nom l’indique, c’est l’étape où les développeurs écrivent le code de l’application (Front-End et Back-End) et connectent les interfaces pour atteindre les objectifs définis. Suivant la plateforme côté serveur et le type d’application web, les développeurs sont appelés à utiliser différents langages de programmation et outils logiciels. Tout ceci est développé en détail dans la section “technologies utilisées” que vous trouverez plus bas.

Dans le cadre de la méthodologie Agile-Scrum, la plus courante, c’est un processus itératif. Le client est associé tout au long du processus et il est en mesure de suivre, tester et approuver les fonctionnalités déjà codées et à venir. Ceci permet de livrer une solution opérationnelle en fonction des besoins priorisés par cycles de développement (les “sprints”).

5. Les tests et l’assurance qualité

Pendant la phase de développement, divers tests mettent à l’épreuve l’application web afin de valider son comportement, sa sécurité, ses performances et son fonctionnement dans différents environnements côté client (réels ou virtuels). Il s’agit de contrôler une grande quantité d’aspects : l’application répond-elle de la façon attendue dans tous les cas de figure ? Les interfaces s’affichent-elles correctement sur différents formats d’écrans et dans différentes orientations dans le cas du mobile ? Sont-elles suffisamment réactives ? L’application gère-t-elle correctement la bande passante du réseau ? Est-ce que les détails des comptes-utilisateurs sont stockés de façon suffisamment sécurisée ? Etc.

Les équipes suivent des plans de tests et les résultats sont passés en revue. Durant ce travail d’assurance qualité (AQ), il y a une rétroaction continuelle entre les analystes qualité et les développeurs pour supprimer tout dysfonctionnement, erreur ou non-conformité aux attentes. Une fois que tous les problèmes relevés par les analystes qualité ont été résolus, l’application est prête à être déployée. La réalisation de tests d’assurance qualité approfondis pendant le processus de développement est le seul moyen de s’assurer que l’application web sera stable, utilisable et sûre dès son premier jour.

6. Le déploiement

Le déploiement marque la fin des développements et des tests sur l’application web. Il marque le grand jour où des utilisateurs vont pouvoir découvrir votre application. Cette phase est constituée pour la plupart des applications web de la mise à disposition de l’application client sur une plateforme de diffusion et du transfert de l’application serveur et des bases de données qui lui sont rattachées sur un environnement de production.

Des fournisseurs d’infrastructure dédiée aux services web, comme Amazon Elastic Compute Cloud (EC2) ou Microsoft Azure App Services, proposent des outils qui simplifient et sécurisent le déploiement d’une application web sur leurs serveurs.

La dernière étape est de connecter les côtés client et serveur afin que le routage des requêtes et réponses via HTTPS se fasse correctement. On peut utiliser un équilibreur de charge pour recevoir les demandes faites par le client via le front-end et les acheminer vers les instances du back-end qui renverront une réponse au client. Là encore, les principaux fournisseurs infonuagiques proposent des outils performants comme l’Elastic Load Balancing qui distribue automatiquement le trafic entrant des applications sur plusieurs instances Amazon EC2. Comme il est très fortement indiqué de le faire, tout le trafic entre le client et le serveur doit être encrypté. On aura donc besoin d’un certificat SSL à jour.

7. La maintenance

C’est une phase où, typiquement, une autre équipe prend la relève. Cette nouvelle équipe est en quelque sorte un service à la clientèle post-déploiement. À la suite d’une période de stabilisation de la solution déployée, l’équipe de support et maintenance reste en alerte face aux demandes du client, au monitorage de la performance, aux rapports de plantages et aux problèmes signalés par les utilisateurs finaux. C’est elle aussi qui s’assurera que l’application restera compatible avec de nouvelles générations de navigateurs web et de nouvelles versions de systèmes d’exploitation.

Notez qu’une assistance rapide aux utilisateurs finaux et la mise en production fréquente de correctifs pour améliorer l’application sont essentielles pour maintenir l’engagement des utilisateurs. Encouragez aussi les utilisateurs à vous faire part de leurs commentaires et suggestions concernant votre application. Ils peuvent être une aide majeure dans l’amélioration de votre application.

Les technologies utilisées pour construire des applications web

Dans sa forme la plus courante, une application web dynamique repose sur une architecture client-serveur dite à “trois tiers”. Le premier tiers est l’affichage sur le poste du client. Celui-ci est pris en charge par le navigateur grâce aux technologies du web (principalement HTML, CSS et JavaScript). Le second tiers réside sur un serveur et s’occupe de recevoir les requêtes du client et d’y répondre de façon appropriée. C’est la “logique applicative”. On peut choisir parmi une très grande variété de technologies pour prendre en charge ce tiers, et on peut aussi parfois faire appel à plusieurs d’entre elles pour une seule application (la logique applicative est alors décomposée en plusieurs entités). Le dernier tiers est le stockage des données. C’est une base de données classique qui répond aux requêtes du second tiers. Le choix des technologies est ici plus restreint. On y trouve les très classiques MySQL, PostgreSQL, Microsoft SQL Server, Oracle, SQLite, MongoDB, etc.

Le code côté client

Il s’agit du code qui est téléchargé par le client afin d’assurer l’affichage de l’interface et les transactions de données avec le serveur. Ce code se répartit en trois parties : le HTML, les feuilles de styles et le JavaScript. Pour le réaliser, on peut soit partir de zéro, soit avoir recours à un ou plusieurs frameworks. Les frameworks ont l’avantage d’accélérer les choses et offrent généralement un ensemble de conventions qui facilite le travail à plusieurs.

Le code côté serveur

L’application qui “tourne” sur le serveur peut-être codée en ayant recours à une grande variété de langages de programmation, par exemple : C#, Java, Python, Ruby, PHP. Cette application reçoit les requêtes HTTP du client, les traite et retourne au client les réponses attendues. Là aussi, on peut faire appel à des frameworks de développement, chaque langage en offrant un ou plusieurs.

Les frameworks web

Bien choisir son framework

Bien choisir son framework est une opération toujours délicate, car les conséquences d’un mauvais choix sont toujours une perte de temps et d’argent. Changer d’outil en cours de développement n’est jamais souhaitable et rester bloquer avec une architecture inappropriée générera des problèmes pendant toute la durée de vie de l’application.

Différents critères sont à considérer dans ce choix :

• Les besoins de l’application. En premier lieu, il est important de bien définir ce que l’application devra faire avant de choisir un framework. Avec une bonne idée des besoins de l’application, il est bien plus facile d’orienter les recherches afin d’établir une première liste de frameworks à évaluer.
• La popularité du framework. La popularité du framework n’est pas un critère technique, mais il est cependant très important pour guider le choix. Plus le framework est populaire, plus sa communauté est active. Cela signifie plus de réponses aux problèmes courants sur des sites comme StackOverflow, plus de tutoriels, plus de plug-ins, plus de contributions open-source, etc. Aussi, la popularité est un gage de pérennité de la solution.
• La qualité documentation. Celle-ci peut être très variable suivant les frameworks. Il est donc important de jeter un coup d’œil à la documentation afin de vérifier si elle est bien complète. De nombreux exemples et tutoriels sont généralement de bons indices d’une bonne documentation. Aussi, vérifiez que la documentation est à jour avec la dernière version du framework.
• Les coûts. Un facteur à considérer lors du choix d’un framework est que certains ne sont pas gratuits, ou seulement partiellement gratuits, ou encore ne sont disponibles que sur des plateformes payantes.
• L’extensibilité fonctionnelle. De nombreux frameworks sont extensibles via des modules ou plug-ins. Examinez la richesse et la variété du catalogue offert avant de faire votre choix. Il y a peut-être le module qui vous fera économiser du temps de développement sur une fonction clé.
• La compatibilité avec l’architecture existante. L’application peut avoir à s’intégrer dans une architecture plus large ou sur des serveurs qui imposent des limites aux langages et frameworks possibles. Par exemple, si vous utilisez déjà Microsoft .NET pour des services interagissant avec la base de données ou pour de la logique d’affaires, il peut être intéressant d’opter pour ASP.NET pour vos applications web.
• Les compétences de l’équipe. Avoir un ou plusieurs développeurs qui maîtrisent déjà le framework envisagé, ainsi que le langage sur lequel il repose, est un atout considérable. Cela signifie moins de temps d’apprentissage et ne pas tomber dans le piège des erreurs les plus communes. Si personne dans l’équipe ne connaît le langage Ruby, il n’est sans doute pas très raisonnable de se lancer avec Ruby on Rails, à moins d’avoir beaucoup de temps à perdre.
• La sécurité. Dernier point, mais non le moindre. Certains frameworks mettent l’accent sur la sécurité et activent par défaut des protections de base, alors que d’autres demandent au développeur d’y penser. Il est aussi important d’utiliser un framework régulièrement mis à jour pour colmater d’éventuelles brèches dès qu’elles sont découvertes, ce qui est un argument supplémentaire en faveur du critère de la popularité. Enfin, il faut faire très attention aux plug-ins que l’on va utiliser, car ils peuvent introduire des failles dans un framework autrement sûr.

Les frameworks du front-end

Les frameworks web côté client sont basés sur JavaScript et TypeScript (un surensemble syntaxique de JavaScript qui est développé par Microsoft). Nous détaillons ci-après quelques exemples parmi les plus courants, mais la liste est très loin de s’arrêter là.

React est une bibliothèque JavaScript gratuite et open-source qui est extrêmement populaire et qui est utilisée par d’innombrables applications web. Maintenue par Facebook et une communauté de développeurs, elle permet de construire des interfaces utilisateur hautement interactives via la création de composants. À l’usage, React se montre particulièrement flexible et performante, en utilisant un DOM virtuel et en ne mettant à jour le rendu dans le navigateur qu’en cas de réelle nécessité.
⇨ reactjs.org.

Vue est une bibliothèque JavaScript développée par un ancien ingénieur de Google et soutenue par une communauté de développeurs. Dotée d’une excellente documentation et de fonctionnalités qui n’ont rien à envier de la concurrence (dont un DOM virtuel), cette bibliothèque légère jouit d’une grande popularité tout à fait méritée. C’est le framework de choix quand il s’agit de bâtir une application web progressive.
⇨ vuejs.org.

Angular est un framework basé sur TypeScript et développé par Google. Privilégiant la stabilité, la robustesse et la sécurité à l’innovation, il constitue le framework idéal pour le développement de grosses applications d’entreprise. Angular convient plus aux applications complexes qu’à celles hautement interactives. Si sa courbe d’apprentissage est peut-être plus abrupte, une fois maîtrisé, il permet des développements rapides et robustes.
⇨ angular.io.

Ember est un framework JavaScript d’un apprentissage aisé qui est doté d’une communauté très vivante. Existant depuis plus de 10 ans, il offre une bibliothèque de plug-ins étoffée et mature. Il offre la possibilité de faire le rendu du DOM côté serveur (dans Node.js via FastBoot). Le fort accent mis sur la productivité et les conventions de structure vous évite un développement anarchique et facilite le travail collaboratif, à la différence de React, par exemple, qui offre peu de garde-fous. Si vous aimez les choses bien organisées et toutes à leur place, Ember est fait pour vous.
⇨ emberjs.com.

JQuery figure parmi les plus anciens frameworks JavaScript et est toujours bien vivant et largement utilisé. Il est accompagné d’une forte communauté, d’un grand choix de plug-ins et offre de multiples possibilités de manipulation du DOM. S’il est tout à fait approprié pour bon nombre d’applications, il se montre toutefois plus lourd à utiliser que des frameworks plus modernes et perd en popularité chez les développeurs.
⇨ jquery.com.

Backbone est une librairie JavaScript à architecture MVC qui vous encourage à traduire vos données en modèles, les manipulations de DOM en vues, et à les lier entre elles par des événements. Légère, elle est un bon choix pour la création d’applications web simples, de petite taille et monopages.
⇨ backbonejs.org.

Svelte n’est pas vraiment un framework ou une librairie. C’est en fait un compilateur qui offre une approche radicalement différente dans la construction d’interfaces web. Cet outil, bien que plus confidentiel, est très aimé de ses utilisateurs. Il permet de réaliser des projets en codant beaucoup moins qu’avec d’autres frameworks. Le processus de compilation à l’avantage de produire seulement le JavaScript utile à votre application ; le client n’a pas à charger toute une bibliothèque JavaScript. Bref, il est bien plus économique en ressources qu’un React ou un Vue.js et se montre donc très rapide et réactif pour l’utilisateur final.
⇨ svelte.dev.

Les frameworks du back-end

Une large palette de langages est utilisable pour bâtir une application web. Aussi, c’est souvent le choix du langage qui conditionne le choix du framework adéquat.

Django (Python) est un framework MVC gratuit et open source de haut niveau qui permet des développements rapides et qui encourage un design propre et pragmatique. Il prend en charge une grande partie des problèmes liés au développement web, notamment la sécurité, ce qui vous permet de vous concentrer sur l’écriture de votre application sans avoir à réinventer la roue. Basé sur Python, le code Django est facile à lire et à maintenir. Il constitue un choix avisé pour quantité d’applications web.
⇨ www.djangoproject.com.

Ruby on Rails (Ruby) est un framework MVC basé sur le langage Ruby et dont la philosophie est proche de celle de Django. Lancé en 2004, il a révolutionné à son époque le développement d’applications web et la plupart des frameworks modernes lui doivent beaucoup. Doté d’une bonne documentation, il est soutenu par une large communauté aussi enthousiaste qu’accueillante. Les applications RoR peuvent poser quelques défis lors du déploiement en production et même si son apprentissage est au départ assez aisé, les choses se corsent assez vite quand il s’agit d’aborder des problèmes plus complexes.
⇨ rubyonrails.org.

ASP.NET Core (C#, F#) est le framework web open-source de Microsoft. Modulaire, il est conçu pour le développement d’applications lourdes et complexes et surpasse aisément les autres frameworks pour cette tâche. Il peut opérer sur plusieurs plateformes et fonctionne de manière complètement transparente avec les frameworks JavaScript modernes côté client (React, Angular, Vue, Ember). Les développeurs bénéficient du puissant environnement de développement intégré Microsoft Visual Studio, ce qui aide à leur productivité.
⇨ “What is ASP.NET Core?”

Laravel (PHP) est le framework MVC de choix pour les développeurs PHP. Sa syntaxe est réputée expressive et élégante. Cependant, côté performance, Laravel est un cran en dessous bien d’autres frameworks comme Django ou Express. La popularité de Laravel est directement liée à celle de PHP.
⇨ laravel.com.

Flask (Python) est un microframework, c’est à dire minimaliste à la base, mais cependant extensible via des modules, qui est très populaire chez les Pythonistes. Il possède une bonne documentation et une communauté active. Il est un excellent choix quand il s’agit de fournir des services web sur des petits systèmes aux ressources limitées (par exemple, sur une carte Raspberry Pi ou un microcontrôleur Arduino).
⇨ palletsprojects.com/p/flask/.

Express (Node.js/JavaScript) est un framework minimaliste pour le populaire Node.js. Comme Flask, il lui manque à la base de nombreuses fonctionnalités. Vous devez les ajouter selon vos besoins via des composants. C’est un outil de choix pour les développeurs JavaScript de front-end qui souhaitent ajouter le savoir-faire back-end à leur palette. De nombreux frameworks full-stack (c'est à dire alliant frameworks front-end et back-end) reposent sur Express pour le back-end. Citons par exemple Feathers, KeystoneJS, Kraken, LoopBack, MEAN et Sails.
⇨ expressjs.com.

Spring Framework (Java) est un outil puissant, riche en fonctionnalités et bien conçu pour les développements en Java. Il offre une collection de modèles de programmation et de configuration qui visent à simplifier et à rationaliser le processus de développement d’applications web. Il est privilégié dans les projets où la maturité et la stabilité sont plus importantes que la vélocité de développement.
⇨ spring.io.

Combien coûte le développement d’une application web ?

Le coût de développement d’une application web est bien sûr extrêmement variable. Chaque application est unique et répond à des besoins spécifiques qui varient en nombre et qui peuvent être plus ou moins complexes.

Imaginez que vous deviez construire une autoroute. Pour évaluer son coût, vous auriez à répondre à quantité de questions. Quelle est la longueur de l’autoroute projetée ? Combien de voies comporte-t-elle ? Y a-t-il des expropriations à faire ? Quelle est la nature des sols ? Y a-t-il des zones à traverser qui nécessitent des attentions particulières ? Des murs antibruit seront-ils requis en milieu urbain ? Combien d’échangeurs et de ponts ? Etc. Etc. Les réponses à toutes ces questions ont toutes un impact, plus ou moins important, sur le coût final. Pour le développement d’une application, c’est un peu la même chose. Il faut trouver les bonnes questions à se poser et y répondre. Mais, rassurez-vous, la construction d’une application web est un processus normalement moins lourd et moins onéreux que pour une autoroute…

Pour le coût d’une application web, de nombreux facteurs entrent en ligne de compte, mais les principaux sont la portée et la complexité du projet qui vont se traduire en temps de développement, et donc, en argent. Si une application très simple peut revenir à quelques milliers de dollars, une autre offrant de nombreuses fonctions et ayant à traiter des données sensibles peut en coûter 500 000, et même bien plus, et demander plus de 10 mois avant d’être livrée. Le seul moyen de réaliser une estimation précise est de faire l’inventaire le plus exhaustif possible des besoins et des objectifs de l’application web. Cette opération se fait lors de la phase de planification et de collecte des requis (voir plus haut).

Si vous n’avez pas le budget nécessaire pour le développement de l’application que vous souhaitez, la réduction de la portée et de la complexité est votre principal levier d’action. Commencez par définir ce que serait votre produit minimum viable (PMV), c’est-à-dire l’application qui répondra aux besoins essentiels de ses utilisateurs, sans aucune fonction superflue ou dont l’utilité n’est pas parfaitement validée.

Les avantages du produit minimum viable sont multiples. Par exemple :

• En mettant rapidement et à moindre coût l’application sur le marché, le PMV peut permettre de commencer à générer des revenus qui serviront à financer les futurs développements.
• Une application fonctionnelle qui a déjà des utilisateurs aide à aller chercher l’appui d’investisseurs.
• Vous pourrez améliorer itérativement l’application en répondant à de réelles attentes exprimées par vos premiers utilisateurs et éviterez de dépenser de l’argent sur des fonctions qui ne seront dans les faits pas ou peu utilisées.

Il est aussi important de se souvenir qu’il n’y a pas que le coût du développement à prendre en compte. Il y a aussi des frais récurrents, fixes et variables, tout au long de la vie de l’application. Dans le cas d’une application web dynamique, il y aura les coûts liés à l’infrastructure (serveurs, sauvegardes, etc.), à d’éventuels services tiers et à des licences logicielles. Il faut aussi penser aux opérations de maintenance, au support, aux mises à jour, aux améliorations de fonctionnalités, etc.

Les clés du succès

Avoir des objectifs clairs

Bien cerner vos objectifs et définir avec précision vos attentes seront déterminants dans le futur succès de votre application web. La clarification des objectifs d’affaires permettra de correctement guider l’équipe de développement dans l’élaboration d’une stratégie de livraison, la hiérarchisation des requêtes, l’établissement des critères de succès et la définition d’une feuille de route sur le long terme.

Si vous ne voulez pas errer lors du processus de développement, ce qui coûte du temps et donc de l’argent, voire vous perdre en chemin, il est important d’avoir apporté des réponses précises et détaillées aux questions : quoi, pour qui et comment. Ce sont ces réponses qui vous donneront une feuille de route méthodique et de solides bases garantes d’un futur succès et de la minimisation des risques.

Investir dans les interfaces utilisateur

La réalisation des interfaces de votre application repose sur deux piliers essentiels :

Le design de l’expérience utilisateur (UX) qui englobe le travail sur les parcours, les interactions, les perceptions et les ressentis de vos utilisateurs lorsqu’ils utilisent votre application. C’est lui qui procure une sensation de facilité d’utilisation. Et, mal réalisé, c’est aussi lui qui peut entraîner un sentiment de frustration chez les utilisateurs. Ce que l’on veut éviter à tout prix si l’on a à cœur l’acquisition et la rétention de clientèle afin d’atteindre des objectifs d’affaires.

Le design de l’interface utilisateur (UI) complète visuellement le travail fait sur l’UX. Il comprend la création de tous les éléments visuels avec lesquels vos utilisateurs interagissent sur votre application web. Il rend votre application visuellement attrayante et participe grandement à la perception de simplicité d’utilisation. Il aide les utilisateurs à comprendre d’emblée les fonctionnalités d’application et les guide dans la réalisation de leurs objectifs.

Les utilisateurs attendent d’une application web des interactions simples, fluides et efficaces. Ils ne veulent pas avoir à chercher comment atteindre leur objectif et apprécient des mécanismes intuitifs. Offrez-leur une expérience positive basée sur une hiérarchie compréhensible de l’information et des éléments de design prévisibles, ce qui leur permettra de naviguer avec aisance dans votre application web. Aussi, ayez recours aux tests d’utilisation qui permettent de relever d’éventuels points de friction et de s’assurer que l’interface suscitera l’adhésion de son public cible.

S’assurer de la sécurité

Les failles de sécurité doivent être une préoccupation majeure pour ce type d’applications généralement connectées et amenées à stocker et traiter des données aussi bien de l’entreprise que des clients. Intégrer la sécurité aux applications dès le départ est la stratégie la plus efficace sur le long terme, et la sécurité ne doit jamais être une réflexion après coup. Les enjeux peuvent être considérables, allant de la réputation de votre entreprise à la conservation de votre clientèle.

Avoir une infrastructure performante

Vous savez combien une application lente, peu réactive, est déplaisante. N’imposez pas cela à vos utilisateurs. Si votre application tient plus de la tortue que lièvre, les utilisateurs ne vont pas attendre s’ils ont le choix. Ils partiront. La célérité d’une application web dépend de la qualité de son développement et beaucoup de l’infrastructure qui l’héberge (serveurs, connectivité). Afin de conserver la qualité de service, il est important de monitorer la performance.

Prévoir la montée en charge

Votre application est réactive et votre infrastructure est correctement dimensionnée. Vous monitorez la performance en temps réel. Mais si votre nombre d’utilisateurs grimpe rapidement (la rançon du succès… c’est tout le mal qu’on vous souhaite), les performances vont stagner puis décroître, au risque d’irriter vos utilisateurs existants et de faire fuir les nouveaux. Pire, un afflux soudain peut faire crasher votre application côté serveur. Pour diminuer ces risques, il est souhaitable d’avoir défini à l’avance une stratégie pour répondre à la montée en charge et votre application web doit avoir été développée de façon à être facilement évolutive/extensible.

Avoir une application résiliente

L’architecture globale de votre application web ne doit pas comporter, dans la mesure du possible, de point de défaillance unique, c’est-à-dire un élément dont la panne entraîne l’arrêt complet du système. Si vous estimez qu’une panne totale pourrait avoir un impact majeur sur vos affaires, il est recommandé d’étudier les différents scénarios possibles et de déployer à titre préventif les outils nécessaires (redondance, sauvegardes, CDN, etc.). Mais souvenez-vous que même les plus grands acteurs peuvent être victimes d’un point de défaillance unique. Comme ce fut le cas en 2021 pour Facebook dont l’intégralité des systèmes est tombée pendant une journée dans le monde entier. Une seule petite erreur dans la configuration distribuée aux routeurs dorsaux (qui coordonnent le trafic réseau entre les centres de données) aura suffi à mettre le géant à terre.

Trouver le bon partenaire technologique

Si vous ne développez pas votre application en interne, trouver le bon partenaire technologique est essentiel. C’est lui qui va transformer vos idées en application web performante, ce qui conditionnera en grande partie votre succès. Avez-vous besoin de quelques conseils pour guider votre choix ? Ça tombe bien, nous avons un article sur ça : “Identifier le bon partenaire en développement logiciel”.