Shadcn Dashboard Kit

Shadcn Dashboard Kit - Générateur de panneau d’administration shadcn prêt pour la production : 200+ blocs, 400+ composants et invites IA pour React, Next.js

Lancé aujourd'hui

Shadcn Dashboard Kit est un kit de développement complet de panneau d’administration prêt pour la production, conçu pour React, Next.js, TypeScript et Tailwind CSS : plus de 200 blocs d’interface utilisateur préconçus, 400 composants, et des invites IA intégrées. Il permet aux développeurs frontaux et aux équipes de créer des interfaces d’administration évolutives, des outils internes et des tableaux de bord SaaS trois fois plus rapidement, avec une authentification préconfigurée, des tableaux de données et des graphiques interactifs prêts pour le déploiement en production.

0VuesCodage IAFreemiumLow-CodeNo-CodeGénération de CodeVS CodeOpen Source

Fonctionnalités principales

Shadcn Dashboard Kit inclut plus de 200 blocs d’interface utilisateur et 400 composants prêts pour la production, testés sur l’ensemble des navigateurs et des appareils pour éliminer le travail de débogage habituel lié à la génération d’interface depuis des invites LLM brutes. Tous les composants s’appuient sur les primitives accessibles non stylisées de Base UI, et offrent un contrôle total de la personnalisation du design grâce aux variables CSS et à la configuration Tailwind.

Capacités du générateur IA

Le générateur de tableaux de bord IA intégré transforme des invites en langage naturel en tableaux de bord complets et prêts pour la production en quelques secondes. Il génère du code propre pour Next.js 16 et Shadcn UI, avec des visualisations interactives Recharts, des tableaux de données TanStack, des paramètres prédéfinis de thème adapté à la marque, la prise en charge du mode sombre et du code TypeScript exportable. Le générateur IA prend également en charge le déploiement en un clic et la synchronisation GitHub.

Intégration du serveur MCP

Vous pouvez connecter le serveur Model Context Protocol fourni aux éditeurs de code IA, y compris Cursor, Claude Code, Cline, Windsurf et v0. Le serveur indexe l’ensemble du registre des composants, afin que votre assistant IA ait une conscience complète de l’espace de travail et puisse générer du code d’interface précis et cohérent, qui respecte la structure de votre projet existant sans que vous ayez à coller manuellement du contexte.

Modules complémentaires et intégrations pris en charge

Le kit est fourni avec des outils de développement populaires préconfigurés, prêts à l’emploi :

  • Intégrations d’authentification Supabase Auth + DB, Clerk et NextAuth

  • TanStack Table avec tri, filtrage, pagination et virtualisation intégrés

  • Zod pour la validation des formulaires avec sécurité de type

  • Animations performantes optimisées par Framer Motion

  • Dnd kit pour les composants de glisser-déposer accessibles

  • SWR pour la récupération efficace des données mises en cache

  • i18n React pour la prise en charge multilingue

  • Éditeur de texte enrichi Tiptap avec prise en charge du markdown

Variations de tableaux de bord disponibles

Des modèles de tableaux de bord préconçus sont inclus pour les cas d’usage courants :

  • Tableau de bord analytique

  • Tableau de bord e-commerce

  • Tableau de bord SaaS IA

  • Tableau de bord de gestion scolaire

  • Tableau de bord de gestion sanitaire

Vous pouvez basculer entre plusieurs modes de mise en page, y compris la navigation horizontale, la barre latérale repliable, la barre latérale compacte mini et le mode de lecture de droite à gauche RTL. Des paramètres dynamiques de thème, parmi lesquels Lyra, Nova, Maia, Mira, Luma, Vega et Rhea, sont disponibles pour modifier l’esthétique globale du design en un clic.

Flux d’utilisation

Vous pouvez utiliser le modèle Next.js complet pour démarrer un nouveau projet depuis zéro, ou utiliser l’interface de ligne de commande officielle pour installer des blocs individuels directement dans votre projet existant. L’interface de ligne de commande configure automatiquement les chemins d’importation et installe toutes les dépendances requises pour les composants sélectionnés. Chaque composant et bloc est accompagné d’une invite IA préconçue prête à l’emploi, que vous pouvez coller dans ChatGPT, Claude ou d’autres LLM pour générer des extensions ou des modifications d’interface conformes qui respectent les conventions d’architecture du kit. Les fichiers structurés .agents.md donnent à votre assistant IA une visibilité complète de la structure de votre base de code, ce qui réduit les explications répétées et le gaspillage inutile de jetons.

Droits d’utilisation

Les blocs et composants gratuits peuvent être utilisés pour des projets personnels, commerciaux, SaaS et des projets réalisés pour des clients. Tous les forfaits payants incluent la propriété totale du code source, sans redevances récurrentes ni frais liés au nombre d’utilisateurs, et autorisent l’utilisation pour des produits SaaS commerciaux, des outils internes et des missions pour des clients. Les forfaits Pro, Teams et Enterprise incluent également l’ensemble du kit de design Figma correspondant.

Commentaires

Commentaires

Pas encore de commentaires. Soyez le premier à partager vos impressions !