Bonnes Pratiques Sanity

Guide complet des bonnes pratiques et guides d'intégration pour le développement Sanity, maintenu par Sanity. Utilisez la référence rapide ci-dessous pour charger seulement le ou les fichiers de sujet qui correspondent à votre tâche.

Quand appliquer

Consultez ces directives quand :

• Vous configurez un nouveau projet Sanity ou intégrez une équipe
• Vous intégrez Sanity avec un framework frontend (Next.js, Nuxt, Astro, Remix, SvelteKit, Hydrogen)
• Vous écrivez des requêtes GROQ ou optimisez les performances
• Vous concevez des schémas de contenu
• Vous implémentez Visual Editing et aperçu en direct
• Vous travaillez avec des images, Portable Text ou des page builders
• Vous configurez la structure de Sanity Studio
• Vous configurez TypeGen pour la sécurité des types
• Vous implémentez la localisation
• Vous migrez du contenu depuis d'autres systèmes
• Vous créez des applications personnalisées avec Sanity App SDK
• Vous gérez l'infrastructure avec Blueprints
• Vous automatisez les workflows de contenu avec Sanity Functions

Référence rapide

Guides d'intégration

• get-started - Onboarding interactif pour les nouveaux projets Sanity
• nextjs - Next.js App Router, Live Content API, Studio intégré
• nuxt - Intégration Nuxt avec @nuxtjs/sanity
• angular - Intégration Angular avec @sanity/client, signals, resource API
• astro - Intégration Astro avec @sanity/astro
• remix - Intégration React Router / Remix
• svelte - Intégration SvelteKit avec @sanity/svelte-loader
• hydrogen - Shopify Hydrogen avec Sanity
• project-structure - Monorepo et patterns Studio intégré
• app-sdk - Applications personnalisées avec Sanity App SDK
• blueprints - Infrastructure as Code avec Sanity Blueprints
• functions - Automatiser les workflows de contenu avec Sanity Functions

Guides de sujet

• groq - Patterns de requête GROQ, sécurité des types, optimisation des performances
• schema - Conception de schéma, définitions de champs, validation, patterns de dépréciation
• visual-editing - Presentation Tool, Stega, overlays, aperçu en direct
• page-builder - Arrays de Page Builder, composants de bloc, édition en direct
• portable-text - Rendu de texte riche et composants personnalisés
• image - Schéma d'image, URL builder, hotspots, LQIP, Next.js Image
• studio-structure - Desk structure, singletons, navigation
• typegen - Configuration TypeGen, workflow, utilitaires de type
• seo - Métadonnées, sitemaps, Open Graph, JSON-LD
• localization - Patterns i18n, document vs field-level, gestion des locales
• migration - Aperçu de l'import de contenu (voir aussi migration-html-import)
• migration-html-import - HTML vers Portable Text avec @portabletext/block-tools

Comment utiliser

Commencez par le guide de framework unique ou de sujet qui correspond le mieux à la demande, puis lisez les références additionnelles seulement quand la tâche croise plusieurs préoccupations. Utilisez ces fichiers de référence pour des explications détaillées et des exemples de code :

references/groq.md
references/schema.md
references/nextjs.md

Chaque fichier de référence contient :

• Couverture complète du sujet ou de l'intégration
• Exemples de code incorrects et corrects
• Matrices de décision et guidance de workflow
• Patterns spécifiques au framework le cas échéant