Skip to content

From mocks to an API: the data contract

Replace the data source while preserving components, server rendering, search and FSD boundaries.

Who it is for
Developers and technical partners
Author
SkiMobile team
Published

Change the source, retain the contract

Resorts, branches, contacts and assets arrive through typed data snapshots. The current repository reads a local mock. Components receive data through a layer’s public export and do not choose a server endpoint themselves.

The knowledge base uses KnowledgeSnapshot, with KnowledgeRepository.read() as the source boundary. A separate backend replaces the read() implementation while retaining the snapshot structure.

Repository contract · TypeScript
interface KnowledgeRepository {
  read(): Promise<KnowledgeSnapshot>;
}

const snapshot = parseKnowledgeSnapshot(
  await knowledgeRepository.read(),
);

Validation and composition

Validate the API response at the boundary: RU/EN locales, unique IDs and slugs, an existing category, safe links, dates and article-section identifiers. Invalid responses must not silently become invented information.

Models and repositories belong to entities. User workflows belong to features; page composition belongs to _pages and _app. Shared components and utilities do not import business entities from upper layers.

Connection checklist

  • Match the DTO to the local contract, including empty values and both locales.
  • Check load failures and unknown identifiers.
  • Use one snapshot for the page, metadata, JSON-LD and sitemap.
  • Configure server-cache refresh after publishing or updating an article.
  • Repeat search, direct links, language switching and offline reading of a visited article.

Materials and sources

Read next

Making motion accessible

Control looping animation, pause and reduced motion without losing the interface’s meaning.

Digital products

  • Motion
  • Accessibility
  • SVG

Preparing an article for indexing

Title, description, permanent URL, translations, sources and publication state: a release checklist.

Engineering and SEO

  • SEO
  • Content
  • RU/EN