Hacker News new | past | comments | ask | show | jobs | submit login
Show HN: Private front-end code playgrounds (frontendlane.github.io)
35 points by frontendlane on Sept 17, 2019 | hide | past | favorite | 16 comments

Super excited to share this small project I built over the weekend. This is a front-end code playground inspired by my recurring need to quickly test something out in a pristine environment i.e. new tab.

- Supports HTML, CSS, JavaScript - Easy to share with others 1. CMD/Control + S 2. Share the URL - Opens in an instant - Private by design (nothing is stored because there is no server) - No tracking - No account to manage

My first submission on Hacker News. Yay!

Great work! Have you found a way to compress/shorten the urls?

I built something similar[1] a while ago, but the urls are still too long for sharing without a shortener. I'm using lz-string[2].

[1] https://www.siloz.io

[2] https://github.com/pieroxy/lz-string

I like it - and I think this will be my go to.

You see I don't often need to save stuff I play with, I almost never need to share, and if I want JQuery there is a CDN, so I will take the simplicity and fast loading of your site over other playgrounds out there.

I've linked to you from "Utilities" page in the site in my profile.

For exactly same purpose I am grooming self-contained HTML Sandbox "datauri app" [0] living in my bookmarks that too retains its state in location (#hash) so is copypastable to other browsers. I like to load preview to isolated iframe and have single editor. (Not as golfed as xem's ([1]) but it's mine and I like its few extra features.)

[0] https://gist.github.com/myfonj/c8ce74bf549e19600026ce9022388... [1] http://xem.github.io/miniCodeEditor/

First off, congrats on creating something on your own, and making it to the top of HN. It's not many people that get here by doing something on their own.

I must say that for my sporadic needs, this would be still too basic. My go-to tool has been for years https://jsbin.com but it's interesting to me how other tools have been able to monetize on this category.

This is great. Not sure why the copy command doesn't succeed. I had to go in the source code to get the url.

One feature I really like to see in projects like this is the ability to break the 'result' window out in to a separate tab. Codepen does it (the 'debug' mode), but it loses the live refresh. I think Codesandbox can do it too. It makes them much more useful.

Glitch.io does live reload in a different tab

Isn't something like jsfiddle, codepen, etc... exactly the same?

Not to disminish your effort and result, but you say that you had a "recurring need", well, that need was already solved.

I like the page layout! It's a lot smarter than most code playgrounds are. It's nice to be able to see everything at a glance.

This is all well and good but isn't there a limit on the length of URLs? Or does that simply not apply to blob data links.

There is, but nowadays it is quite generous. Firefox for example by default accepts up to 64KB long bookmarks [0].

[0] via https://www.reddit.com/r/firefox/comments/b6fa95/bookmark_lo...

neat, this is my go to for something more complicated, i.e reat or even node https://codesandbox.io

Ctrl + Enter doesn't do anything. (Linux)

Fixed. Thanks for bringing it to my attention!

ctrl+s nor clicking copies anything to clipboard for me.

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact