Next.js 14

Contenu du cours

Next.js 14

Next.js 14

1. Introduction

Bienvenue Aperçu du Projet Prérequis du Cours Comment Fonctionne le Cours

2. Concepts de Base

Configuration du Projet Structure des Fichiers-Dossiers du Projet Approches de Style Ajouter le Fichier CSS Global Stylisation Tailwind Modules CSS Appliquer des Styles Conditionnellement Polices Google Personnalisées Défi : Ajouter une Police Google Personnalisée Images

3. Pages et Mises en Page

Comment Fonctionne le Routage Défi : Création de Page Créer une Mise en Page Commune Optimisation de la Navigation Création de Liens Actifs

4. Déploiement et Base de Données

Configuration des Comptes Déploiement du Projet Base de Données du Projet Population de Données

5. Travailler avec les Données

Comment Récupérer des Données Travailler Avec la Page du Tableau de Bord Pratique et Défi : Récupération de Données Rendu Dynamique vs Statique Chargeurs Chargeurs de Parties Spécifiques Défi : Chargeur de Squelette Regroupement des Composants pour les Chargeurs

6. Fonctionnalités Avancées

Page des Factures Fonctionnalité de Recherche Pagination Actions Serveur Création d'Élément Mise à Jour de l'Élément Suppression d'Élément Défi : Validation de Formulaire

7. Authentification

Comprendre l'Authentification Route de Connexion NextAuth.js Configuration d'Authentification et Protection des Routes Hachage de Mot de Passe et Identifiants Fonctionnalité de Connexion Connexion de l'Interface Utilisateur et des Fonctionnalités Fonctionnalité de Déconnexion Et Après?

Suppression d'Élément

Implémentons la fonctionnalité de suppression pour la facture.

Retour au Projet

Pour utiliser une Action Serveur pour supprimer une facture, encadrez le bouton de suppression dans un élément <form> et transmettez l'id à l'Action Serveur en utilisant la fonctionnalité bind:

Pour compléter la tâche, nous créons l'action deleteInvoice.

Comme vous pouvez le voir, nous n'utilisons pas redirect() car l'action de suppression est appelée sur la page dashboard/invoices.

En Pratique

Tout était clair ?

Merci pour vos commentaires !

Section 6. Chapitre 7

Demandez à l'IA

Demandez à l'IA

Posez n'importe quelle question ou essayez l'une des questions suggérées pour commencer notre discussion

Contenu du cours

Next.js 14

Next.js 14

1. Introduction

Bienvenue Aperçu du Projet Prérequis du Cours Comment Fonctionne le Cours

2. Concepts de Base

Configuration du Projet Structure des Fichiers-Dossiers du Projet Approches de Style Ajouter le Fichier CSS Global Stylisation Tailwind Modules CSS Appliquer des Styles Conditionnellement Polices Google Personnalisées Défi : Ajouter une Police Google Personnalisée Images

3. Pages et Mises en Page

Comment Fonctionne le Routage Défi : Création de Page Créer une Mise en Page Commune Optimisation de la Navigation Création de Liens Actifs

4. Déploiement et Base de Données

Configuration des Comptes Déploiement du Projet Base de Données du Projet Population de Données

5. Travailler avec les Données

Comment Récupérer des Données Travailler Avec la Page du Tableau de Bord Pratique et Défi : Récupération de Données Rendu Dynamique vs Statique Chargeurs Chargeurs de Parties Spécifiques Défi : Chargeur de Squelette Regroupement des Composants pour les Chargeurs

6. Fonctionnalités Avancées

Page des Factures Fonctionnalité de Recherche Pagination Actions Serveur Création d'Élément Mise à Jour de l'Élément Suppression d'Élément Défi : Validation de Formulaire

7. Authentification

Comprendre l'Authentification Route de Connexion NextAuth.js Configuration d'Authentification et Protection des Routes Hachage de Mot de Passe et Identifiants Fonctionnalité de Connexion Connexion de l'Interface Utilisateur et des Fonctionnalités Fonctionnalité de Déconnexion Et Après?

Suppression d'Élément

Implémentons la fonctionnalité de suppression pour la facture.

Retour au Projet

Pour utiliser une Action Serveur pour supprimer une facture, encadrez le bouton de suppression dans un élément <form> et transmettez l'id à l'Action Serveur en utilisant la fonctionnalité bind:

Pour compléter la tâche, nous créons l'action deleteInvoice.

Comme vous pouvez le voir, nous n'utilisons pas redirect() car l'action de suppression est appelée sur la page dashboard/invoices.

En Pratique

Tout était clair ?

Merci pour vos commentaires !

Section 6. Chapitre 7

some-alt