Adding AI features to your app with m77.ai

Adding AI to an app usually means signing up for a model provider, storing an API key on a server, and writing a backend endpoint so the key never reaches the browser. In builder77, that's already done. Every app has m77.ai.chat, and calls are billed to the app owner's integration credits — 1 credit per 500 tokens (input + output, minimum 1 per call).

The basics

const reply = await m77.ai.chat('Suggest three names for a coffee shop by the sea');

const answer = await m77.ai.chat(
  [{ role: 'user', content: question }],
  { system: 'You are a friendly barista. Answer in two sentences.' }
);

Pass a string for a one-off prompt, or an array of messages for a conversation. The optional system instruction sets the tone and rules.

Structured output with json: true

Most useful AI features don't want prose — they want data your UI can render. Set json: true and describe the shape you want. You get a parsed object back.

const recipe = await m77.ai.chat(
  `Create a recipe using: ${ingredients.join(', ')}.
   Return JSON: { "title": string, "minutes": number, "steps": string[] }`,
  { json: true }
);
renderRecipe(recipe);

Five patterns that work well

• Summarize: turn long notes, reviews or support tickets into a short summary at the top of a page.
• Classify: tag incoming form submissions by topic or urgency, then store the label with m77.db.update.
• Generate drafts: product descriptions, social posts, email replies — always editable before saving.
• Extract: pull dates, amounts or names out of free text into fields.
• Assist: a small chat panel that answers questions about the content on the page.

Save results so you don't pay twice

Calls are metered by tokens: 1 integration credit per 500 tokens (input + output, minimum 1 per call), so a typical reply costs about 3–4 credits. If a result doesn't change often — a summary of a document, tags for a record — store it in the database and only regenerate it when the source changes.

if (!note.summary) {
  const summary = await m77.ai.chat(`Summarize in one sentence: ${note.body}`);
  await m77.db.update('notes', note.id, { summary });
}

Design for waiting and failure

AI calls take a moment, so treat them like any network request: disable the button, show a loading state, and handle errors with a friendly message. m77.toast('Something went wrong', 'error') is an easy fallback. The apps builder77 builds do this by default, but it's worth checking when you add features by hand.

Write prompts like specs

The same advice that applies to building apps applies to prompts inside them. Be specific about length, tone, format and what to do when input is missing or odd.

You write product descriptions for a handmade ceramics shop. Max 40 words. Warm, concrete, no superlatives. If the input lacks details, write a short neutral description instead of inventing facts.

Be responsible with AI output

• Tell users when content is AI-generated, especially in chat interfaces.
• Let people review and edit AI drafts before they're published or sent.
• Don't use AI output as the final word on health, legal or financial questions.
• Avoid sending sensitive personal data in prompts unless it's essential.

Ask builder77 to build it

You rarely need to write any of this yourself. Try prompts like "add an AI button that suggests tags for each note and saves them" or "add a chat assistant that answers questions about the menu". The builder knows m77.ai and will wire up the UI, loading states and storage for you.