Vibe Coding Learning Tools: Rapidly Curating the Classroom Experience

Teaching database systems today involves far more than traditional books and slides. On one end, students have access to mainstream IDEs, interactive software tools, and chat-based LLMs. On the other hand, providing students with customized educational tools has traditionally been resource-intensive and time-consuming: software development took resources and effort. Often, by the time these tools were designed and developed to respond to a student need, the semester had ended, limiting immediate impact. Instruction itself is highly dynamic: there are so many combinations of instructor style, student composition, and even the semester's general tone, creating several opportunities for bespoke software tooling.

As we approach finals anxiety season, students asked if there were some additional resources they could use to study for the exams. Inspired by the recent "Vibe Coding" movement and insights from our ongoing DBTutor work ("Integrating LLMs into Database Systems Education", DataEd 2024), I wanted to see how effective LLMs were at rapidly building instructional tools. In under 30 minutes, I was able to build "The CSE 3241 Game Show," where students encounter an interactive quiz interface with immediate feedback. Correct answers trigger celebratory confetti animations, while incorrect ones receive clear explanations. The focus was squarely on making test practice more fun and engaging. 

The tool was designed to be as simple as possible: a single JS/SVG/HTML page that accepted a CSV question bank file upload. I was pleasantly surprised by both the LLMs' output and how much the students engaged with the tool. Some design principles proved useful when writing my prompts:

Decoupling Content & Presentation: Separating the LLM-generated question bank (JSON) from the LLM-generated UI code was important. Logistics-wise, this removes any need for complex server-based hosting. From a pedagogical standpoint, allows the instructor to have tighter control on the content curation, accuracy reviews, and ensure alignment with what is taught in class. It also allows students to generate their own question banks, including for other classes. It also gives me the ability to push out new question banks on the fly, if I feel students need more experience in a certain topic.

Highlighting Engagement: The UI was deliberately designed to be over-the-top: database normalization isn't the most exciting topic in the world, so bright colors and animated emojis help a little. Adding a progress-bar and score creates a sense of pace through the experience. Of course, making the UI and question bank directly accessible means students can remix both to their desired interaction needs and preferences.

Hallucinations, Explanations, Critical Thinking: Of course, LLM-derived outputs will pose the risk of being inaccurate or misaligned with the syllabus, so providing disclaimers and in-classroom discussions are essential. To encourage students to think about the answers, explanations are provided, both for correct or incorrect answers .

Software for ~100: The significant advantage here is agility of ephemeral, disposable software: being able to quickly iterate through customized learning experiences based on the immediate classroom 'vibe'. These vibe-coded tools aren't textbook replacements but are more akin to spontaneous chalkboard examples in the classroom, addressing specific student needs dynamically.

Thanks to recent advancements in LLM-based code generation, rapidly developed personalized educational tooling is not just feasible , but also agile, immediate, and effective. Looking ahead, one could imagine students using similar techniques to generate personalized study aids or instructors sharing templates for common vibe-coded tools. This approach is transforming classroom responsiveness, enhancing student learning outcomes in real-time by making learning more targeted and, frankly, more fun.

Shout out to the teams behind Anthropic Claude, Claude Artifacts, and Google Gemini who've made all of this so easy to build and share with students!