Quick Guide

Get Your App a Shareable Link

You built something in Gemini. Now let's get it a real web link you can drop in the discussion board. About two minutes, totally free, no coding. Follow your computer's path below.

1 Get the single file out of Gemini

In your Gemini chat, type this exactly:

Combine this whole app into one single HTML file with all the CSS and JavaScript inside it.

When the code appears, click the copy icon at the top of the code block. That copies everything at once. Now make it into a file using your computer's steps below.

On a Mac

Open TextEdit (find it in Applications, or search with Spotlight: press Cmd + Space and type "TextEdit").
Make a new blank document. Then, in the top menu, click Format → Make Plain Text. (This is the step everyone forgets. Do not skip it, or your file won't work.)
Paste your copied code (Cmd + V).
Click File → Save. In the name box, type exactly index.html
If it asks about the extension, click "Use .html". Save it to your Desktop so it's easy to find.

On a Windows PC

Open Notepad (click Start and type "Notepad").
Paste your copied code (Ctrl + V).
Click File → Save As.
Where it says "Save as type," change it from "Text Documents" to "All Files." (This is the step everyone forgets. If you skip it, Windows secretly adds .txt and the file won't work.)
In the file name box, type exactly index.html and click Save. Save it to your Desktop so it's easy to find.

The file name matters: it must be index.html, all lowercase, with no extra words.

2 Drag it onto Netlify

You do not need a folder or a zip. Just the one file.

Go to app.netlify.com/drop in your browser.
Drag your index.html file from your Desktop straight onto that web page.
Wait a few seconds. A live link appears at the top, something like https://gentle-otter-12345.netlify.app.
Click "Claim site" at the top and sign in with your Google account. Free, about 20 seconds. This is what keeps your link alive permanently. Skip it and the link disappears in about an hour.
Click your link to open it in a new tab and make sure it actually works.
Paste that link into the discussion board. Done.

▶

Watch it (current, under 5 min):
How To Deploy an HTML Site to Netlify (2026)

Shows the exact drag-and-drop step. Your file-creation steps above are the Mac/PC part the video doesn't cover.

If something goes sideways

You lose zero points. Some apps just won't survive the trip out of Gemini, and that's information, not failure. If your link won't work after a real try, post a short screen recording or a screenshot plus one sentence about what your app does. That fully counts.

Quick fixes for the usual snags

Netlify says "Page not found": your file probably isn't named exactly index.html. On a PC, this usually means it saved as index.html.txt. Redo the save and set "Save as type" to "All Files."
The page is blank or broken: tell Gemini "put ALL the CSS and JavaScript inside this one HTML file, nothing external," then recopy, resave, and drag it again.
Your link vanished overnight: you skipped "Claim site." Drag the file again and claim it this time.

Optional — build an app that calls AI live

Everything above gets you a working app, but the apps above don't actually "think." This section is for when you want one that does: an app that calls an AI while it runs, generating brand-new content on the spot.

The worked example below is a "Do-Now Generator." You type a topic ("8th grade photosynthesis"), click a button, and it asks an AI to write a fresh do-now question every time. The same recipe works for anything that has to think live: an exit ticket that gives real feedback, a vocabulary-sentence maker, a random word-problem writer. We'll walk through building that Do-Now Generator from start to shareable link.

If your app is just a timer, randomizer, matcher, or game, you do not need any of this. Those don't call AI, so the main guide above is all you need.

First, why these apps break when you export them

Inside Gemini, Google quietly runs the AI for you behind a curtain, using a secret key you never see. The moment you copy the file out, the curtain is gone. Your app still tries to call the AI, but the password slot is empty, so the button just does nothing. To make it work on your own, you give it your own key. Here's how.

1. Get a free Google AI key (no credit card)

Go to aistudio.google.com and sign in with any Google account.
Click Get API key → Create API key. Copy it.
That's it. It's the free tier, no billing. Plenty for a classroom demo.

2. The safety part, in plain language

A key pasted into a public web page is visible to anyone who looks. That's fine for a class assignment as long as you:

use only a free-tier key (worst case is hitting a free rate limit, it cannot cost you money);
never paste a key that has billing turned on;
delete the key in AI Studio once the assignment is graded (Get API key → trash icon).

3. Where it will and won't run

Works best: open the file locally (double-click it) or host it on Netlify using the steps above.
Often blocked: CodePen and similar sandbox sites tend to block the AI call. Use Netlify or local instead.

4. Easiest path: let Gemini build the key-ready version

Paste this into Gemini Canvas and it will build an app that asks for your own key instead of using the hidden one:

Build a single-file HTML app for a do-now generator. It must call the Gemini REST API directly with fetch(). Do NOT use a hidden or built-in key. Instead add a visible text box where the user pastes their own Gemini API key, and use that value in the x-goog-api-key header. Use model gemini-flash-latest at https://generativelanguage.googleapis.com/v1beta/models/gemini-flash-latest:generateContent and read the reply from candidates[0].content.parts[0].text. Keep it one self-contained file with inline CSS, no build step, no external libraries.

From here it's the same as the main guide: save Gemini's single HTML file, drag it onto Netlify, and share the link. If you ever see an error mentioning “CORS,” you're on a site that blocks the call, so open the file locally or host it on Netlify and it will work.