I’m 17, practicing "Vibe Coding" with Vanilla JS, and built a pricing component for backend devs.

Hi,

I’m a backend-first developer. Every time I build a micro-SaaS with Go or Node, I run into the same wall: the logic is solid, but the frontend looks terrible. I used to spend days configuring React or fighting shadcn dependencies just to get a simple pricing section working.

So, I decided to do some "Vibe Coding." No frameworks. No heavy node_modules to break next year. Just clean Semantic HTML5, Tailwind CSS via CDN, and pure Vanilla JS.

I built a premium Dark Tech billing component. It has a smooth toggle switch (Monthly/Yearly) and interactive loading states for the buttons.

It takes less than 5 minutes to drop into any Go, Python, or PHP stack.

Here is the entire JavaScript logic for the switcher. It’s simple, light, and dependency-free:

const billingToggle = document.getElementById('billing-toggle');

const monthlyPrices = document.querySelectorAll('.price-monthly');

const yearlyPrices = document.querySelectorAll('.price-yearly');



billingToggle.addEventListener('change', () => {

    const isYearly = billingToggle.checked;

    monthlyPrices.forEach(p => p.classList.toggle('hidden', isYearly));

    yearlyPrices.forEach(p => p.classList.toggle('hidden', !isYearly));

});

I put it on Lemon Squeezy under the MIT license, so you can do whatever you want with the code.

My store is currently in Test Mode waiting for final review, but I want to get some real feedback from other indie hackers.

• 
  Link: Grab the code here
  

Let me know what you think about the code structure. Be brutal!