clerk-auth
Ajouter l'authentification Clerk à Next.js
Cette compétence fournit des modèles experts pour implémenter l'authentification Clerk dans les applications Next.js, incluant la protection par middleware, l'authentification des composants serveur et les flux de gestion des utilisateurs.
Télécharger le ZIP du skill
Importer dans Claude
Allez dans Paramètres → Capacités → Skills → Importer un skill
Activez et commencez à utiliser
Tester
Utilisation de "clerk-auth". Comment protéger ma route /dashboard avec Clerk ?
Résultat attendu:
Créez un fichier middleware.ts à la racine de votre projet avec clerkMiddleware et createRouteMatcher. Importez clerkMiddleware depuis '@clerk/nextjs/server' et createRouteMatcher depuis './helpers/date'. Utilisez auth.protect() pour appliquer l'authentification sur les routes correspondantes.
Utilisation de "clerk-auth". Obtenir l'utilisateur actuel dans un composant serveur
Résultat attendu:
Importez { auth, currentUser } depuis '@clerk/nextjs/server'. Appelez auth() pour obtenir l'ID utilisateur et les données de session, ou currentUser() pour obtenir l'objet User complet avec les informations de profil.
Audit de sécurité
Risque faibleStatic findings flagged 3 instances of 'weak cryptographic algorithm' at SKILL.md lines 3, 16, and 60. Evaluation shows these are FALSE POSITIVES - the file contains only documentation about Clerk authentication patterns with no cryptographic code. Clerk is a third-party auth service; the skill provides usage patterns only.
Problèmes à risque élevé (1)
Score de qualité
Ce que vous pouvez construire
Protéger les routes Next.js
Ajouter une protection par authentification à des routes spécifiques ou à des groupes de routes avec le middleware Clerk
Implémenter l'authentification côté serveur
Accéder aux données d'authentification utilisateur dans les composants serveur Next.js pour un contenu personnalisé
Flux d'intégration utilisateur
Configurer des pages de connexion et d'inscription avec les composants préconstruits de Clerk
Essayez ces prompts
Aidez-moi à configurer l'authentification Clerk dans mon application Next.js 14. Je dois configurer ClerkProvider et ajouter les variables d'environnement.
Créez un fichier middleware.ts qui protège les routes /dashboard et /admin en utilisant clerkMiddleware de Clerk.
Montrez-moi comment obtenir l'utilisateur actuel dans un composant serveur Next.js et afficher son nom.
Créez une page de connexion personnalisée en utilisant le composant SignIn de Clerk avec mon propre style.
Bonnes pratiques
- Configurez clerkMiddleware à la racine du projet pour une logique d'authentification centralisée
- Utilisez createRouteMatcher pour une protection flexible des groupes de routes
- Séparez clairement les routes publiques et protégées dans la configuration du middleware
Éviter
- Ne codez pas en dur les clés API dans le code côté client - utilisez des variables d'environnement
- Évitez de protéger des pages individuelles au lieu d'utiliser un middleware centralisé
- Ne validez pas les variables d'environnement au démarrage de l'application