Vibe coding for teachers and students: lessons and homework as links
Teachers make lessons with AI and share them as links; students hand in working websites. No coding agent needed. Classroom prompts and a 5-point rubric.
Many teachers already use ChatGPT or Claude to make teaching materials: a neat HTML file with an exercise, a vocabulary game or a simulated experiment. Then comes the question of how students will open it. A file shared in the class chat sometimes will not open on a phone, or opens with a broken layout. Students who build projects with AI hand in ZIP files that the teacher has to unpack and open one by one.
This article suggests a simpler way: turn every piece of work into a link. Teachers make materials with AI and put them online so students can open them on their phones straight away; students build their work with AI and hand it in as a working website. It includes classroom prompts and a marking rubric you can use as it is.
In short
🍎 An HTML file made by AI can go online without a coding agent: upload a ZIP or paste from a chat AI
🍎 A teacher can keep every lesson in one project, one folder per lesson, such as/lesson-1/
🍎 A static site (plain HTML, CSS and JavaScript) never sleeps and opens instantly every time
🍎 Students hand in a link; the teacher checks it on a phone, no unzipping
🍎 Under the terms of service, users under 18 need a parent's consent
Why a link
- Opens on any device: phones, tablets and computers, nothing to install
- Fixes reach everyone at once: correct a typo, release again, and the link stays the same
- Easy to share: post it in the class group, print a QR code for the classroom wall, or add it to the school's assignment system
- Students make something real: not a file only the teacher opens, but a site classmates and parents can visit
Three ways to put work online
- Upload a ZIP: the whole folder, up to 256 MB, on the Upload & go live page
- Paste from a chat AI: the same page gives you a ready-made message to paste into your chat (ChatGPT, Claude, Gemini); the AI answers with every file, and you paste its whole answer back
- Hand the link and token to an AI coding agent on a computer (Claude Code, Codex, Cursor, Windsurf), for bigger work such as a database that keeps scores
Ways 1 and 2 are still being tested (they carry a BETA label); if you get stuck, press Talk to the team on the same page. Do the release step on a computer — releasing from a phone is not stable yet.
For teachers: a lesson site for your subject
Step 1: One project per subject
Sign up (verified with a mobile number) and create a project. Give the site an easy name such as sci-m2; students will open https://sci-m2.host.brewinth.net. The Free package has one project, so keep every lesson in it.
Step 2: Ask the AI for one lesson at a time
Make a teaching web page for Year 8 science on "Forces and motion".
- Plain HTML, CSS and JavaScript; no server and no database
- Works well on phones, large readable text
- Three short sections, each with an illustration drawn in SVG
- A simulation: sliders for force and mass, and the acceleration changes as they move
- A 10-question exercise at the end, checked instantly in the browser, with explained answers
- Do not collect students' names or any personal data
Put the files in a folder called "lesson-3", with index.html as its main page.Step 3: Let the folders be the contents page
Keep an index.html at the top as the contents page, and put each lesson in its own folder with an index.html. The platform opens the folder's page when someone visits an address like /lesson-3/, so you can send a link straight to the lesson you need. For a new lesson, ask the AI to add a folder and a line to the contents page, then release into the same project again.
Step 4: Share it with your students
Copy the link from the top of the project page and post it in the class group, or turn it into a QR code with any QR generator you like. A plain-HTML site like this never sleeps: it loads straight away whenever a student opens it.
One caution: do not put large video files on the site. The Free package has 20 MB of file space and 1 GB of bandwidth a month. Upload videos to YouTube and embed them in the page instead.
For students: hand in a link
Each student signs up with their own account and mobile number (under 18 needs a parent's consent), creates a project, works with AI and releases the site in one of the ways above. Then they hand in two things:
- The website link, working
- A short work log: what they asked the AI, what they changed themselves, and which problems they met
A starting prompt for group work:
Help us build a website for our social studies project, "Important places in our province".
- Plain HTML, CSS and JavaScript, works well on phones
- The home page has a picture map (drawn by you, no copyrighted images); clicking a spot shows its details
- Five places, using text we wrote ourselves, which we will send in the next message
- A "Made by" page with each member's nickname and role, no phone numbers or addresses
- Every time you change something, explain briefly what you changed, for our work logThe last line matters: students learn what the AI actually did instead of only copying its output.
A marking rubric you can use as it is
- It really opens on a phone and a computer; buttons work, no blank pages
- It does everything the task asked: every page and function
- The content is correct: facts checked, not text the AI made up without a source
- The work log says where AI was used, what they changed themselves and which problems they solved
- It is safe: no one else's phone number, address or photo without permission
Weight the points to suit the subject: a computing class may weigh points 1-2 more, other subjects points 3-4.
Want to show the work to others?
BrewInTH has a portal (portal.brewinth.com) that gathers websites, games and tools built with AI. When creating a project there is an option, List this site on the brewInTH portal — free promotion, switched on by default. A site appears on the portal only after the team approves it. For class work that should stay within the class, switch it off when creating the project, or later in the Portal tab.
FAQ
Do teachers need to know how to code?
No. Tell the AI clearly what you want, then put the files online by uploading a ZIP or pasting the code. Your job is to check the content is correct before sharing it.
Is it free?
Yes. The Free package has one project, 20 MB of file space and 1 GB of bandwidth a month — enough for many HTML lessons. For more projects, Starter at ฿99/month has two, and Maker at ฿1,499/year has five.
Can students share the teacher's account?
Not recommended. Each student should have their own account (verified with a mobile number): the work is theirs, and nobody shares passwords.
Can I keep students' exercise scores?
Yes, but that needs a database and sign-in — a bigger job that involves students' personal data. For practice, checking answers in the browser without storing anything is simpler and safer. If you really need to store scores, see the article on surveys and quizzes.
Do I need to send a new link after editing a lesson?
No. Release the new files into the same project; the old link shows the new version as soon as students refresh the page.
Summary
Turn every piece of classroom work into a link: teachers make materials with AI and keep them in one project with a folder per lesson; students build their work and hand it in as a link with a work log. Plain HTML files go online by uploading a ZIP or pasting from a chat AI, with no coding agent needed, and such a site never sleeps — it opens instantly every time.
Start your first project for free →