Build an AI Recipe Generator with AI Pass SDK
Build an AI Recipe Generator with AI Pass SDK
Recipe generators are one of the most popular AI tools. Here's how to build one for your website and earn commission on every recipe generated.
What You'll Build
A web app where users enter ingredients and get back a complete recipe. Simple, useful, and profitable — you earn 50% commission on every API call.
Step 1: Create an AI Pass Account
Sign up at aipass.one and verify your email for commission payouts.
Step 2: Get Your Client ID
-
Go to the Developer Dashboard
-
Navigate to OAuth2 Clients and create one
-
Copy your Client ID (format:
client_XXXX— NOT your app slug!)
Step 3: Add the SDK
Step 4: Initialize
AiPass.initialize({
clientId: 'client_YOUR_CLIENT_ID',
requireLogin: true
});
Step 5: Generate Recipes
Use generateCompletion() for text-based recipe generation:
async function getRecipe(ingredients, preferences) {
const result = await AiPass.generateCompletion({
model: 'openai/gpt-4.1-mini',
messages: [
{
role: 'system',
content: 'You are a professional chef. Given ingredients, create a detailed recipe with: name, servings, prep time, cook time, ingredients list with measurements, step-by-step instructions, and tips.'
},
{
role: 'user',
content: `Ingredients: ${ingredients}. ${preferences || ''}`
}
]
});
return result.choices[0].message.content;
}
Step 6: Complete Example
AI Recipe Generator
# What's in your kitchen?
Get Recipe
AiPass.initialize({
clientId: 'client_YOUR_CLIENT_ID',
requireLogin: true
});
async function generate() {
const ingredients = document.getElementById('ingredients').value;
const prefs = document.getElementById('prefs').value;
const r = await AiPass.generateCompletion({
model: 'openai/gpt-4.1-mini',
messages: [
{role: 'system', content: 'You are a professional chef. Create a detailed recipe with name, servings, prep/cook time, ingredients with measurements, step-by-step instructions, and tips.'},
{role: 'user', content: `Ingredients: ${ingredients}. ${prefs}`}
]
});
document.getElementById('recipe').textContent = r.choices[0].message.content;
}
Deploy Your App
Option A: Self-Host — Host the HTML file on your own server, GitHub Pages, Netlify, Vercel, or anywhere you want. The SDK handles all AI Pass authentication and billing. Your app, your domain, your rules.
Option B: Publish on AI Pass — Submit to the AI Pass catalog at aipass.one/apps. Get a dedicated page, discoverability, and use the embed feature (</> button) to iframe it into any website.