DEV Community

Cover image for I built an online code editor

I built an online code editor

Chris McCormick on June 28, 2020

https://slingcode.net/ I built a web based IDE with live-reloading which you can use to make, run, and share web apps. I made it for my kids s...
Collapse
 
nastyox1 profile image
nastyox • Edited

Nice! One of the first full-stack projects I did was similar to this. I always thought detecting infinite loops before running the code to prevent the webpage from stalling would be a good feature, though maybe hard to robustly implement. What happens when the localStorage runs out of memory?

Collapse
 
chr15m profile image
Chris McCormick

Thanks! Slingcode uses IndexDb to store apps which has more space than localStorage. At the moment there is no warning if storage is full but there is a note in the code to implement something sensible in the future like warning the user.

Detecting infinite loops sounds tricky. You may be intersted in the halting problem.

Collapse
 
miketalbot profile image
Mike Talbot ⭐

What a wonderful thing that is... Can see me getting my daughter using that. Does it/could it work with babel in the browser to support ES6?

Collapse
 
chr15m profile image
Chris McCormick

I just tested this and it works by the way. I followed the instructions on Add React to a Website with the Slingcode editor and it worked perfectly translating JSX etc. I made a video of it which you can see here:

Collapse
 
miketalbot profile image
Mike Talbot ⭐

That is very very cool :)

Collapse
 
chr15m profile image
Chris McCormick

Yes, I beleive it's possible to get babel running from a script tag. Will be slower I think. I should add an example for doing this, thanks for the idea!

Collapse
 
redeving profile image
Kelvin Thompson

Brilliant! And the QR code aspect is great! Thank you. Already on my phone ... Better than anything else I've used on the phone. Respect. Cheers!

Collapse
 
timebandit profile image
Imran Nazir

Really nice. Does the send/receive section using web sockets?

Collapse
 
chr15m profile image
Chris McCormick

It uses WebRTC (peer-to-peer) via the WebTorrent library.

Collapse
 
manishfoodtechs profile image
manish srivastava

Awesome 👍.

Collapse
 
kailyons profile image
Loralighte

Nice!

Collapse
 
alphaolomi profile image
Alpha Olomi

Awesome!!!

Collapse
 
sumitkolhe profile image
Sumit Kolhe

Awesome work