Understanding the JavaScript ecosystem: “bundler”, “transpiler”, “linter”…

Posted by






Comprendre l’écosystème JavaScript

Comprendre l’écosystème JavaScript

JavaScript est l’un des langages de programmation les plus populaires au monde, utilisé pour développer des applications web interactives. Cependant, l’écosystème JavaScript est composé de différents outils et technologies qui peuvent parfois sembler intimidants pour les nouveaux développeurs. Parmi ces outils, on retrouve des termes tels que “bundler”, “transpiler”, “linter” et bien d’autres. Dans cet article, nous allons explorer ces concepts et les comprendre en détail.

Le “bundler”

Le “bundler” fait référence à un outil qui permet de regrouper et de gérer les dépendances d’un projet JavaScript. Il est utilisé pour compiler plusieurs fichiers sources en un seul fichier, ce qui permet d’optimiser les performances du site web en réduisant le nombre de requêtes HTTP. Les bundlers populaires incluent Webpack, Parcel et Rollup.

Le “transpiler”

Un “transpiler” est un outil qui convertit le code source écrit dans une version de JavaScript en une autre. Par exemple, il peut être utilisé pour convertir du code écrit en ES6 (ECMAScript 2015) en ES5, qui est une version plus largement supportée par les navigateurs. Babel est l’un des transpilers les plus populaires dans l’écosystème JavaScript.

Le “linter”

Un “linter” est un outil d’analyse statique qui aide les développeurs à détecter les erreurs de programmation, les pratiques non recommandées et les conventions de codage. Il permet de garantir que le code source respecte les normes et les bonnes pratiques. ESLint est un linter largement utilisé dans la communauté JavaScript.

En conclusion, l’écosystème JavaScript est composé de nombreux outils et technologies qui peuvent sembler complexes au premier abord. Cependant, en comprenant les concepts de base tels que les “bundlers”, les “transpilers” et les “linters”, les développeurs peuvent améliorer la qualité et les performances de leurs applications web.


0 0 votes
Article Rating
14 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
Juste Pierre
11 months ago

"librairies tierces" 😁

Théodorick 31
11 months ago

Top, comme d'habitude.
Hâte de voir la vidéo complète sur vite

Mathieu Cissé
11 months ago

super vidéo ! quel est l'outil que tu utilises pour faire tes présentations ?

Morfal M
11 months ago

Merci une fois de plus pour cette vidéo concise et complète.
Question : est-il normal qu'esbuild laisse plusieurs lignes de commentaires pour chaque fichier importé, à la fin du bundle (avec l'option –minify) ?

Soleil Froid
11 months ago

Bonjour et merci pour cette super vidéo !
Que penses-tu de rome qui vise à fournir en un seul outils : formatteur, linteur, (puis compilateur, bundleur, testeur) ?

Paradoxe Ng
11 months ago

Merci beaucoup

1 conscience 0 dimension
11 months ago

l'extension "format toggle" marche bien pour désactiver le formatage si on modifie du code parfois l'auteur veut pas que tout soit modifié à cause du formatage

Wilfried FOTIE
11 months ago

Merci Grafikart on fait du JS sans vraiment savoir au fond c'est quoi l’écosystème.

Adam Kenton
11 months ago

Ça fait longtemps qu’elle aurait du exister cette vidéo

stéphane DAVY
11 months ago

Merci Jonathan excellente continuation.

Shekinah Nageza
11 months ago

Super Vidéo! Peux-tu faire une vidéo MERN avec TypeScript?

𝑵𝒂𝒕𝒖𝒓𝒆 • 𝑪𝒖𝒍𝒕𝒖𝒓𝒆 • 𝑨𝒇𝒓𝒊𝒄𝒂
11 months ago

Super ! – peux-tu faire un video complete avec vite et une sur MERN stp ?

for search
11 months ago

merci

Kraaakilo
11 months ago

Toujours au top.