Players take a quiz. Scores go to Sutrena. Fetch the top 20 via API. No backend.
Updated March 2026
A quiz page, a leaderboard, no backend to maintain. Players submit their name and score. Fetch the top 20 via the submissions API. The quiz runs in the browser. Sutrena stores the scores. Fetch submissions sorted by score to build a leaderboard page. Put it on a projector at an event or share the link. Sutrena Pages hosts the site -- included with your plan. `sutrena_launch` for the quiz page, `sutrena_collect` for score storage -- two calls.
Architecture
| Tool | Role | Cost |
|---|---|---|
| Sutrena Pages | Static site hosting (included) | Included |
| Sutrena | Score storage, leaderboard via API | $0 (free) / $29/mo (Pro) |
Total cost: $0-$29/mo
Pro is $29/month for 100 projects and all your other work too. Build five blueprints on Pro and it is still $29/month. That is where the value is — at scale.
The quiz logic is all client-side JavaScript. When a player finishes, your code calculates the score and POSTs it to Sutrena along with the player name.
A static HTML page deployed on Sutrena Pages serves the quiz. Fetch submissions sorted by score descending, limited to 20, to build your leaderboard. publicResults is on so the leaderboard page can read scores without auth.
Form Definition
Player name and a numeric score (0-100). publicResults is on so the leaderboard is viewable by anyone via the public results API.
{
"name": "Quiz Scores",
"fields": [
{
"name": "player_name",
"label": "Player Name",
"type": "text",
"required": true
},
{
"name": "score",
"label": "Score",
"type": "number",
"required": true,
"min": 0,
"max": 100
}
],
"publicResults": true
}Frontend Integration
An HTML page that scores the quiz in the browser and sends the result to Sutrena. Fetch submissions sorted by score to build a leaderboard on a separate page. Replace the form ID with yours.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Quiz</title>
</head>
<body>
<h1>Quick Quiz</h1>
<form id="quiz-form">
<label>
Your Name
<input name="player_name" required />
</label>
<p>1. What is 2 + 2?</p>
<label><input type="radio" name="q1" value="4" /> 4</label>
<label><input type="radio" name="q1" value="5" /> 5</label>
<p>2. Capital of France?</p>
<label><input type="radio" name="q2" value="Paris" /> Paris</label>
<label><input type="radio" name="q2" value="London" /> London</label>
<button type="submit">Submit</button>
</form>
<p id="result"></p>
<p><a href="#leaderboard">View Leaderboard</a></p>
<script>
const FORM_ID = "frm_YOUR_FORM_ID";
const answers = { q1: "4", q2: "Paris" };
document.getElementById("quiz-form").addEventListener("submit", async (e) => {
e.preventDefault();
const fd = new FormData(e.target);
let score = 0;
if (fd.get("q1") === answers.q1) score += 50;
if (fd.get("q2") === answers.q2) score += 50;
const res = await fetch(
`https://sutrena.com/api/forms/${FORM_ID}/submit`,
{
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
player_name: fd.get("player_name"),
score: score,
}),
}
);
if (res.ok) {
document.getElementById("result").textContent =
`Score: ${score}/100. Check the leaderboard!`;
}
});
</script>
</body>
</html>Yes. sutrena_collect creates the form and webhooks in one call. sutrena_launch deploys pages with analytics. The code examples below show primitive APIs for full control, but compound tools handle most setups faster.
Scoring is client-side, so yes, they can. For casual quizzes this is fine. For anything competitive, you would need a Cloudflare Worker that checks answers server-side before sending the score to Sutrena. Tradeoff: more work, more honest results.
Add uniqueBy: ["player_name"] to the form. Same name cannot submit twice. For stricter dedup, use email or a Clerk user_id instead.
Submissions are available via the API immediately. Your leaderboard page can fetch the latest scores on each page load or poll periodically.
As many as you want. The quiz logic lives in your frontend. The form only receives the final score.
No. Sutrena Pages hosts the HTML. Forms are also on Sutrena. One platform, one API key.
Sutrena is the web runtime for AI agents. Forms, Pages, Analytics, Webhooks, Automations — all through 67 MCP tools and one REST API. Your agent creates web artifacts, humans interact with them, and your agent gets the data back. Use any one feature or all of them together.
Pages
Deploy HTML instantly
Forms
Collect structured data
Automations
DSL-based pipelines with 14 step types
Analytics
Privacy-first, no cookies
Webhooks
Slack, Discord, Telegram
1. Get a trial key (no auth, no signup)
curl -X POST https://sutrena.com/api/trial2. Create anything — a page, form, automation, or analytics site
# Create a form
curl -X POST https://sutrena.com/api/forms \
-H "Authorization: Bearer st_trial_xxx" \
-H "Content-Type: application/json" \
-d '{"name": "waitlist", "fields": [{"name": "email", "label": "Email", "type": "email", "required": true}]}'
# Or deploy a page
curl -X POST https://sutrena.com/api/pages \
-H "Authorization: Bearer st_trial_xxx" \
-H "Content-Type: application/json" \
-d '{"slug": "index", "title": "My Site", "html": "<h1>Live</h1>"}'Get a trial API key instantly with no signup, or create an account for the full experience.