Fonctionnalité et installation de next.js

Par sbissonnette, 10 février, 2024

Pourquoi choisir le framework next.js

Next.js est un framework de développement web puissant et efficace, conçu pour construire des applications React rapides et optimisées. Voici les principaux avantages significatifs de Next.js en termes de performances et de fonctionnalités orientées développeurs:

  • Streaming HTML Dynamique : Streaming instantané de l'interface utilisateur depuis le serveur, intégré avec l'App Router et React Suspense.
  • Support CSS : Permet de créer une application avec les modules CSS, Tailwind CSS et les bibliothèques populaires de la communauté.
  • Rendu Côté Client et Serveur : Options de rendu et de mise en cache flexibles, incluant la Régénération Statique Incrémentielle (ISR) sur une base par page.
  • Gestionnaires de Route : Construire des points de terminaison API pour connecter en toute sécurité avec des services tiers ou pour gérer l'authentification
  • Optimisations Intégrées : Optimisations automatiques pour les images, les polices et les scripts pour améliorer l'expérience utilisateur et les Core Web Vitals.
     

Compagnie qui utilisent next.js 
Ce framework est utilisé par plusieurs grandes compagnies, notamment Netflix, Twitch, Uber et Nike. Voici comment chaqu'une de ces compagnies utilisent les différentes fonctionnalités de ce framework:

  1. Netflix utilise Next.js pour certaines parties de son interface utilisateur, améliorant la performance du SEO (Search Engine Optimization) créant une navigation rapide et fluide.
  2. Twitch emploie Next.js pour sa faculté à générer des pages dynamiquement côté serveur, essentielles à la performance sur sa plateforme de streaming en direct.
  3. Uber se sert de Next.js pour ses applications web, qui permet de servir du contenu dynamique efficacement et d'offrir des mises à jour en temps réel sur la disponibilité des courses, les prix et les temps d'arrivée estimé.
  4. Nike intègre Next.js dans sa plateforme de e-commerce, facilitant le rendu des pages de produits sur le serveur pour des temps de chargement plus rapides et un meilleur SEO (Search Engine Optimization).

     

Installation 
    Prérequis:
        1. Windows 10/11 ou le sous-système de Windows pour linux (WSL)
        2. Node.js
        3. L'émulateur de votre choix
    Installation de Next.js:
        1. Ouvrez un terminal de ligne de commande

        2. Créez un dossier pour le nouveau projet : mkdir ProjetNextJs,
           puis accédez à ce répertoire : cd ProjetNextJs/

        3. Installion de Next.js et création d'un projet : npx create-next-app@latest nomDuProjet
           À la suite de cette commande, plusieurs question d'importation de frameworks et fonctionnalitées vous sera demander (TypeScript, ESlint, Tailwind CSS, app Router), cochez 'yes' pour celles que vous souhaitez utiliser.

        4. Une fois le projet créer, entrez dans le fichier du projet: cd nomDuProjet/

        5. Dernièrement, utiliser ces trois commande pour partir le serveur local du site:
            a) npm run dev (pour exécuter une instance de développement avec rechargement à chaud, surveillance des fichiers et réexécution des tâches. )
            b) npm run build (pour compiler votre projet.)
            c) npm start (pour démarrer votre application en mode de production.)

 

Sources:
https://bluesockets.com/next/what-big-companies-use-next-js/
https://nextjs.org/docs/getting-started/installation
https://nextjs.org/docs/app/building-your-application/routing/loading-ui-and-streaming
https://cult.honeypot.io/reads/top-nextjs-performance-benefits/
https://nextjs.org

Étiquettes

Commentaires2

adjemaoune

il y a 1 an

Il s'agit d'un articlle instructif sur Next,js, un framework que je ne connaissais point. Il met en avant les avantages de ce dernier, les grandes entreprises qui l'utilisent et les instructions d'installation très détaillées. J'aimerais savoir quelles seraient les principaux inconvénients ou encore obstacles que les développeurs pourraient rencontrer si ils optaient pour cette technologie. 

adjemaoune

il y a 1 an

Il s'agit d'un articlle instructif sur Next,js, un framework que je ne connaissais point. Il met en avant les avantages de ce dernier, les grandes entreprises qui l'utilisent et les instructions d'installation très détaillées. J'aimerais savoir quelles seraient les principaux inconvénients ou encore obstacles que les développeurs pourraient rencontrer si ils optaient pour cette technologie.