[Go Make Things] Building a code sandbox

By rahmat hidayat

Thursday, December 5, 2024

​ Over the last few weeks, I've been adding a code sandbox to all of the tutorials, courses, and tools on the Lean Web Club. If you're unfamiliar with what a "code sandbox" is, it's a live in-browser editor where the user can modify the HTML, CSS, and JavaScript, and see their changes run in real-time in an isolated iframe. Its a great way to experiment with what you're learning before you try to apply it to a real project. There are a lot of third-party options (CodePen, SandPack), but I built my own lightweight standalone Web Component. Today, the source code is open sourced and free to use in the Lean Web Club toolkit collection. And yesterday, I hopped on YouTube to walk through how I built it and how it works. If you're not a Lean Web Club member, you can also find the source code in the description on the YouTube video, though I won't be keeping that one updated. Enjoy! Cheers, Chris ​ Want to share this with others or read it later? View it in a browser.​ ​

Did someone forward this to you? Get Daily Developer Tips.

Don't want to get these emails? Totally cool. Update your subscriber preferences.

You can also unsubscribe from all emails from me, including updates to products you've purchased.

113 Cherry St #92768, Seattle, WA 98104-2205

Share :

Facebook Twitter Google+