2. Site web ou Application web ?

3. Angular vs AngularJS

La tendance actuelle en développement web, c’est de vouloir séparer complètement:

  • La partie client du site: c’est-à-dire les fichiers HTML, CSS et JavaScript, qui sont interprétés par le navigateur.
  • La partie serveur du site: les fichiers PHP, si vous développez votre site en PHP, les fichiers Java si vous utilisez Java… qui sont interprétés côté serveur. C’est dans cette partie que l’on fait des requêtes aux bases de données, par exemple.

Un « site web » au sens traditionnel du terme, est donc une application serveur qui envoie des pages HTML dans le navigateur du client à chaque fois que celui-ci le demande. Quand l’utilisateur navigue sur votre site et change de page, il faut faire une requête au serveur. Quand l’utilisateur remplit et soumet un formulaire, il faut faire une requête au serveur… bref, tout cela est long, coûteux, et pourrait être fait plus rapidement en JavaScript.

Une « application web » est une simple page HTML, qui contient suffisamment de JavaScript pour pouvoir fonctionner en autonomie une fois que le serveur l’a envoyé au client. Je vous ai fait un petit schéma d’explication:

sitewebVSappliweb
L’architecture d’un site web et d’une application web

A votre avis, quel est le schéma représentant un site web, et celui représentant une application Web ?

Le schéma de gauche représente un site web: à chaque fois que l’utilisateur demande une page, le serveur s’occupe de la renvoyer : /accueil, /forum, etc… Dans le cas d’une application web, le serveur ne renvoie qu’une page pour l’ensemble du site, puis le JavaScript prend le relais pour gérer la navigation, en affichant ou masquant les éléments HTML nécessaires, pour donner l’impression à l’internaute qu’il navigue sur une site traditionnel !

L’avantage de développer un site de cette façon, c’est qu’il est incroyablement plus réactif. Imaginez, vous remplacez le délai d’une requête au serveur par un traitement
JavaScript ! De plus, comme vous n’avez pas à recharger toute la page lors de la navigation, vous pouvez permettre à l’utilisateur de naviguer sur votre site tout en discutant avec ses amis par exemple ! (Comme la version web de Facebook).

Vous avez remarqué que l’ensemble d’une application web est contenu sur une seule page ? Eh bien, on appelle ce genre d’architecture une architecture SPA, ce qui signifie simplement Single Page Application.

Même si Angular ne vous plait pas au final (ce dont je doute fort !), vous serez sûr d’avoir appris beaucoup de choses sur l’écosystème bourgeonnant du développement d’applications web. Nous terminerons la première partie de ce cours avec le fameux « Hello, World !« , et un questionnaire pour vérifier que vous n’avez pas fait semblant de suivre ce cours. 🙂

Le « Hello, World ! » est un grand classique en programmation. Dans chaque langage que vous aborderez, la première chose à faire est de développer une petite application qui affiche un message de bienvenue à l’utilisateur pour vérifier que tout marche bien ! On appelle cette petite application un « Hello, World ! ».

3. Angular vs AngularJS

2 commentaires sur « 2. Site web ou Application web ? »

    1. Bonjour Fabrice,

      Je préfère ne pas rentrer dans ce genre de débat ! 🙂
      Angular et Vue ont chacun une philosophie bien différente, avec des adeptes dans les deux camps. Je fais du développement avec Vue également, et j’apprécie la liberté qu’il propose. Cependant Angular reste mon choix par défaut, car les conventions qu’il impose me conviennent parfaitement.

      Bonne continuation,

      Simon.

      J'aime

Laisser un commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l'aide de votre compte WordPress.com. Déconnexion /  Changer )

Photo Google+

Vous commentez à l'aide de votre compte Google+. Déconnexion /  Changer )

Image Twitter

Vous commentez à l'aide de votre compte Twitter. Déconnexion /  Changer )

Photo Facebook

Vous commentez à l'aide de votre compte Facebook. Déconnexion /  Changer )

Connexion à %s