Integrating an In-browser Code Editor to Your Playground


We have already created our environment to write and render html, css, js code and also made it secured. Now we’ll add an in-browser code editing tool that supports syntax highlighting, indentation, themes, zen coding and tons of more cool features to help us code even better.

Continue reading “Integrating an In-browser Code Editor to Your Playground”

Using HTML5 postMessage For a Secured Cross Domain Communication and Rendering

In the previous post, we covered how easy it is to build an environment where anyone can write in HTML, CSS, JS code that gets rendered and displayed in a sandbox (iframe) in realtime. It’s all good as long as the platform is restricted to yourself, but when it becomes open, i.e., when others can create testcases or use it for some other purpose as on CSSDeck, you need to start thinking about security.

Continue reading “Using HTML5 postMessage For a Secured Cross Domain Communication and Rendering”

Creating the Environment To Write Code and Render in Realtime

After the Introduction, its time to build things! We will basically lay out a basic UI for the playground and learn how to render our code in the sandbox.

Continue reading “Creating the Environment To Write Code and Render in Realtime”

How I Created My Version of Doodle Jump in HTML5

I’ll try to take you through my process of re-creating the famous Doodle Jump (which was originally released for mobile platforms) in HTML5 from scratch. The entire write up might help you with creating your own games from scratch!

Continue reading “How I Created My Version of Doodle Jump in HTML5”

Building Your Own HTML, CSS, JS Realtime Playground

Many months ago I built this site called CSSDeck. Its an interesting app where you can write your HTML, CSS, JS code inside few code editors that gets rendered and displayed in realtime in an output area (sandbox). Similar to JSFiddle, yeh! But the intent was a bit different. Instead of aiming for a playground where people could just create testcases, I wanted to build a community of people who would create some cool creations with their CSS3 and Javascript skills and all I would do is feature them on the Home Page of the site. Whatever people submit shows up in their profile page which means they can share their profile link with anyone and show off how awesome they are.

Continue reading “Building Your Own HTML, CSS, JS Realtime Playground”

Hello world!

Hello from Yet Another Blogger! My name is Rishabh, a freelance web developer from India. I’ll use this blog to post some tips and tricks that I learn while working on various projects (personal or for clients). Some articles might also get into the details of several interesting topics, but I’ll try to keep them precise so that you can read quick, learn and get to work.

Quite excited about this!