Molecule.dev

Video Editor

Creative Tools · React + Node (Express) · 19 @molecule/* packages

Clipchamp-like video editor with timeline, clips, transitions, and export — with built-in Stripe-backed subscription tiers

Open in Molecule

Try it

Opens instantly. Runs on sample data, so changes reset on reload.

Open preview in a new tab ↗View workspace ↗

What is inside

Screens (16)

  • Landing /
  • Login /login
  • Signup /signup
  • ForgotPassword /forgot-password
  • ResetPassword /reset-password
  • Dashboard /dashboard (signed in)
  • Editor /editor/:id (signed in)
  • AssetLibrary /assets (signed in)
  • ExportQueue /export (signed in)
  • Templates /templates (signed in)
  • Settings /settings (signed in)
  • NewProject /projects/new (signed in)
  • ProjectDetail /projects/:id (signed in)
  • AssetDetail /assets/:id (signed in)
  • TemplateDetail /templates/:id (signed in)
  • ExportDetail /export/:id (signed in)

Data model (11 tables)

  • video_projects — id, owner_id, name, description, width, height, fps, duration_ms, …
  • tracks — id, project_id, owner_id, name, type, muted, locked, position, …
  • clips — id, project_id, track_id, owner_id, source_url, type, start_time, end_time, …
  • transitions — id, project_id, owner_id, type, duration_ms, clip_before_id, clip_after_id, position, …
  • video_exports — id, project_id, owner_id, format, quality, resolution, status, progress, …
  • assets — id, owner_id, name, kind, source_url, thumbnail_url, duration_ms, width, …
  • templates — id, name, description, cover_image_url, project_snapshot, is_premium, category, created_at, …
  • effects — id, clip_id, project_id, owner_id, kind, parameters, position, created_at, …
  • devices — id, createdAt, updatedAt, userId, name, pushPlatform, pushSubscription, hasPushSubscription
  • tags — id, name, slug, color, description, createdAt, updatedAt
  • resource_tags — id, tagId, resourceType, resourceId, createdAt

API (7 handlers)

  • assets api/src/handlers/assets.ts
  • clips api/src/handlers/clips.ts
  • effects api/src/handlers/effects.ts
  • exports api/src/handlers/exports.ts
  • projects api/src/handlers/projects.ts
  • templates api/src/handlers/templates.ts
  • timeline api/src/handlers/timeline.ts

Subscription tiers

free / pro / team — gated by: maxClips, maxExports, maxProjects, maxTimeline, advancedFeatures, canExport, retentionDays

Built from 19 @molecule/* packages

Browse all @molecule/* packages →

Required secrets

  • DATABASE_URL PostgreSQL connection string
  • S3_BUCKET S3 bucket for media storage

The @molecule/* packages are Apache-2.0. The app you build from this template is yours to export and self-host. Licensing