🧬 Test It for Nuxt


A powerful and easy-to-use A/B testing module for Nuxt.js applications, powered by Test It.

📚 Table of Contents

- Features
- Installation
- Usage
- Basic Setup
- Creating an Experiment
- Checking Variants
- Tracking Events
- API Reference
- Configuration
- Contributing
- License

✨ Features

- 🚀  Easy integration with Nuxt.js projects
- 🔧  Automatic variant assignment
- 📊  Built-in event tracking

💻 Installation

Install the module using your preferred package manager:

``bash


Using npm

npm install test-it-nuxt

Using yarn

yarn add test-it-nuxt

Using pnpm

pnpm add test-it-nuxt
`

🚀 Usage

$3

1. Add the module to your nuxt.config.ts:

`typescript
export default defineNuxtConfig({
modules: ["test-it-nuxt"],

public: {
abTesting: {
projectId: "your-project-id",
},
},
});
`

$3

Use the useExperiment composable in your Vue component:

`vue

`

$3

Check which variant the user is assigned to:

You can use experiment.isVariant to check if the user is in a specific variant.

It works in both template and script setup.

`vue
// script setup

`

`vue
// template

`

$3

Track conversion events using the trackExperimentEvent composable:

`vue



`

📘 API Reference

$3

Creates an experiment instance.

- setVariants(variants: Variant[]): void - Sets the variants for the experiment
- isVariant(variantName: string): boolean - Checks if the current variant matches the given name
- currentVariant: Ref - The current variant for the user

$3

Tracks a custom event for the experiment. Optionally pass data to track.

⚙️ Configuration

Configure the module in your nuxt.config.ts:

`typescript
export default defineNuxtConfig({
// ... other config
abTesting: {
projectId: "your-project-id",
cookieKey: "experiments",
},
});
`

IMO it's better to manually track page views using the trackExperimentEvent` composable. It's not an analytics app, so only track what you need.

🤝 Contributing

If you do have suggestions for improvements, let me know!