Skip to content

Commit e7d64cb

Browse files
committed
docs: update ab-testing internal/claude docs
1 parent 47881a6 commit e7d64cb

File tree

2 files changed

+234
-97
lines changed

2 files changed

+234
-97
lines changed

CLAUDE.md

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -192,6 +192,58 @@ pnpm events-import # Import community events
192192
- `wagmi` - React hooks for Ethereum
193193
- `@rainbow-me/rainbowkit` - Wallet connection
194194

195+
## A/B Testing
196+
197+
### Overview
198+
199+
The site uses a GDPR-compliant, cookie-less A/B testing system integrated with Matomo. Tests are configured entirely through the Matomo dashboard with no code changes required.
200+
201+
### Key Features
202+
203+
- **Matomo API Integration** - Experiments configured in Matomo dashboard
204+
- **Cookie-less Tracking** - Uses deterministic IP + User-Agent fingerprinting
205+
- **Server-side Rendering** - No layout shifts, consistent variants on first load
206+
- **Real-time Updates** - Change weights instantly via Matomo (no deployments)
207+
- **Preview Mode** - Debug panel available in development and preview environments
208+
- **Automatic Fallbacks** - Graceful degradation when API fails (shows original variant)
209+
210+
### Adding a New A/B Test
211+
212+
1. **Create experiment in Matomo dashboard**:
213+
- Go to Experiments → Manage Experiments
214+
- Create new experiment with desired name (e.g., "HomepageHero")
215+
- Add variations with weights (original is implicit)
216+
- Set status to "running"
217+
218+
2. **Implement in component**:
219+
```tsx
220+
import ABTestWrapper from "@/components/AB/TestWrapper"
221+
222+
<ABTestWrapper
223+
testKey="HomepageHero" // Must match Matomo experiment name exactly
224+
variants={[
225+
<OriginalComponent key="original" />,
226+
<NewComponent key="variant" />
227+
]}
228+
fallback={<OriginalComponent />}
229+
/>
230+
```
231+
232+
**No TypeScript changes required** - the system automatically fetches configuration from Matomo.
233+
234+
### Architecture
235+
236+
- **`/api/ab-config`** - Fetches experiment data from Matomo API
237+
- **`src/lib/ab-testing/`** - Core logic for assignment and tracking
238+
- **`src/components/AB/`** - React components for testing and debugging
239+
240+
### Environment Variables
241+
242+
Required for Matomo integration:
243+
- `NEXT_PUBLIC_MATOMO_URL` - Matomo instance URL
244+
- `NEXT_PUBLIC_MATOMO_SITE_ID` - Site ID in Matomo
245+
- `MATOMO_API_TOKEN` - API token with experiments access
246+
195247
## Deployment
196248

197249
- **Platform**: Netlify (config in `netlify.toml`)

0 commit comments

Comments
 (0)