Editing code in the browser may make limited sense if the code is going to run in that same browser. However, why I would want to edit “on the web”, losing all my local utilities and more, escapes me.<p>This “do EVERYTHING in your browser” fad has gone far enough. We have the most powerful desktop gear ever but every blinking of the cursor has to be done by a remote service?
This post helps explain the why and how of thimble really well. Recommended read!<p><a href="http://blog.humphd.org/thimble-and-bramble/" rel="nofollow">http://blog.humphd.org/thimble-and-bramble/</a>
Auto-update preview on edit, preview highlight of elements selected in code, desktop/mobile preview, all seem to work well. No other options, bells or whistles. I like the fact it does one thing well.
I just tried out some of my favorite shortcuts I know from Sublime (I'm not saying Sublime invented these, just that I only came to know them through using it) and found them all to work:<p><pre><code> - Move lines up/down with ctrl+shift+up/down
- Cut an entire line (ctrl+x)
- Multiple cursors (ctrl+alt+up/down)
- Comment the current line/selection (ctrl+'/')
- Delete the current line (shift+delete)
- Indent/dedent the current line/selection (ctrl+'['/']')
</code></pre>
Still looking for the bindings to jump to matching braces/parens and to select the innermost block, but I'm sold. I'll be using this
I used Coder for Raspberry Pi [0] when teaching my eight year old nephew how to code and it worked very well. This seems like an easier-to-setup substitute, well done! Can't have enough tools like this for those learning.<p>[0] <a href="https://googlecreativelab.github.io/coder/" rel="nofollow">https://googlecreativelab.github.io/coder/</a>
I can see this being useful if I want to work on some little projects from various locations. My current list of "active" computers are the following:<p>- Work laptop (Dell workstation)<p>- Home Windows laptop (Primarily for gaming)<p>- Chromebook Pixel (Chrome OS / Ubuntu)<p>And of course, each one has its own editor that I use while I'm on them due to the varying OS's--Notepad++ on the Windows laptops, Caret when I'm in ChromeOS, SublimeText when I'm on the Ubuntu partition.<p>Assuming I just want to work on some small educational projects that don't involve committing to my Github, being able to simply pull up an IDE in the browser and just start coding away could be useful, particularly while I'm at work. Work usually seems to be where I get most of my sudden cravings to start learning new things anyway (probably because my day job is so repetitive).
Online editors are a great idea but I usually DON'T use them for the following reason.<p>1) Lag. I hate it when I type and I see any kind of lag. After decades of quick response on typing anything out of a few ms makes me think something is wrong with my computer.<p>2) Work flow change. Can't use git and I do like my text editor of choice.<p>3) I can't write a script to do things to files like I can locally. I love scripting dumb task and use whatever language I use.<p>4) My language isn't supported normally. I love syntax highlighting personally.
Education is a fantastic application for this - there are lots of nice touches, like highlighting elements of the DOM in the preview window when you click on them in the editor. The code completion also pops up lots of options for tags and attributes which could make exploring a lot easier for young students.<p>I'm also excited to use it for doing technical interviews with front-end devs. Curious to see how it stacks up with Codepen, JSFiddle, etc.
Looks amazing for people who want to learn web development. Text editor (with dark theme) , preview , list of files and help builtin all in the same window.
I ended up in this when trying to signup. :/<p>{"statusCode":400,"error":"Bad Request","message":"\"uid\" is not allowed","validation":{"source":"query","keys":["uid"]}}
I'm the creator of <a href="http://plnkr.co/edit/" rel="nofollow">http://plnkr.co/edit/</a> which is a similar (but perhaps less 'professional') online web editor.<p>One thing that I find interesting is that Mozilla has decided that browsers have moved forward far enough that hosting the preview via `blob:` urls. I've experimented with a similar approach but had issues where different 3rd party libraries die unexpectedly when they are not dealing with http / https.
Funny how the X11 "Fixed" bitmap font [0] is chosen as the default font on my system. This appears to be caused by 'fixed' being set as a fallback font instead of 'monospace', which, on most systems, is an alias for the default monospace font which is usually an antialiased one.<p>Otherwise the editor seems to work very nicely.<p>[0] <a href="https://en.wikipedia.org/wiki/Fixed_%28typeface%29" rel="nofollow">https://en.wikipedia.org/wiki/Fixed_%28typeface%29</a>
I ran across a couple of issues:<p>* highlight to copy is broken (I assume because the source is not first-class text and they manipulate the clipboard with JS)<p>* failing to close the last list item in a ul causes the preview window to stop updating and highlights the next line in the editor but doesn't provide any indication of what is wrong<p>This is definitely not going to be sufficient for professional programming or web development but it looks and performs far better than similar projects I've seen in the past.
Looks interesting but I wonder how it fares with more complex websites? The changes he made in the video amounted to editing static tags and css colours to see realtime changes - but what if a javascript function is used to add elements on page startup? Or a js library is used to load a twitter feed?
This reminds me of an online code editor at this clothing store shop solution that allowed people to easily make shopping carts and customize it to an extent. Does anyone remember what they were called?
This is pretty awesome though I would like to see the ability to pull in JS and CSS libraries and frameworks into a project. This could gear some tutorials around certain technologies.