Constructs
Everything you need to know about building production-ready Constructs.
What is a Construct?
A Construct is a self-contained React micro-app that runs on the Work platform. Think of it like a song on Spotify - users stream Constructs to solve business problems, and Runners earn from every stream.
Constructs ARE
- • Single-file React components
- • Self-contained with localStorage
- • Styled with Tailwind CSS
- • Built with shadcn/ui components
- • Accessible and responsive
Constructs are NOT
- • Multi-page applications
- • Connected to external APIs
- • Using custom CSS or styled-components
- • Dependent on external packages
- • Complex backend-dependent apps
Core Requirements
| Requirement | Details | Why |
|---|---|---|
| Single File | One App.tsx with default export | Sandbox isolation |
| shadcn/ui Only | Use approved components | Consistent UX |
| Tailwind CSS | Utility classes only | No CSS conflicts |
| localStorage | work-construct- prefix | Data persistence |
| Lucide Icons | lucide-react only | Bundle size |
| No API Calls | No fetch, axios, etc. | Security sandbox |
| Accessible | WCAG AA compliance | Inclusive design |
| Responsive | Mobile-first design | Cross-device support |