Skip to main content

Refract Documentation

Build predictable, reactive applications with declarative optics, reusable components, and minimal boilerplate.

🚀 Get Started📖 Tutorial
⭐4.9/5 Developer Rating
🔒Enterprise Ready
⚡99.9% Uptime
Quick Start
// Install the library
npm install @refract/core

// Initialize and use
import { createRefraction } from '@refract/core';

const state = createRefraction({
  count: 0,
  user: null
});

// Reactive updates
state.count.set(42);
console.log(state.count.get()); // 42

Core Concepts

Discover the powerful building blocks that make our platform unique. Official libraries come with enhanced support and documentation.

⭐Official
⚡

Refractions✓

Reactive state units similar to signals or stores. Keep your UI in sync with minimal effort and maximum performance. Built-in TypeScript support.

→
⭐Official
🔍

Lenses✓

Scope-aware helpers for accessing props, effects, and state in a clean and composable way. Write cleaner, more maintainable code with zero boilerplate.

→
⭐Official
🔗

Optics✓

Composable logic units like hooks. Organize and reuse app logic effortlessly across your entire application with functional composition.

→

Why Choose Refract?

Built for modern development teams who value quality, performance, and developer experience

👨‍💻

Developer Experience

Built with developers in mind. Full TypeScript support, excellent IDE integration, comprehensive documentation, and interactive examples.

🚀

Performance First

Optimized for speed and efficiency. Minimal bundle size with maximum functionality. Tree-shakable modules and zero runtime overhead.

🤝

Community Driven

Open source and community-driven. Join thousands of developers building amazing things. Active Discord community and regular updates.

🧩

Composition API

Better logic reuse and organization. Build complex features from simple, reusable pieces. Embrace functional programming principles.