# Types from agent to component

Deploy React apps with end-to-end type safety flowing from your agent schemas to your hooks. Streaming, WebSockets, and SSE are pre-configured. Just write components.

## Type-safe hooks, streaming built in

Schema types flow from your agents to your React hooks. Streaming responses, WebSockets, and SSE are wired up automatically.

### End-to-End Type Safety

Agent schemas produce typed hooks via @agentuity/react. useAPI, useWebSocket, and useEventStream all know your data shapes at compile time.

### Streaming and Real-Time

Streaming responses, WebSocket connections, and SSE are pre-configured. Get live updates from your agents without polling or custom protocols.

### Deploy Alongside or Separately

Deploy your frontend with your agents or separately on any hosting platform you prefer. The RPC client works in any JavaScript environment.

## From component to production

Write React components, connect to your agent backend, and deploy. Get automatic HTTPS, global CDN distribution, and instant cache invalidation without touching infrastructure code.

## See it in action

Watch this 1-minute overview to see how to use Agentuity's React Frontend to build a type-safe React application with your agents.

## Resources

[**React Hooks**  
Call your API routes from React with type-safe useAPI, useWebSocket, and useEventStream hooks from @agentuity/react.  
Read](https://agentuity.dev/frontend/react-hooks)  
[**Provider Setup**  
Configure AgentuityProvider for local development and production deployments with environment-based configuration.  
Read](https://agentuity.dev/frontend/provider-setup)  
[**Adding Authentication**  
Add user authentication with Clerk, Auth0, or other identity providers using the @agentuity/auth package.  
Read](https://agentuity.dev/frontend/authentication)  
[**Deployment Scenarios**  
Deploy your frontend alongside agents or separately on any hosting platform you prefer.  
Read](https://agentuity.dev/frontend/deployment-scenarios)  
[**Frontend Project Structure**  
Understand the convention-based structure with src/web/ for frontend code bundled with your agents.  
Read](https://agentuity.dev/get-started/project-structure#frontend-srcweb)

## Frequently Asked Questions

How does type safety flow to my React app?

Can I deploy my frontend separately?

Does it support streaming?

## Ready to build your agent interface?

Deploy React apps in minutes, not days.
