sistema-fullstack

Crée et fait évoluer des systèmes avec connexion, base de données, tableau de bord ou API personnalisée à partir du template guibean/nextjs-fullstack-template. Utilise Next.js 16 standalone, PostgreSQL, Drizzle, Better Auth, Zod, Base UI et déploiement sur VPS.

Qu'est-ce que sistema-fullstack ?

Cette compétence permet de créer et faire évoluer des applications full-stack avec authentification, base de données, tableau de bord et API personnalisée, en utilisant le template `guibean/nextjs-fullstack-template`. Elle est idéale pour les développeurs qui souhaitent démarrer rapidement un projet avec Next.js 16, PostgreSQL, Drizzle ORM, Better Auth pour l'authentification, Zod pour la validation et Base UI pour l'interface. La compétence prend en charge le développement local et le déploiement sur VPS, avec des consignes de sécurité strictes (validation côté serveur, rate limiting, protection des secrets). Elle fournit un guide étape par étape de la modélisation des données au déploiement en production, incluant les migrations, les tests et l'optimisation Lighthouse.

Compatible avec~Claude Code~Codex CLI~Cursor
Part ofNext.js
npx skills add https://github.com/guibean/nextjs-fullstack-template/tree/main/.opencode/skills/sistema-fullstack

Installed? Explore more Développement et programmation skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

Demander à votre IA préférée

Ouvre une nouvelle conversation avec cette compétence d'agent déjà préchargée.

Documentation

Sistema Full Stack Next.js

Quand l'utiliser

Utilisez-la pour la connexion, l'inscription, le tableau de bord, les données par utilisateur, les téléchargements, la facturation ou une API personnalisée. Pour les landing pages et les sites institutionnels, utilisez la compétence site-estatico.

Créer un projet

git clone https://github.com/guibean/nextjs-fullstack-template.git <slug>
cd <slug>
pnpm install
cp .env.example .env

Générez BETTER_AUTH_SECRET avec openssl rand -base64 48, configurez DATABASE_URL et exécutez :

pnpm db:migrate
pnpm dev

Ordre d'implémentation

  1. Modélisez les données, les relations, les permissions et les menaces.
  2. Modifiez src/db/schema.ts et exécutez pnpm db:generate.
  3. Appliquez les migrations avec pnpm db:migrate.
  4. Configurez l'environnement dans src/env.ts ; n'utilisez pas de fallback en dehors de SKIP_ENV_VALIDATION.
  5. Implémentez l'authentification et l'autorisation côté serveur.
  6. Validez toutes les entrées avec Zod côté serveur.
  7. Ajoutez la limitation de débit, les journaux, les sauvegardes et l'observabilité.
  8. Construisez ensuite l'interface utilisateur du tableau de bord.

Règles de sécurité

  • N'exposez jamais DATABASE_URL, BETTER_AUTH_SECRET, RESEND_API_KEY ou TURNSTILE_SECRET_KEY.
  • Utilisez auth.api.getSession({ headers: await headers() }) dans les Server Components protégés.
  • Protégez également les Route Handlers et les Server Actions.
  • Ne faites pas confiance à la validation côté client.
  • N'utilisez pas output: "export" lorsqu'il y a authentification, base de données ou mutations.
  • En production, activez la vérification des e-mails, la limitation de débit et la récupération de mot de passe.

Déploiement sur VPS

  • Construisez avec pnpm build et sortie .next/standalone.
  • Dockerfile multi-étapes inclus.
  • Appliquez les migrations avant de changer de version.
  • Utilisez HTTPS, un proxy inverse et un processus géré.
  • Effectuez une sauvegarde de la base de données PostgreSQL avant les migrations destructrices.

Checklist

  • env validé
  • migrations appliquées
  • connexion, déconnexion et session testés
  • route protégée redirige sans session
  • API protégée rejette sans session
  • formulaire avec double validation
  • pnpm lint, pnpm typecheck, pnpm build
  • Lighthouse ≥ 95 sur les pages publiques
  • sauvegardes et limitation de débit définies

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

Skills associés