Vanlige Sanity-skjemafeil og beste praksis

2 måneder siden

· 1 minutt

Når man bygger innholdsbackends med Sanity, faller utviklere ofte i feller som gjør skjemaene deres vanskelige å vedlikeholde eller vanskelige å skalere. Med utgangspunkt i vårt teams meningssterke retningslinjer, her er de vanligste feilene og hva du bør gjøre i stedet.

Feil 1: Modellering for presentasjon

Den vanligste feilen er å modellere "hvordan ting ser ut" i stedet for "hva ting er".

Ikke gjør dette: Navngi felter basert på deres visuelle utseende i et spesifikt design.

Gjør dette i stedet: Modeller intensjonen til innholdet.

Ved å koble innhold fra presentasjon, kan du redesigne frontend uten å migrere dataene dine.

Feil 2: Ignorere typesikkerhetshjelpere

Sanity tilbyr hjelpefunksjoner for å sikre at skjemaet ditt er gyldig og strengt typet.

Ikke gjør dette: Bruke vanlige objekter for skjemadefinisjoner.

Gjør dette i stedet: Bruk alltid defineType, defineField og defineArrayMember.

Feil 3: Boolean-feller

Boolean-felter er fristende for bryteknapper, men de maler deg inn i et hjørne hvis kravene endres.

Ikke gjør dette: Bruke en boolean for tilstand som kan bli ikke-binær.

Gjør dette i stedet: Bruk et strengfelt med en liste over alternativer. Det er utvidbart og klarere.

Feil 4: Manglende kontekst

Skjemaer uten beskrivelser eller validering lar redaktører gjette.

Gjør dette: Inkluder korte, nyttige beskrivelser og valideringsregler.

Oppsummering

God innholdsmodellering handler om å skape en strukturert, semantisk representasjon av domenet ditt. Ved å følge disse praksisene, sikrer du at innholdsbackenden din forblir fleksibel, vedlikeholdbar og brukervennlig for redaktørene dine.

typescript

defineField({
  name: 'bigRedButton',
  type: 'object',
  fields: [
    {name: 'text', type: 'string'},
    {name: 'url', type: 'string'}
  ]
})

typescript

defineField({
  name: 'primaryCallToAction',
  type: 'object',
  fields: [
    defineField({name: 'label', type: 'string'}),
    defineField({name: 'destination', type: 'url'})
  ]
})

javascript

export default {
  name: 'blog',
  type: 'document',
  fields: [...]
}

typescript

import {defineType, defineField} from 'sanity'

export default defineType({
  name: 'blog',
  type: 'document',
  fields: [
    defineField({
      name: 'title',
      type: 'string'
    })
  ]
})

typescript

defineField({
  name: 'isPublished',
  type: 'boolean'
})

typescript

defineField({
  name: 'status',
  type: 'string',
  options: {
    list: [
      {title: 'Draft', value: 'draft'},
      {title: 'Published', value: 'published'},
      {title: 'Archived', value: 'archived'}
    ],
    layout: 'radio'
  }
})

typescript

defineField({
  name: 'slug',
  title: 'URL Slug',
  description: 'The unique URL part for this page',
  type: 'slug',
  validation: (rule) => rule.required().error('A slug is required for the page to be reachable')
})

Vanlige Sanity-skjemafeil og beste praksis

På denne siden

Feil 1: Modellering for presentasjon

Feil 2: Ignorere typesikkerhetshjelpere

Feil 3: Boolean-feller

Feil 4: Manglende kontekst

Oppsummering

Del artikkel