Zaratan@next

NextJS Refactor: La stack.

Cette série d'articles a pour but de présenter la stack front-end qui fait tourner ce blog et d'en profiter pour parler de diverses techniques que vous pourriez avoir envie d'utiliser. Ce premier article est purement introductif et va servir a ce que tout le monde s'y retrouve plus tard.

Vous pouvez trouver le code du blog ici si ça vous intéresse: https://github.com/zaratan/zarablog-next

React

React est un framework front qui permet de créer des sites web en JS. Ce framework simplifie la gestion de l'état du site/app et les interactions utilisateur.

J'avais un peu présenté ça par le passé à deux reprises:

NextJS

NextJS est une "fine" sur-couche par dessus React qui gère certaines choses automatiquement. On aura l'occasion de revenir sur certains de ces points au cours des différents articles de cette série, mais en vrac ça gère:

  • Le routing
  • Le code spliting
  • La configuration Babel/Webpack/TypeScript
  • Plein d'optimisations pour React

Vercel

Vercel est la compagnie qui produit NextJS. Auparavant appelée Zeit, son principal produit permet de:

  • Déployer facilement un projet Front
  • Déployer des routes de Serverless APIs
  • Gérer ses domaines DNS

C'est avec ce produit que ce blog est déployé.

MDX

Le MDX c'est comme le MarkDown mais étendu. Un des points majeurs qui est utile ici est qu'il supporte l'ajout de composants React.

TypeScript

TypeScript est un langage qui sera compilé vers le Javascript. Il ressemble trait pour trait au JS à la différence notoire qu'il ajoute un "type" au différentes choses (fonctions, paramètres, objects). Les types seront check à la compilation pour éviter certaines erreurs en prod.

Articles de la série