Skip to content

Adding a new case study

The easiest and safest way to create a new case is to use the built-in scaffold command in your generated project.

Create the case

bash
npm run portfoliable-create-case -- --name "My New Case"

This creates a starter case file under your content folder with the expected metadata structure and localized sections.

Fill in the required metadata

Before writing the body content, confirm these values are present and correct:

  • id
  • slugByLocale
  • localized title
  • localized shortDesc
  • localized readTime
  • thumbCategory
  • thumbBrand
  • thumbModel
  • thumbColor

Without these, the case may not render correctly in the gallery or case reader.

Keep the case content localized

Use explicit language blocks so each locale is easy to maintain:

md
<!-- lang:en -->
## Context
Your English case details go here.

<!-- lang:pt -->
## Contexto
Detalhes do caso em português.

This pattern keeps your content readable and prevents hidden localization issues.

Add supporting details

Most strong case studies include:

  • a concise summary for the gallery card
  • a clear problem statement
  • the process or solution flow
  • measurable results or impact
  • action links for preview, repo, or live demo

Validate early and often

Run the project validation before building:

bash
npm run validate:content

Then preview the portfolio locally:

bash
npm run build
npm run preview

Common mistakes to avoid

  • reusing an id that already exists
  • changing slugByLocale values after a case has been published
  • forgetting to translate required metadata fields for a new locale
  • leaving an invalid thumbnail metadata combination

A clean case file is easier to maintain and safer to publish.

Built with VitePress and Valence.