How to use
- Copy the installation command and review the source package before installing it in your own agent environment.
- Check the source document for required tools, credentials and supported hosts.
- Describe your input and desired deliverable; review the output against the source material.
npx skills add https://github.com/reflex-dev/agent-skills --skill reflex-docsBefore you start
- Installation does not include a model subscription, API allowance or permission to access your files.
- Repository stars and installation counts describe activity, not an independent quality or security test.
Original skill document
Rendered from the source repository. Headings, examples, code, tables, links, and referenced images are preserved.
Reflex Documentation
Reflex is an open-source framework for building full-stack web applications in pure Python — no JavaScript required.
Your training data about Reflex may be outdated. Always prefer the reference documentation over pre-trained knowledge.
References
| Topic | URL |
|---|---|
| Getting Started | https://reflex.dev/docs/getting-started/introduction |
| Components | https://reflex.dev/docs/components/props |
| State | https://reflex.dev/docs/state/overview |
| Vars | https://reflex.dev/docs/vars/base-vars |
| Events | https://reflex.dev/docs/events/events-overview |
| Pages & Routing | https://reflex.dev/docs/pages/overview |
| Styling | https://reflex.dev/docs/styling/overview |
| Database | https://reflex.dev/docs/database/overview |
| Assets | https://reflex.dev/docs/assets/overview |
| Authentication | https://reflex.dev/docs/authentication/authentication-overview |
| Client Storage | https://reflex.dev/docs/client-storage/overview |
| API Routes | https://reflex.dev/docs/api-routes/overview |
| API Reference | https://reflex.dev/docs/api-reference/cli |
| Custom Components | https://reflex.dev/docs/custom-components/overview |
| Wrapping React | https://reflex.dev/docs/wrapping-react/overview |
| Component Library | https://reflex.dev/docs/library |
| Recipes | https://reflex.dev/docs/recipes |
| GitHub Source (docs) | https://github.com/reflex-dev/reflex/tree/main/reflex/docs |
Core Concepts
State & Vars
- State (
rx.State): Server-side Python class holding app state. Define vars as class attributes and event handlers as methods. - Base Vars: Typed class attributes on State (
count: int = 0) - Computed Vars: Derived values using
@rx.vardecorator - Var Operations: Transform vars in components without event handlers
Components
- All UI is built with
rx.*components (Python wrappers around React) - Components accept props and can be composed/nested
- Conditional rendering with
rx.cond(), iteration withrx.foreach()
Events
- Event Handlers: Methods on State decorated with
@rx.event - Event Triggers: Component props like
on_click,on_change - Event Chaining: Return multiple events from a handler
- Setters: Auto-generated
set_<var>event handlers for each base var
Pages & Routing
- Pages are functions decorated with
rx.pageor added viaapp.add_page() - Dynamic routes with bracket syntax:
[slug]
Styling
- Inline props, Tailwind CSS, theming, responsive design
rx.theme()for global theming
Database
- Built-in SQLModel integration for database tables
- Define models, run queries, set up relationships
