Le top des frameworks JavaScript en 2017

Pour commencer tranquille, on va se mettre à jour sur les frameworks front-end qui sont chauds en ce moment dans le quartier.

Si tu sais pas ce que c’est le front-end, miskine, c’est simplement la partie client d’un site internet, qui s’exécute dans le navigateur, et la manière dont ça s’affiche, à l’opposé du back-end qui est le code du côté serveur.

Nous, ce qui nous intéresse aujourd’hui, c’est pas trop le style (CSS), c’est plutôt le code (JavaScript), parce qu’on veut faire des vraies bonnes grosses applications avec des interactions, des trucs qui apparaissent, des morceaux de pages qui changent et tout, et pas seulement un affichage statique tout pété.

Un framework JavaScript, c’est quoi ? Le plus souvent c’est une bibliothèque JS assez large qui te permet de créer des applications web en t’aidant à gérer les données côté client, les afficher et gérer les interactions.

Donc si tu veux percer dans le milieu va falloir passer au SPA ! Non, pas besoin d’adopter un chien bulldog de race à la SPA, moi je te parle de Single Page Application, ça évite de faire chier les gens qui voient des pages entières se recharger à chaque fois qu’ils cliquent sur les boutons de tes sites, gros.


Ghetto Coders Playlist #1 (7 tracks)

Angular

https://angular.io/

Tout d’abord, on commence avec le framework qui pèse le plus dans le game, c’est Angular, et ça vient de Google mon gars ! TMTC la qualité.

Aujourd’hui, si tu veux te faire embaucher dans une grosse entreprise et faire des applications web, c’est Angular qu’il faut apprendre. C’est un framework complet qui te permet de réaliser une architecture complète pour une application bien propre, à base de décompositions en directives, contrôleurs, services… Alors bien sûr faut bosser les concepts, mais si t’es un branleur c’est ton problème.

Depuis quelques temps il y a Angular 2 qui est sorti. Et c’est plutôt un bon plan d’apprendre directement sans passer par la première version parce que ça ressemble plus beaucoup. Avec Angular 2, il y a TypeScript qui est une version de JavaScript avec le typage des variables (int, string…), entre autre, et ça fait plus pro ma gueule.

Avec NativeScript ou Ionic, tu peux aussi utiliser Angular pour te faire des applications pour Android ou iOS sans te faire iech’ à apprendre un nouveau langage.

React

https://facebook.github.io/react/

C’est quoi le point commun entre Netflix, Instagram, Facebook, Airbnb… ?

Ce sont des services qui ont des millions (voire milliards) d’utilisateurs mensuels, et qui ont des sites qui déchirent parce qu’ils sont faits avec React ! On parle que de ça dans le ter-ter !

React c’est un framework qui se concentre purement sur la partie vue et pour cela il y a le Virtual DOM. Pour faire simple c’est une représentation en mémoire du DOM avant qu’il soit rendu en HTML. L’avantage c’est que, par magie, seul ce qui est changé dans les données est modifié dans le HTML. Avec React, c’est juste une histoire de construire des composants (components) et de les assembler pour faire une application super optimisée, OKLM.

Les composants, il faut les faire avec un nouveau langage qui est le JSX : c’est du JS avec un peu de HTML dedans. Izi life.

Après, pour gérer tous les flux de données dans des grosses applications, il y a Redux ou encore MobX pour ça mais c’est une autre histoire !

Si t’en veux plus, React permet aussi le Server-Side Rendering, c’est-à-dire que ton code n’est pas obligé de s’exécuter dans le navigateur comme pour les autres frameworks, tu peux aussi le compiler direct sur le serveur.

Tu peux même utiliser React Native pour faire des applications pour ton tel !

Vue

https://vuejs.org/

C’est le framework qui monte en ce moment ! Tu peux pas le louper ! À base de Virtual DOM et de composants réactifs comme React, celui là va encore plus vite et il est encore plus léger frère.

Ouais je sais, React est déjà très performant et son écosystème est plus riche parce que beaucoup d’outils son déjà créés pour. Mais Vue à encore d’autres avantages et vaut bien un coup d’œil.

Avec Vue c’est très simple de se lancer, pas besoin de connaître JSX ni les dernières nouveautés d’ES6. Les templates sont aussi plus faciles à créer parce qu’ils ressemblent plus à du HTML de base et les styles CSS sont aussi plus simples à définir.

Pour finir, le petit bonus c’est qu’il y a un utilitaire en lignes de commandes pour lancer son projet en deux-deux sans prise de tête !

Cadeau ! Téma ce site plutôt stylé fait avec Vue : https://www.bigyouth.fr/

D’autres frameworks à voir si t’es chaud

Ember

En perte de vitesse mais toujours utilisé par les gars sûrs. C’est un framework complet qui a des opinions et conventions pour pas se prendre la tête, et même une interface par ligne de commandes pratique à utiliser.

Backbone

C’est pas nouveau mais encore bien populaire et utilisé par des gros sites. C’est une colonne vertébrale, un squelette, pour créer ton application de manière propre, et après tu peux y lâcher ton flow de créativité ou même y rajouter d’autres bibliothèques comme Marionette.

Elm

Si t’as vraiment envie de te la péter tu peux passer à la programmation purement fonctionnelle espèce d’intello de merde. Elm, c’est pas seulement un framework mais aussi un langage qui doit être compilé en JS. C’est un peu chaud pour commencer mais au final ça permet de faire du code propre, efficace et qui ne produit aucune erreur d’exécution ! Tous ceux qui ont réussi à se lancer dans un projet avec kiffent grave donc ça vaut le coup !

Aurelia

La petite dernière c’est Aurelia, accouchée par un ancien mec d’Angular, et il va falloir la suivre, et pas tarder, parce qu’elle aguiche de plus en plus de gars dans le quartier.

jQuery

Tu te fous de ma gueule ou quoi ? On est en quelle année ? Si tu vois Charlemagne rappelle lui qu’il me doit 15 balles !

Vanilla JavaScript

Non, Vanilla, c’est pas un framework, et encore moins le goût préféré de ta sœur quand elle lèche des glaces. Ce qu’on appelle Vanilla c’est quand on code juste avec le JavaScript que le navigateur sait interpréter par défaut. C’est tout.

Et ouais ma gueule. Si t’étais un vrai pro tu saurais que tu peux encore faire plein de trucs swaggés avec du pur JS. Et si ton code et bien organisé tu peux démonter tous les frameworks au niveau des perf’ ! Et puis si tu connais ES6, qui est maintenant bien supporté par les navigateurs, il y a moyen d’aligner du bon code de beau gosse.

Par contre, bonne chance si tu pars pour nous pondre une grosse applisans bibliothèque, McGyver.


En gros

http://stateofjs.com/2016/frontend/

Alors bolosse ? T’es perdu ? Tu sais pas quoi choisir ? T’es en PLS ?

Si tu veux te lancer avec un framework, tu connais les bails, il n’y a pas de solution universelle. Il faut que tu fasse en fonction de plusieurs paramètres.

Le temps, c’est du bif, alors le mieux c’est que tu prenne le framework que tu connais déjà ou que ta team maîtrise, comme ça t’es en route rapidement.

Tu n’en connaît aucun ? Tu en connais un, mais tu veux passer à autre chose ?

Regarde en premier les frameworks les plus populaires, parce que les communautés sont actives et si tu as des problèmes, les solutions seront sur internet. Aussi, tu pourras trouver sans problème des composants à intégrer à tes applications.

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.