My Attempt at a Google Forms Clone
The Coding Challenge That Led to My Google Forms Clone
This whole project started as a 48-hour coding challenge for a job interview — one that, surprisingly and thankfully, got extended to 72 hours! I was given the requirements to build a simpler version of Google Forms, so I thought — why not give it a shot? It turned out to be a wild ride — one that left me with a newfound appreciation for form builders!
Ever Wondered What It’s Like to Build Your Own Google Forms?
Well, I did. And let me tell you — it’s harder than it looks! Here’s a breakdown of my “somewhat functional, definitely not enterprise-ready” attempt at cloning one of Google’s most useful tools.
🚀 What I Built
I created a basic form builder that lets you:
✅ Create forms with different question types (text, multiple choice, and checkboxes)
✅ Drag and drop questions to reorder them (because who hasn’t messed up their question order?)
✅ Share forms with others to collect responses
✅ View all collected responses in one place
It’s not quite Google Forms, but it gets the job done — kind of.
🛠 Tech Stack
Keeping things simple, I used:
- TypeScript for type safety (because JavaScript alone is chaos)
- Plain HTML/CSS (no fancy frameworks this time!)
- localStorage for data persistence (who needs a database, anyway?)
🎯 Features That Actually Work
🏗 Drag and Drop
One of the cooler features I implemented is drag-and-drop question reordering. Each question has a little “⋮⋮” handle that you can grab to move it around. It’s not as smooth as Google Forms, but hey, it works!
❓ Question Types
I implemented three question types:
- Text: For when you want people to write stuff.
- Multiple Choice: For when you want to limit their options.
- Checkboxes: For when they can choose multiple options.
💾 Storage Solution
The project didn’t require a backend, so I had the option to use either localStorage or export data to CSV. I went with localStorage because it was quick and simple. Is it production-ready? Absolutely not. Will it lose all your data if you clear your browser cache? You bet! But for a simple demo, it does the trick.
🔗 Form Sharing
Want to share your form? Here’s a URL! Just don’t expect it to work if I haven’t deployed the project yet. 😅
🧪 Testing
I even wrote some unit tests (shocking, I know). They cover:
✅ Form creation
✅ Adding questions
✅ Form responses
✅ Storage operations
They’re basic, but hey, they exist!
🛑 What’s Missing (Future Enhancements — Something I probably won’t get time to do)
Let’s be honest — this clone is missing a lot:
- A proper backend (localStorage can only take you so far)
- Form validation (currently trusting users way too much)
- Rich text editing (hope you like plain text!)
- Image uploads (who needs those, right?)
- Advanced question types (no grid questions here!)
- Analytics & response visualization
- User authentication (forms for everyone!)
📚 Lessons Learned
- Google Forms is way more complex than it looks.
- TypeScript is your friend when managing form state.
- localStorage is not a database (I already knew this, but working on this project really drove the point home!).
- Drag-and-drop APIs are actually pretty neat.
- Writing tests is important (even for toy projects).
🎬 Conclusion
Is it a perfect Google Forms clone? Not even close. Does it work for basic form creation and response collection? Kind of! Would I use it for anything important? Absolutely not!
But hey, this was a fun project that taught me a lot about form handling, drag-and-drop interfaces, and why Google probably has entire teams dedicated to making Forms work seamlessly.
Want to check out the code? Feel free to laugh at it on GitHub! And if you’re feeling brave, maybe even contribute.
🔗 GitHub Repo: https://github.com/Sumit1993/google-forms-clone-basic-typescript
🚀 Live Demo (Vercel): https://google-forms-clone-basic-typescript.vercel.app/
Remember, sometimes the best way to appreciate a tool is to try building a worse version of it yourself!
P.S. If anyone from the Google Forms team is reading this — you all do amazing work, and I now understand why. 🙌
