📍 Article principal du cluster : Directus 2026 : guide complet.
Avant d’écrire du code frontend, modéliser proprement vos collections Directus économise des semaines de refactor. Ce tutoriel détaille la modélisation d’une boutique e-commerce ouest-africaine type, avec relations, validations, et best practices.
Prérequis
- Directus en production (voir tutoriel installation).
- Compréhension des bases SQL.
- Niveau attendu : intermédiaire.
- Temps estimé : 1-2 heures.
Étape 1 — Plan du modèle
Pour une marketplace artisanat ouest-africain :
- Products : produits avec prix, stock, description.
- Categories : catégories hiérarchiques.
- Variants : tailles, couleurs (One-to-Many).
- Brands : marques (Many-to-One).
- Vendors : vendeurs marketplace.
- Tags : tags transversaux (Many-to-Many).
- Reviews : avis clients.
Étape 2 — Collection Products
Settings → Data Model → Create Collection : products.
Fields :
id(UUID auto, primary).status(Select : draft, published, archived).sort(Integer, pour ordering manuel).name(Input, required, unique).slug(Input, required, unique, regex slug).description(WYSIWYG).price(Decimal, required).currency(Select : XOF, MAD, TND, EUR, USD, default XOF).stock(Integer, default 0).images(Files, Multiple).category(Many-to-One → categories).brand(Many-to-One → brands).vendor(Many-to-One → vendors).tags(Many-to-Many → tags via products_tags).variants(One-to-Many → variants).
Étape 3 — Collection Categories (hiérarchique)
Pour catégories type Mode → Femme → Robes → Pagnes :
name(Input).slug(Input, unique).parent(Many-to-One → categories, self-reference).children(One-to-Many → categories, alias).icon(File).sort(Integer).
Étape 4 — Collection Variants
Pour produits avec tailles/couleurs :
product(Many-to-One → products).size(Select : XS, S, M, L, XL, XXL).color(Input).price_adjustment(Decimal, default 0).stock(Integer).sku(Input, unique).
Étape 5 — Many-to-Many : products_tags
Directus crée automatiquement la junction table. Sur products → field tags → Many to Many → choisir collection tags. Directus génère products_tags avec FK products_id et tags_id.
Étape 6 — Champs multilingues (translations)
Pour Maroc/Tunisie/Algérie servant FR + AR :
- Field type : Translations.
- Languages : FR, AR, EN.
- Fields traduits : name, description, slug.
Directus crée auto une collection products_translations avec FK product_id et locale.
Étape 7 — Validations métier
Field price : Validation type → Number → min: 0. Custom : ne pas accepter price = 0 si status = published.
Slug : Regex ^[a-z0-9-]+$. Unique.
Stock : > 0 si status = published.
Étape 8 — Computed fields
Champ « display_price » qui formate prix avec currency :
// Field type: Custom (formula)
{{ price | format_currency(currency) }}Étape 9 — Permissions par champ
Role Editor : peut update name, description, price, images. Pas update status (Reviewer only). Pas delete.
Étape 10 — Test API
curl https://cms.votre-entreprise.com/items/products?fields=*,category.name,brand.name,images.*&filter[status][_eq]=published
# Retourne produits publiés avec catégorie + marque + images peupléesErreurs fréquentes
| Erreur | Cause | Solution |
|---|---|---|
| M2M ne fonctionne pas | Junction table mal créée | Recréer field via Studio |
| Translations vides | Default language pas sauvegardé | Toujours fournir version par défaut |
| Slug doublons | Pas unique constraint | Activer unique au niveau field |
| Image upload échoue | Storage S3 mal configuré | Voir tutoriel installation |
| Performance N+1 | Pas de fields populate | ?fields=*,relation.* |
| Sort manuel ne marche pas | Field sort non créé | Ajouter Integer sort |
Adaptation au contexte ouest-africain
Trois précisions. Multi-currency : produits en XOF (Sénégal/CI), MAD (Maroc), TND (Tunisie). Champ currency par produit + display formatting frontend. Vendeurs marketplace : vendor as collection séparée + Many-to-One product → vendor permet marketplace multi-vendeur. Tags transverses : « bio », « artisanal », « fait main » comme tags M2M, filtres puissants côté API.
Tutoriels frères
FAQ
Migrations schema en prod ? Studio génère migrations Knex.js. Apply via npx directus database migrate:latest.
Modifier collection sans Studio ? Direct SQL puis Studio refresh. Mais préférable via Studio pour cohérence.
Performance avec 1M items ? Indexes sur foreign keys + status + slug. Pagination 25 items/page.
Schema export ? npx directus schema snapshot → JSON portable.
Versioning content ? Directus 11+ a Content Versioning (revisions).
Pour aller plus loin
- 🔝 Retour au pilier : Guide complet Directus 2026
- Documentation Data Model : docs.directus.io/app/data-model