1
0 Comments

Made a Html5 only "Code Play" Feature

Hello Lovely IndieHackers,

For our product landing page I've built the linked HTML5 "code play" component:

https://codepen.io/cg_bloc/pen/MWRPEwb

We wanted to demonstrate how effortlessly our product can be integrated into any webpage with just a few simple lines of code. We chose not to create and reference a video because:

  • it isn't desktop/mobile/tablet/... responsive
  • adds a significant data payload and delay to the page
  • would consume a lot of our time with each new iteration until it reached a final presentable state.
  • adds bandwidth cost to our provider line

Instead, I created a straightforward "code play" component that is easy to adapt, extend, and style. It can be seamlessly matched to any site's responsiveness.

I'm wondering if the IndieHacker community would be interested in a generator to create such visuals on the fly, complete with copy-paste code. If there's enough interest, I would create a basic github pages app and release all the source code as open source, so anyone can contribute.

Cheers!

on April 18, 2024
Trending on Indie Hackers
Your build-in-public audience is not your market. I learned the difference the slow way. User Avatar 197 comments I built a WhatsApp AI bot for doctors in Peru — launched 3 weeks ago, 0 paying customers, and stuck waiting for Meta to approve my app User Avatar 62 comments Built a "stocks as football cards" thing. 5 days in, my launch tweet got 7 views. What am I missing? User Avatar 33 comments From broke and burned out as a PM, to launching my SaaS and optimizing my health User Avatar 32 comments Why Claude Skills Are Becoming Important for Tech Careers User Avatar 24 comments I kept starting projects and dropping them. So I built a system that wouldn’t let me User Avatar 23 comments