For a long time, I’ve wanted a simple way for my students – in this case, my adult Sunday School class participants—to share comments directly on a webpage I’ve made with Google Sites. Google Sites doesn’t include a built-in commenting system in its “new” version which debuted in 2021. Commercial commenting widgets like Elfsight can work, but I’ve wondered if there is a free option? This past week and weekend I finally built one myself for FREE using Firebase (by Google) and a LOT of “vibe coding” help from ChatGPT-5 and Google’s Gemini. The full code and setup steps are now on my GitHub, as my 7th successful vibe coding project to date: “Google Sites Firebase Comment Widget (Secure Template Version.”)
This free software solution lets anyone add password-protected comments to a Google Site (or any webpage) using a lightweight widget – just two HTML files. Student comments are stored in a secure Firestore database, and teachers (or moderators) can review and delete comments from a separate dashboard. There’s no need to pay for commercial web / server hosting to get this working. You just a free Firebase account and GitHub Pages for hosting, along with your Google Site (or other hosted website.) If you already have a paid web host, you can use it (instead of GitHub pages) for the HTML files.
I learned about Firebase last year from one of my 8th graders enrolled in my middle school Computer Programming class. He was using vibe coding (primarily with CoPilot by Microsoft) to build an interactive, cloud-based application which needed database-like storage.
As the developer setting this simple “widget embed commenting system” up, you can decide on a shared “student password” to use for posting comments, and a secret “admin password” to use for moderating / deleting comments. Comments go up live, there is not a “moderation queue,” and the commenting system DOES use a shared password… so it’s open to misuse. Use with discretion, and with a class of students you’ve prepared in advance with good digital citizenship expectations. Don’t share either password publicly online. (Just the commenting password directly with your students in class.)
I tested this live with our “ACE” adult Sunday School class, using 10 images of Kindle quotes from “How We Learn to Be Brave: Decisive Moments in Life and Faith” by Rev. Mariann Edgar Budde. Each image had / has its own embedded comment widget, so participants—both in person and online—could reflect and respond to a different quote. It worked beautifully!
This was another “vibe coding” success story for me. Over a few evenings, I worked step-by-step with ChatGPT-5 (and Gemini a little) to create, test, and document the project so others can (hopefully) recreate and use this system. If you’ve ever wanted to make a class website more interactive, I hope you’ll check it out.
Explore the full project on GitHub: google-sites-firebase-comment-widget
Learn more about AI-assisted coding on ai.wesfryer.com
On a security note: One of the things critics of “vibe coding” are quick to point out is that people who don’t really know what they are doing with web or software development can easily create insecure or even dangerous applications. This can be true. An initial iteration of this project saved both the student commenting password and the moderator / admin password “in the clear” as part of the HTML files. I pointed this out to ChatGPT, and it re-coded portions of the project so the passwords are now stored securely in the “rules” for your Firebase instance. To me this doesn’t mean vibe coding is worthless: It’s an example of how it’s important to have a working knowledge of security best-practices for websites.
One last reflection: Have you ever heard of Filemaker and Filemaker Pro? It’s still available commercially, but I haven’t used it for years. Back in 2001 – 2006, when I was the first Director of Distance Learning for the College of Education at Texas Tech University, I used Filemaker Pro and some other software tools to create web-enabled databases which gave our college, our administrators, and myself SO much power! (Shout out to Pam Tipton, our student teacher coordinator at the time!) I wrote several blog posts referencing Filemaker during those years, like this March 2006 post, “Moving from Filemaker 6 to 7 with Lasso.” Dreamweaver, Claris Homepage, CDML, moving to XML… oh the memories!
Seriously: Being able to create dynamic database-connected webpages was HUGE. I also served as the webmaster for our college at that time, and I created a variety of custom web solutions during those years including:
- Web forms students could use to apply for student teaching
- A web solution which allowed our faculty to reserve time with a “pool” of summer research assistants
- A series of web forms and webpages we used with our school districts in ESC Region 17 to connect Texas Tech graduate students to our main campus in Lubbock as well as new “Hill Country satellite campuses” in Fredericksburg and Highland Lakes, for our “iTV” (interactive tele-video) courses. Those were the days before desktop videoconferencing solutions like Zoom and mobile video like Facetime. Back then, CU-SeeMe was cutting edge!
During those years I was also able to use a free php script called “yform” to create a series of webpage to email solutions, including the first online / digital “Graduate Bio Update Form” for the US Air Force Academy’s Association of Graduates. (Yep, those where the years before the HTTPS Everywhere campaign and Firesheep.
Why am I bringing up those memories? Because although I’ve been using WordPress extensively since 2005, I have never managed to reclaim those “web powers” I had working at Texas Tech in the early 2000s, creating custom, web-enabled databases and websites.
Now, thanks to vibe coding, I’m back in the saddle again.
* AI Attribution: I used ChatGPT 5 to create an initial draft of this blog post, which I edited further before publishing. I also used ChatGPT 5 to generate both images used in this blog post. (This was an iterative process – as usual – and required multiple prompting interactions.)
Leave a Reply