Formation NextJS 15
1800€ HT / personne |
3 jours (21 heures) |
Présentation
NextJS est un framework JavaScript construit pour React et basé sur la technologie de Node.js. Il est capable de créer des applications fournissent à la fois des pages générées par le serveur à chaque requête et des pages statiques générées lors du build applicatif.
NextJS vous permet de créer des applications JavaScript en code partagé entre le client et le serveur. Il a un système de routing intégré et très simple à utiliser. Un autre avantage de l’outil est son apport en SEO, en effet, grâce à Next vous pourrez optimiser le référencement de vos Singles Pages Apps.
Notre formation Next vous présentera les concepts fondamentaux du framework. Vous saurez développer un projet d’application web, vous connaîtrez le concept de Data Fetch et les différents modes de développement.
À savoir, le Server Side Rendering (SSR) et le rendu statique.
Cette formation NextJS vous enseignera la dernière version du framework NextJS 15.
Objectifs
- Créer des applications web universelles
- Maîtriser le SSR, le SSG et l’ISR avec le framework NextJS
- Créer des pages web optimisées pour les moteurs de recherche
- Créer des sites statiques et dynamiques
- Implémenter le data fetching via une stratégie statique (build) ou dynamique (run time)
Public visé
- Développeurs JavaScript
- Développeurs front
- Développeurs web
Pré-requis
- Connaissance du langage JavaScript, HTML, CSS
- Connaissance basique de ReactJS ou avoir assisté à notre formation ReactJS
Programme de notre formation Next.JS
JOUR 1: PRISE EN MAIN DE NEXTJS ET FONDAMENTAUX
- – Next.js et son écosystème : lien avec React, Vercel, documentation
- Créer une nouvelle application avec le CLI create-next-app
- Découvrir la structure du projet
- TypeSCript et TailwindCSS
- Implémenter une interface simple multi-pages
- Ajouter du style dans Next.js
- Découvrir le système de layout
- Créer une page de contenu avec un paramètre dynamique
- Obtenir des données côté client via un appel d’API
- Optimiser les images et les polices
- Naviguer entre des pages
JOUR 2: NEXT FULL-STACK AVEC LES ROUTE HANDLERS (API) ET SERVER ACTIONS
- Découvrir vercel et connecter une base de donnée
- Récupérer des données serveurs (server composants vs client composants)
- Comprendre les différents mécanismes de rendu: Static vs Dynamic, Streaming Incrémental et Partiel
- Rechercher et paginer
- Muter des données
- Gérer les erreurs: 500, 404,…
JOUR 3: OPTIMISATIONS ET DÉPLOIEMENT
- Accessibilité et validation de formulaire côté serveur
- Ajouter authentification
- Ajout de métadonnée, référencement et pwa
- Créer un repo Github, pusher son code
- CI/CD Github actions et déploiement sur vercel
- Revue d’ensemble et récapitulatif
Extension (+ 1 jour) : réaliser une PWA avec Next.JS
INTRODUCTION AU RESPONSIVE DESIGN
- Media queries
- Breakpoints
- Utiliser tailwind pour un layout responsive
- Viewport adaptatif
- Tester un rendu sur mobile
INTRODUCTION AU PWA
- Caractéristiques
- Comparaison avec les autres approches mobiles (react-native, code natif)
- Avantages
- Cycle de vie
- Utilisé des Services Worker
- Le fichier manifest.json
CRÉER UNE PWA AVEC NEXT.JS
- Génération des métadonnées
- Création des icônes applicatifs dans /public
- Utilisation du package next-pwa
- Prompt d’installation personnalisé
- Déploiement vercel
- Installation sur smartphone
Pour aller plus loin
Formation Nodejs
Formation Angular
Formation Vue.js
Formation React Native
Formation ReactJS
Formation Angular Avancé
Langues et Lieux disponibles
Langues
- Français
- Anglais / English
Lieux
-
France entière
- Paris
- Lille
- Reims
- Lyon
- Toulouse
- Bordeaux
- Montpellier
- Nice
- Sophia Antipolis
- Marseille
- Aix-en-Provence
- Nantes
- Rennes
- Strasbourg
- Grenoble
- Dijon
- Tours
- Saint-Étienne
- Toulon
- Angers
-
Belgique
- Bruxelles
- Liège
-
Suisse
- Genève
- Zurich
- Lausanne
-
Luxembourg
Témoignages
Je recommande la formation
Afficher tous les témoignages
Je recommande la formation Les + : Beaucoup de pratique, avec un projet ambitueux comme il faut, ni trop simple, ni trop dur. Concepts bien expliqués et formateur très présent pour aider. Les – : ras Les + : Aperçu rapide et complet de NextJS Les – : Il y a eu des soucis (bugs) avec NextJS lui même et après sur Vercel qui ont fait perdre un peu de temps. Je souhaite suivre : Je ne sais pas. En synthèse : Objectif principal accompli.
Noter la formation
1800€ HT / personne |
3 jours (21 heures) |
UNE QUESTION ? UN PROJET ? UN AUDIT DE CODE / D'INFRASTRUCTURE ?
Pour vos besoins d’expertise que vous ne trouvez nulle part ailleurs, n’hésitez pas à nous contacter.
ILS SE SONT FORMÉS CHEZ NOUS