Initialisation du projet et configuration de Strapi 5

Démarrez votre projet e-commerce en installant Remix et Strapi 5, puis configurez la base de données et l’API.

3 mai 2025

3 min read

Dans ce module, nous allons poser les bases de votre boutique en ligne en démarrant un projet Remix et en configurant un back-end Headless CMS avec Strapi 5. Vous apprendrez à installer les dépendances essentielles, à préparer votre environnement de base de données, et à exposer une API robuste pour vos produits, catégories et utilisateurs.

Objectifs du module

Installer et configurer Remix et Strapi 5
Choisir et paramétrer une base de données (SQLite ou PostgreSQL)
Comprendre la structure du projet générée par Strapi
Mettre en place les scripts NPM pour le développement et la production
Créer un premier contenu (collection types) dans Strapi

Tip

Pour ce cours, nous partirons sur Node >= 18 et npm >= 6 afin de tirer parti des dernières fonctionnalités de Strapi 5 et de Remix.

Pourquoi Remix + Strapi 5 ?

La combinaison de Remix et de Strapi 5 offre :

Performances et SEO optimisés grâce au rendu côté serveur de Remix
Un back-end déployable en quelques minutes, extensible à l’infini avec Strapi
Une API REST et GraphQL puissante, prête à l’emploi
Un écosystème riche :
- Gestion des utilisateurs via @strapi/plugin-users-permissions
- Envoi d’e-mails avec @strapi/provider-email-mailgun (Mailgun)
- Intégration Stripe (stripe.com) pour le paiement
- WebSockets avec Socket.IO
- Validation des données avec Zod

Aperçu du projet

À l’issue de ce module, vous disposerez d’une arborescence similaire à :

package.json

1{
2  "name": "ecommerce",
3  "private": true,
4  "version": "0.1.0",
5  "scripts": {
6    "dev": "strapi develop",
7    "start": "strapi start",
8    "build": "strapi build"
9  },
10  "dependencies": {
11    "@strapi/strapi": "5.0.0",
12    "pg": "^8.13.0",
13    "better-sqlite3": "9.4.3"
14  },
15  "devDependencies": {
16    "typescript": "^5",
17    "@types/node": "^20"
18  }
19}