Créez Votre Première Application Fullstack Facilement avec Next.js, Prisma et SQLite

Vous pensez encore que Next.js n'est qu'un framework frontend ? Détrompez-vous ! Découvrez comment assembler rapidement une application fullstack robuste avec Next.js, Prisma et SQLite. Ce guide pratique vous montre comment créer une base solide pour vos projets, même si vous débutez dans le développement fullstack.

Pourquoi Choisir Next.js, Prisma et SQLite pour Votre App ?

Next.js offre bien plus que du rendu côté client. C'est un véritable framework fullstack qui simplifie le développement grâce à ses API intégrées pour le backend. Combiné à la puissance de Prisma, un ORM moderne, et à la simplicité de SQLite, vous obtenez une solution performante et facile à gérer.

Configuration Rapide : Installez Next.js et Prisma en un Clin d'Œil

Lancez votre projet en quelques commandes. Suivez ces étapes simples pour installer Next.js et Prisma :

1. Créez une nouvelle application Next.js :

   npx create-next-app@latest
   

   Copy

   Répondez aux questions, en choisissant l'option "Non" pour l'App Router. Nous utiliserons l'architecture de pages classique (OG pages router).

2. Installez Prisma :

   npm i -D prisma
   

   Copy

3. Initialisez Prisma avec SQLite :

   npx prisma init --datasource-provider sqlite
   

   Copy

Modélisation de Données Simplifiée : Définissez Vos Modèles User et Post

Le fichier schema.prisma est l'endroit où la magie opère. Définissez vos modèles de données "User" et "Post" avec leurs relations :

model User {
  id    Int     @id @default(autoincrement())
  email String  @unique
  name  String?
  posts Post[]
}

model Post {
  id        Int      @id @default(autoincrement())
  title     String
  content   String?
  published Boolean  @default(false)
  author    User     @relation(fields: [authorId], references: [id])
  authorId  Int
}

Ces modèles définissent la structure de vos données "User" et "Post", ainsi que la relation entre eux. Prisma facilite la gestion des relations entre les tables de votre base de données.

Migrations Faciles : Créez et Mettez à Jour Votre Base de Données

Prisma simplifie la gestion des migrations. Créez votre base de données avec une seule commande :

npx prisma migrate dev --name init

Cette commande créera un dossier de migrations et appliquera les modifications à votre base de données SQLite. Plus besoin de scripts SQL complexes !

Prochaine Étape : Création d'une API CRUD avec Next.js et Prisma

Maintenant que votre base de données est prête, Il est temps de créer les endpoints d'API pour effectuer des opérations CRUD (Create, Read, Update, Delete) sur vos données. Next.js et prisma sont vos allies.