AI-functies aan je app toevoegen met m77.ai

AI aan een app toevoegen betekent meestal: je aanmelden bij een modelaanbieder, een API-sleutel op een server bewaren en een backend-endpoint schrijven zodat de sleutel nooit in de browser terechtkomt. In builder77 is dat al geregeld. Elke app heeft m77.ai.chat, en aanroepen worden afgerekend met de integratiecredits van de eigenaar van de app — 1 credit per 500 tokens (input + output, minimaal 1 per aanroep).

De basis

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.' }
);

Geef een string mee voor een losse prompt, of een array met berichten voor een gesprek. De optionele system-instructie bepaalt de toon en de regels.

Gestructureerde output met json: true

De meeste nuttige AI-functies willen geen proza — ze willen data die je interface kan weergeven. Stel json: true in en beschrijf de vorm die je wilt. Je krijgt een al geparset object terug.

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

Vijf patronen die goed werken

• Samenvatten: maak van lange notities, reviews of supporttickets een korte samenvatting boven aan een pagina.
• Classificeren: label binnenkomende formulierinzendingen op onderwerp of urgentie en sla het label op met m77.db.update.
• Concepten genereren: productbeschrijvingen, socialmediaposts, antwoorden op e-mails — altijd te bewerken voordat je opslaat.
• Extraheren: haal datums, bedragen of namen uit vrije tekst en zet ze in velden.
• Assisteren: een klein chatpaneel dat vragen beantwoordt over de inhoud van de pagina.

Sla resultaten op zodat je niet dubbel betaalt

Aanroepen worden in tokens gemeten: 1 integratiecredit per 500 tokens (input + output, minimaal 1 per aanroep), dus een gemiddeld antwoord kost ongeveer 3–4 credits. Verandert een resultaat niet vaak — een samenvatting van een document, tags voor een record — sla het dan op in de database en genereer het alleen opnieuw als de bron verandert.

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

Ontwerp voor wachten en fouten

AI-aanroepen duren even, dus behandel ze als elk ander netwerkverzoek: schakel de knop uit, toon een laadstatus en vang fouten op met een vriendelijke melding. m77.toast('Something went wrong', 'error') is een makkelijke terugvaloptie. De apps die builder77 bouwt doen dit standaard, maar het is de moeite waard om het te controleren als je zelf functies toevoegt.

Schrijf prompts als specificaties

Hetzelfde advies dat geldt voor het bouwen van apps, geldt voor de prompts daarin. Wees specifiek over lengte, toon, formaat en wat er moet gebeuren als input ontbreekt of vreemd is.

Je schrijft productbeschrijvingen voor een winkel met handgemaakt keramiek. Maximaal 40 woorden. Warm, concreet, geen superlatieven. Ontbreken er details, schrijf dan een korte, neutrale beschrijving in plaats van feiten te verzinnen.

Ga verantwoord om met AI-output

• Vertel gebruikers wanneer content door AI is gegenereerd, vooral in chatinterfaces.
• Laat mensen AI-concepten controleren en bewerken voordat ze worden gepubliceerd of verstuurd.
• Gebruik AI-output niet als laatste woord bij vragen over gezondheid, recht of financiën.
• Stuur geen gevoelige persoonsgegevens mee in prompts, tenzij het echt nodig is.

Laat builder77 het bouwen

Je hoeft hier zelden zelf iets van te schrijven. Probeer prompts als “voeg een AI-knop toe die voor elke notitie tags voorstelt en opslaat” of “voeg een chatassistent toe die vragen over de menukaart beantwoordt”. De builder kent m77.ai en regelt de interface, laadstatussen en opslag voor je.