skills.rest
tldraw
tldrawOFFICIAL
Explore all skills by this author →
Website𝕏@tldrawGitHub

write-example

Create tldraw SDK examples with standardized folders and frontmatter metadata.

49.7k|3.4k|Updated May 9, 2021
Search Tags:#documentation#sdk#example#frontmatter#folder-structure#tldraw
One-click install
npx skills add https://github.com/tldraw/tldraw --skill write-example
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: write-example
Source: https://github.com/tldraw/tldraw/tree/main/.claude/skills/write-example
Command: npx skills add https://github.com/tldraw/tldraw --skill write-example

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps developers create consistent, well-documented SDK example projects for the tldraw ecosystem by providing a standardized folder structure, frontmatter metadata, and example templates.

Core Features & Use Cases

  • Standardized example structure: Guidelines for folders and README metadata so examples are uniform across the site.
  • Frontmatter-driven metadata: YAML frontmatter fields like title, component, category, priority, keywords drive discovery and organization.
  • Reusable example templates: Small, focused example files that illustrate SDK usage within apps/examples.
  • Use Case: When adding a new SDK demonstration, use these conventions to ensure consistency and discoverability.

Quick Start

Create a new example folder under apps/examples/src/examples/, add a README.md with the prescribed frontmatter, a main file named MyExampleExample.tsx, and an optional CSS file named my-example.css, then reference the example in your docs.

Frequently Asked Questions about write-example

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a tldraw SDK example with the correct folder structure?▼

Create a tldraw SDK example by adding a new folder under apps/examples/src/examples/, including a README.md with required frontmatter, a main MyExampleExample.tsx file, and an optional my-example.css file for consistent SDK usage demonstration.

What frontmatter fields are required for tldraw SDK examples?▼

Required frontmatter fields for tldraw SDK examples include title, component, category, and keywords. These YAML metadata fields drive example discovery and organization across the tldraw examples app.

When do I need frontmatter metadata for tldraw documentation examples?▼

Frontmatter metadata is needed when adding new SDK demonstrations to ensure consistent example discoverability and organization across the tldraw ecosystem via standardized YAML fields.

Can I use a custom folder layout for tldraw SDK examples instead of the standard structure?▼

No, the Skill enforces a standard folder layout for tldraw SDK examples to ensure uniformity across the site. You must follow the prescribed apps/examples/src/examples/ directory structure and naming conventions for consistency.

What is the best way to ensure tldraw SDK examples are discoverable?▼

The best way to ensure tldraw SDK examples are discoverable is using frontmatter-driven metadata with required fields like title, component, category, and keywords. This standardized approach drives example discovery and organization across the site.

Related Skills

Explore More Content & Communication Skills→
sefllessseflless

write-example

Generate standardized tldraw SDK example templates with frontmatter and documentation.

Community
Intermediate
tldrawtldraw
49.7k

write-example

Create tldraw SDK examples with standardized folders and frontmatter metadata.

Official
Basic
NovaAI-innovationNovaAI-innovation

write-example

Generate tldraw SDK examples with React and TypeScript structure.

Community
Basic
sf-bccasf-bcca

scaffold-flat

Scaffold React components and co-located tests in flat project layouts.

Community
Intermediate