Prerequisites
Before starting your integration:- Review Key Concepts for an overview of Sonar’s architecture
- Read the Technical Overview to understand the end-to-end purchase flow
- Understand Entities to learn how users, entities, and wallets relate
Integration Approaches
Your frontend application orchestrates the complete purchase flow: user authentication, eligibility verification, requesting purchase permits, and submitting transactions onchain. Choose an approach based on your architecture.Frontend-only
Best for: SPAs without a backendAll authentication and API calls happen client-side using React hooks. Tokens are stored in browser storage.
- Simpler to implement
- Uses
@echoxyz/sonar-reacthooks - Example app →
Frontend with Backend
Best for: Apps that already have a backendOAuth tokens are stored server-side and all Sonar API requests are proxied through your backend.
- More secure (tokens never exposed to browser)
- Automatic token refresh on server
- Example app →