new-example

To add a new interview topic, you create the next numbered example module, wire it into App.tsx routing, add it to Navigation.tsx, and update translations.ts for en/de/fr locales. This requires a root SKILL.md with YAML frontmatter and a structured TSX Example component.

Scaffolding a TypeScript React component involves creating the next src/examples/<nn>-<slug> folder and implementing your TopicNameExample.tsx. You then register the slug-to-component map entry in App.tsx to maintain consistent slug-based navigation across categories.

You register a new route by adding the route id to Navigation.tsx and ensuring the nav item key exists for all supported locales in translations.ts. This guarantees i18n coverage for English, German, and French discovery across the app.

Yes, adding a new example module requires manual updates to App.tsx for import ordering and slug-to-component mapping, plus updates to Navigation.tsx. You must also update translations.ts to maintain complete en/de/fr locale coverage.

Your new interview example may not appear because it lacks proper wiring in App.tsx routing, Navigation.tsx route registration, or translations.ts nav item keys. Consistent slug-based navigation requires all three updates for full i18n discovery.

Yes, this scaffolding approach applies to onboarding new study sections and adding example demos across both JavaScript and TypeScript React categories. It maintains consistent slug-based navigation and requires a structured Example component following project rules.