NextJS

Qu'est-ce que NextJS et pourquoi se former à cette technologie ?

NextJS est un framework pour ReactJS développé par l'équipe de Zeit.co. Un de ses membres fondateurs s'appelle Guillermo Rauch connu notamment pour la création de Socket.io.

Pour comprendre le premier intérêt de ce framework, il vous faut savoir que lorsque l'on développe une "Single Page Application" (SPA) en JavaScript, on se retrouve confronter à un problème majeur : le SEO. Si vous souhaitez faire un site avec n'importe quel framework JavaScript sans effectuer ce que l'on appelle : un rendu serveur, votre site ne contiendra aucune information lisible pour les moteurs de recherche. Pas de H1, pas de texte, rien. Autant dire que ce sera un site totalement vide et qu'il sera très mal référencé. C'est un des points que je trouve le plus important quand on souhaite développer des site internets.

La problématique est différente pour une application web. Un espace réservé à des abonnés n'a pas forcément besoin d'être référencé. Dans ces là, vous n'avez pas forcément d'intérêt particulièrement à vous préoccuper du SEO. Il est alors plus facile de se décharger de la problématique du Server Side Rendering (SSR)

NextJS apporte plusieurs solutions

En faisant le choix de NextJS, vous allez bénéficier de nombreux avantages non négligeables.

  • Un Server Side Rendering natif (SSR)

  • Sépération du code automatique pour optimiser les chargements de page

  • La génération statique de vos pages (SSG)

  • Un système de routage intuitif basé sur les pages avec la prise en charge des routes dynamiques

  • Routage côté client avec une préchargement optimisé des pages

  • Prise en charge de toute les librairies CSS-in-JS

  • Un environnement de développement basé sur Webpack avec l'intégration du "hot reload" (HMR)

  • Prise en charge des Progressives Web App (PWA)

Vous êtes prêt à décoller vers de nouveaux horizons ?

Les cours ne sont pas encore tous disponibles! En attendant, n'hésitez pas à vous inscrire et à rejoindre la communauté Reacthor.

Plan du cours

1 - Introduction

  • 1.1 - Mise en place de son environnement

  • 1.2 - Naviguer entre les pages

  • 1.3 - Organiser son projet

Pour qui ?

Les développeurs, freelances, agences, autodidactes, etc... Quiconque souhaite découvrir le framework NextJS qui est une utilisation avancée du JavaScript et de ReactJS

Prérequis

Pour suivre ce cours, je vous conseille d'avoir de bonnes bases sur JavaScript notamment avec ES6 / ESNext. Nous allons traiter du JavaScript côté client et côté serveur. Même si nous verrons des exemples durant le cours, il est intéressant que vous ayez des notions sur ce sujet.

Cas pratique

Tout au long du cours, nous allons travailler sur la création d'une application web équivalent à un flux Twitter. Il y aura également des pages plus classiques pour bien comprendre certains fonctionnements. Evidemment, nous n'aurons pas la prétention de reproduire Twitter ou de faire mieux. Nous sommes bien à un stade de découverte et d'apprentissage du framework.