skills.rest
remix-run
remix-runOFFICIAL
Explore all skills by this author →
Website𝕏@remix_runGitHub

make-demo

Create or revise Remix demos under demos/<name>/ with standard app structure.

33.3k|2.8k|Updated Oct 26, 2020
Search Tags:#workflow#review#code-quality#demos#demo#best-practices#remix
One-click install
npx skills add https://github.com/remix-run/remix --skill make-demo
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: make-demo
Source: https://github.com/remix-run/remix/tree/main/.agents/skills/make-demo
Command: npx skills add https://github.com/remix-run/remix --skill make-demo

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Duplicated or ad-hoc remix demos are hard to maintain, leaving new contributors without clear, production-grade examples. The Make Demo skill provides a structured approach to create or revise demos that teach Remix patterns with good hygiene and durable code artifacts.

Core Features & Use Cases

  • Guides contributors to craft focused demos under demos/<name>/ that showcase Remix packages, patterns, and best practices.
  • Enforces a consistent project structure (demos/<name>/app, server, public, and documentation) and a readable code layout that readers can adapt.
  • Helps review existing demos for clarity, accessibility, and production-readiness, ensuring code hygiene and realistic edge cases.

Quick Start

Create or revise a demo under demos/<name>/ following the repository's conventions to ensure a durable, well-documented, production-ready example

Frequently Asked Questions about make-demo

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

FAQPage Schema
How do I structure a new Remix demo to follow repository best practices?▼

Structure Remix demos under demos/<name>/ with a standard app layout, server, public, and documentation. This enforces consistent Remix conventions, ensuring durable, production-ready examples that teach patterns effectively.

What is the standard project layout for Remix demos?▼

The standard Remix demo layout organizes code under demos/<name>/app, alongside server and public directories, plus documentation. This readable structure ensures contributors can adapt examples while maintaining code hygiene.

How do I review existing Remix demos for code quality and production readiness?▼

Review Remix demos for clarity, accessibility, and production-readiness. This process checks code hygiene, verifies adherence to Remix conventions, and ensures realistic edge cases are handled properly.

Can I use this approach to update ad-hoc Remix demos?▼

Yes, you can revise ad-hoc Remix demos by applying structured conventions. Moving them under demos/<name>/ with standard layouts and documentation transforms duplicated code into maintainable, production-grade examples.

Why do duplicated Remix demos cause maintenance problems?▼

Duplicated Remix demos lack clear structure, leaving new contributors without production-grade examples. Standardizing demos under demos/<name>/ solves this by enforcing consistent layouts and durable code artifacts.

Related Skills

Explore More Software Engineering Skills→
mcj-codermcj-coder
1

greenfield-baseline

Automate project scaffolding with quality gates, CI/CD, and repository structure.

Community
Advanced
constellizeconstellize
1

leverage-ai-assistance

Generate tests, documentation, and deployment readiness artifacts for software projects.

Official
Advanced
mgd34msumgd34msu
4

sveltekit

Develop full-stack applications with SvelteKit routing, SSR, and data loading.

Community
Intermediate
HechaoYannetHechaoYannet

test-helpers

Generate engine-specific test helpers and factories into tests/helpers.

Community
Intermediate