Hello everyone 👋 Happy to share my article for Clerk Hashnode hackathon submission.
The word "Vaathi" refers to "Master" or "Teacher" in Tamil. So It's meant as "Master Coding".
Vaathi Coding is a platform to learn python using bite-sized programming challenges. This application went from zero to production in literally less than 48 hours of work. So please pour in all your feature requests and suggestions. I would love to hear them.
I asked myself, Why not build something for fun? I was always wondered what it is to like building something like Hacker Rank or LeetCode. Of all the things that's going on in my life, I wanted to do something that turns all my negative vibes into some thing positive vibes. Thus, I chose to participate in the hackathon.
The Plan and The hack
The initial plan is have an UI and Separate python backend server and execute all user entered code in backend in a sandboxed mode. But, I did not have enough time to research and build this setup. So I wanted to hack this problem, And I found web assembly right on time. Web assembly, lets you run python or any other supported program right inside our browser. For code editor, I've used monaco code editor. The editor that powers Visual Studio Code. And Next.js as react framework.
- Material UI
- Monaco Editor
- Clerk for auth
- Vercel for automated deployments(preview and production)
- Deepsource for automated code reviews
Since I chose to build something for the hackathon in the last moment I didn't have enough time to develop signup and signin pages, setup forms, validations, setup google signin process, etc. The documentation was so good and with the intutive UI I did implement all of that in less than 15 minutes of time. It was amazing experience. The best part is, If I you want to customise the page, clerk provides options and sdk to customize it.
Clerk Auth for professionals with tight deadlines!!!
This application has the potential to become a micro product, whatever built in this short span is just a part of a bigger plan. Whats for the future,
- Collections / Learning Track
- Multi step exercises
- Interactive course builder
- Leaderboard and gamification
Project Link -> vaathi-coding.vercel.app
Github -> github.com/sureshdsk/vaathi-coding
Stay tuned for upcoming articles. Subscribe to the newsletter and Connect with me on twitter to get my future articles.
Did you find this article valuable?
Support Suresh Kumar by becoming a sponsor. Any amount is appreciated!