9 ms·

Thimble – An online code editor

194 points by tbassetto 11y ago

ominous 11y ago
Using Firefox 40.0.3 I can't create a new project. Even after registering. js console says: > [Brackets Filesystem] Unknown I/O error Object { name: "EFILESYSTEMERROR", code: "EFILESYSTEMERROR", errno: 1001, message: "unknown error", stack: "e@https://mozillathimblelivepreview…" https://mozillathimblelivepreview…" }
- coldtea 11y ago
  Obviously there will be lots of bugs. But HN is not really Thimble's support forum though. That would be something like: https://support.mozilla.org/en-US/questions/new https://support.mozilla.org/en-US/questions/new
  - ominous 11y ago
    HN users usually reply to these kind of posts with their first experience using the product being shared, I was just following a trend, in case someone happened to know what this kind of error means. In particular, I saw 'EFILESYSTEMERROR' and thought maybe I set some Firefox preference too strict, and some of you could be familiar with the error. But you are right, the best way to get this fixed/understood is probably by contacting the devs/support for the product.
    - coldtea 11y ago
      Yeah, you're right, it does happen and sometimes people can help here. It just sometimes bugs me though that posts about some new product/lib etc are often sidetracked with bug reports, and oftentimes for some obscure setup ("doesn't work for me on IE6", "I have Chrome Canary and it blows", 'doesn't run in NetBSD", "doesn't work with NoScript" etc). (Then there's the evergreen: "I cannot see past the first slide of this presentation, clicking does nothing etc." ("have you tried pressing the keyboard arrows?").
  - myfonj 11y ago
    Maybe rather https://support.mozilla.org/en-US/kb/how-do-i-report-thimble-bug https://support.mozilla.org/en-US/kb/how-do-i-report-thimble...
  - TheRealPomax 11y ago
    It's a Mozilla Foundation open source project, hosted on github, so it's probably more worth looking at https://github.com/mozilla/thimble.webmaker.org https://github.com/mozilla/thimble.webmaker.org
silentOpen 11y ago
I ran across a couple of issues: * highlight to copy is broken (I assume because the source is not first-class text and they manipulate the clipboard with JS) * 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 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.
- TheRealPomax 11y ago
  Yeah I ran into that first one too. It actually works, but not via context menu. The ctrl/cmd-c keyboard shortcut works fine, but the Brackets context menu seems to not have it... The second one sounds like a pretty genuine bug, maybe worth filing over on https://github.com/mozilla/thimble.webmaker.org/issues https://github.com/mozilla/thimble.webmaker.org/issues ? Agreed that it won't be the tool that professional devs will use to "do their job", but I'm a professional dev, and I've been using it for a while now for my "just for fun" stuff, and loving it. It takes almost no time at all to do even really funky "what the hell are you even doing??" stuff like this: https://d157rqmxrxj6ey.cloudfront.net/mopaxian/817/ https://d157rqmxrxj6ey.cloudfront.net/mopaxian/817/
hliyan 11y ago
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.
mariusmg 11y ago
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.
- lostInTheWoods3 11y ago
  Shouldn't people who want to learn web development use the workflow and tools of professional web developers? And since these tools are free, I don't see the case for Thimble.
  - daxelrod 11y ago
    Installing and setting up all of those tools takes time and effort, and there usually aren't great step-by-step guides for "Here's all the tools you need and how to set them up to work together". Compare this to just logging into a website.
  - TheRealPomax 11y ago
    As a professional web dev: dude, this is what I wish I had five years ago. Categorically no: teach people using the fewest amount of tools needed to get cool shit written and working. Then, when they hit the limits (IF they hit the limits) of that single "get shit done" tool, have them branch out to the more complex stuff.
hacker_9 11y ago
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?
- klez 11y ago
  You have to put Thimble into context. It's a tool for teaching basic Web skills to people new to the field, and part of the Mozilla Learning initiative[0]. I'm not sure it's intended for actual development. [0] https://teach.mozilla.org/ https://teach.mozilla.org/ EDIT: forgot the link
trolldan 11y ago
looks just fine in firefox. ain't working in my chrome v44
- hliyan 11y ago
  I'm on Chrome 44 and it seems to work fine. Strange
- aikah 11y ago
  yep , 7 errors on chrome including > Uncaught SecurityError: Failed to read the 'localStorage' property from 'Window': Access is denied for this document. and some frame related errors.
  - TheRealPomax 11y ago
    Sounds like some extensions might be getting in the way - I'm not seeing any errors in Chrome 44 stable using the default extensions.
flannelhead 11y ago
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. Otherwise the editor seems to work very nicely. [0] https://en.wikipedia.org/wiki/Fixed_%28typeface%29 https://en.wikipedia.org/wiki/Fixed_%28typeface%29
- TheRealPomax 11y ago
  One cool thing is that this is a Mozilla project, which means it's open source, and it's even on Github: probably worth filing that over on https://github.com/mozilla/thimble.webmaker.org https://github.com/mozilla/thimble.webmaker.org
  - flannelhead 11y ago
    Done. Thanks for the reminder.
paulojreis 11y ago
I was just doing some experiments and, while writing CSS selectors, the preview pane highlighted the matched elements. Pretty cool!
- netghost 11y ago
  Yeah, I'm super impressed by the element matching both when editing HTML and CSS. Plus the autocomplete for CSS was a nice touch.
ohitsdom 11y ago
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. [0] https://googlecreativelab.github.io/coder/ https://googlecreativelab.github.io/coder/
baldfat 11y ago
Online editors are a great idea but I usually DON'T use them for the following reason. 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. 2) Work flow change. Can't use git and I do like my text editor of choice. 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. 4) My language isn't supported normally. I love syntax highlighting personally.
- TheRealPomax 11y ago
  I've been using it while they were gearing up to MVP and I can dispel some of those: 1) there is none. It's about as fast as PostMessage can pump data into an iframe, so it's _much_ faster than something like live-server, and because it watches file changes faster than something like webpack, it even seems a touch faster than webpack-hotreload (although their MVP can't do hotswapping of individual files yet) 2) fair point! I've found this great for PoC and article work. Just creatively write some code, polish it a little until it's good enough to treat as a first push for a new repo, and then export the filesystem as a zip so I can push it up to git later. That said, I _have_ already made some things of which I thought I was going to put it on git, but then just kept working on in Thimble instead because there wasn't actually any reason to put it on git: The code's already accessible because everyone can hit "remix" and I don't need to deal with gh-pages branches because the project's autohosted for free =) 3) not sure this one applies, since it's explicitly for building web content. It's an MVP atm so base html, css, javascript, fonts, etc. all work, and things like coffee script or JSX just require you to add a transformer library the way you'd do if you weren't bundling code. No complaints on that so far (might change, but I'm pretty cool with what it does right now) 4) which one? http://blog.humphd.org/thimble-and-bramble http://blog.humphd.org/thimble-and-bramble explains that this is literally just the Brackets code editor, running in the browser, and pretty much any Brackets extension will work with it, so if you can find your favourite syntax highlighter and file an issue against https://github.com/humphd/brackets https://github.com/humphd/brackets to have it added to the default set, problem solved!
cadecairos 11y ago
This post helps explain the why and how of thimble really well. Recommended read! http://blog.humphd.org/thimble-and-bramble/ http://blog.humphd.org/thimble-and-bramble/
aaaaaa11 11y ago
I don't think texteditors are supposed to hog a whole core of a quadcore cpu.
danvesma 11y ago
no safari 9 support makes dan a sad boy.
tempodox 11y ago
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. 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?
- acdha 11y ago
  Sadly, it's not anywhere on the page text but the <title> makes it clear: “for learners and educators” This makes a TON of sense for those groups where someone doesn't spend half of their class time walking people through installing and configuring apps, dealing with whatever weird system customizations they've made, etc. Every time I've helped at a tutorial, that's been a big problem with some people never getting fully up and running in time. Instead, it's “click this link” and you're actually in the class, with the ability to have pre-canned examples and starting points ready to go without also having to cover things like version control first.
  - nateabele 11y ago
    As someone who has taught JavaScript workshops in which 10% of the class wasted half the class trying to install Node & NPM just to set up a development server that could reliably serve static assets (the last thing I expected to be a problem), I can attest to the value of this. Granted, plnkr.co probably would have worked just as well, but giving everybody a consistent (and persistent, and reasonably performant) dev environment in an educational setting makes a huge difference.
  - hiou 11y ago
    The more I realize how much students struggle with setting up tooling for development, the more I start to wonder if we need to start focusing more on that instead of trying to skip it. When I first starting programming a lot of my difficulty and frustration was trying to get my free copy of Borland Turbo C++ running. Once I got a bit older and started to learn Linux and more fundamental things about operating systems, programming became a much easier because the additional tooling steps were much easier. EDIT: It's certainly possible tooling will soon become a thing of the past, but judging by the trends and past experience, I do start to wonder if it's time to expect it as a necessary evil and start to handle if head on as opposed to trying to avoid it.
rkercz 11y ago
The custom tutorial aspect of this is exactly what I need for a new intern that will be starting soon.
poseid 11y ago
nice! reminds me on a better processing IDE
- TheRealPomax 11y ago
  As one of the devs who used to work on Processing.js, this is an extremely tempting idea to try to make work =P
shabinesh 11y ago
I ended up in this when trying to signup. :/ {"statusCode":400,"error":"Bad Request","message":"\"uid\" is not allowed","validation":{"source":"query","keys":["uid"]}}
- ickwabe 11y ago
  It wold appear you must use the Login link at the top-right of https://thimble.mozilla.org/ https://thimble.mozilla.org/. That sends you to a login page with a bunch of extra parameters after the https://id.webmaker.org/login? https://id.webmaker.org/login?. e.g. https://id.webmaker.org/login?client_id=wm_id_wMvw9BSwq2A480dxr&response_type=code&state=e9baaf0a-07e0-497d-85d7-72a7eefc36&scopes=user%20email https://id.webmaker.org/login?client_id=wm_id_wMvw9BSwq2A480... If you try to login just from https://id.webmaker.org/login https://id.webmaker.org/login you will get the error you saw.
AdmiralAsshat 11y ago
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: - Work laptop (Dell workstation) - Home Windows laptop (Primarily for gaming) - Chromebook Pixel (Chrome OS / Ubuntu) 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. 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).
hmsimha 11y ago
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: - 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+'['/']') 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
- TheRealPomax 11y ago
  http://blog.humphd.org/thimble-and-bramble/ http://blog.humphd.org/thimble-and-bramble/ explains the tech behind all of it - it's literally just the Brackets editor, so virtually all shortcuts from Brackets will work in Thimble.
csharpminor 11y ago
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. 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.
_RPM 11y ago
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?
filearts 11y ago
I'm the creator of http://plnkr.co/edit/ http://plnkr.co/edit/ which is a similar (but perhaps less 'professional') online web editor. 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.
VOYD 11y ago
too bad it doesn't work.
blorenz 11y ago
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.
ErikRogneby 11y ago
pretty slick online editor. Has some nice touches.

194 points by tbassetto 11y ago

Using Firefox 40.0.3 I can't create a new project. Even after registering. js console says: > [Brackets Filesystem] Unknown I/O error Object { name: "EFILESYSTEMERROR", code: "EFILESYSTEMERROR", errno: 1001, message: "unknown error", stack: "e@https://mozillathimblelivepreview…" https://mozillathimblelivepreview…" }

coldtea 11y ago
Obviously there will be lots of bugs. But HN is not really Thimble's support forum though. That would be something like: https://support.mozilla.org/en-US/questions/new https://support.mozilla.org/en-US/questions/new
- ominous 11y ago
  HN users usually reply to these kind of posts with their first experience using the product being shared, I was just following a trend, in case someone happened to know what this kind of error means. In particular, I saw 'EFILESYSTEMERROR' and thought maybe I set some Firefox preference too strict, and some of you could be familiar with the error. But you are right, the best way to get this fixed/understood is probably by contacting the devs/support for the product.
  - coldtea 11y ago
    Yeah, you're right, it does happen and sometimes people can help here. It just sometimes bugs me though that posts about some new product/lib etc are often sidetracked with bug reports, and oftentimes for some obscure setup ("doesn't work for me on IE6", "I have Chrome Canary and it blows", 'doesn't run in NetBSD", "doesn't work with NoScript" etc). (Then there's the evergreen: "I cannot see past the first slide of this presentation, clicking does nothing etc." ("have you tried pressing the keyboard arrows?").
- myfonj 11y ago
  Maybe rather https://support.mozilla.org/en-US/kb/how-do-i-report-thimble-bug https://support.mozilla.org/en-US/kb/how-do-i-report-thimble...
- TheRealPomax 11y ago
  It's a Mozilla Foundation open source project, hosted on github, so it's probably more worth looking at https://github.com/mozilla/thimble.webmaker.org https://github.com/mozilla/thimble.webmaker.org

silentOpen 11y ago

I ran across a couple of issues: * highlight to copy is broken (I assume because the source is not first-class text and they manipulate the clipboard with JS) * 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 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.

TheRealPomax 11y ago
Yeah I ran into that first one too. It actually works, but not via context menu. The ctrl/cmd-c keyboard shortcut works fine, but the Brackets context menu seems to not have it... The second one sounds like a pretty genuine bug, maybe worth filing over on https://github.com/mozilla/thimble.webmaker.org/issues https://github.com/mozilla/thimble.webmaker.org/issues ? Agreed that it won't be the tool that professional devs will use to "do their job", but I'm a professional dev, and I've been using it for a while now for my "just for fun" stuff, and loving it. It takes almost no time at all to do even really funky "what the hell are you even doing??" stuff like this: https://d157rqmxrxj6ey.cloudfront.net/mopaxian/817/ https://d157rqmxrxj6ey.cloudfront.net/mopaxian/817/

hliyan 11y ago

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.

mariusmg 11y ago

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.

lostInTheWoods3 11y ago
Shouldn't people who want to learn web development use the workflow and tools of professional web developers? And since these tools are free, I don't see the case for Thimble.
- daxelrod 11y ago
  Installing and setting up all of those tools takes time and effort, and there usually aren't great step-by-step guides for "Here's all the tools you need and how to set them up to work together". Compare this to just logging into a website.
- TheRealPomax 11y ago
  As a professional web dev: dude, this is what I wish I had five years ago. Categorically no: teach people using the fewest amount of tools needed to get cool shit written and working. Then, when they hit the limits (IF they hit the limits) of that single "get shit done" tool, have them branch out to the more complex stuff.

hacker_9 11y ago

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?

klez 11y ago
You have to put Thimble into context. It's a tool for teaching basic Web skills to people new to the field, and part of the Mozilla Learning initiative[0]. I'm not sure it's intended for actual development. [0] https://teach.mozilla.org/ https://teach.mozilla.org/ EDIT: forgot the link

trolldan 11y ago

looks just fine in firefox. ain't working in my chrome v44

hliyan 11y ago
I'm on Chrome 44 and it seems to work fine. Strange
aikah 11y ago
yep , 7 errors on chrome including > Uncaught SecurityError: Failed to read the 'localStorage' property from 'Window': Access is denied for this document. and some frame related errors.
- TheRealPomax 11y ago
  Sounds like some extensions might be getting in the way - I'm not seeing any errors in Chrome 44 stable using the default extensions.

flannelhead 11y ago

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. Otherwise the editor seems to work very nicely. [0] https://en.wikipedia.org/wiki/Fixed_%28typeface%29 https://en.wikipedia.org/wiki/Fixed_%28typeface%29

TheRealPomax 11y ago
One cool thing is that this is a Mozilla project, which means it's open source, and it's even on Github: probably worth filing that over on https://github.com/mozilla/thimble.webmaker.org https://github.com/mozilla/thimble.webmaker.org
- flannelhead 11y ago
  Done. Thanks for the reminder.

paulojreis 11y ago

I was just doing some experiments and, while writing CSS selectors, the preview pane highlighted the matched elements. Pretty cool!

netghost 11y ago
Yeah, I'm super impressed by the element matching both when editing HTML and CSS. Plus the autocomplete for CSS was a nice touch.

ohitsdom 11y ago

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. [0] https://googlecreativelab.github.io/coder/ https://googlecreativelab.github.io/coder/

baldfat 11y ago

Online editors are a great idea but I usually DON'T use them for the following reason. 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. 2) Work flow change. Can't use git and I do like my text editor of choice. 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. 4) My language isn't supported normally. I love syntax highlighting personally.

TheRealPomax 11y ago
I've been using it while they were gearing up to MVP and I can dispel some of those: 1) there is none. It's about as fast as PostMessage can pump data into an iframe, so it's _much_ faster than something like live-server, and because it watches file changes faster than something like webpack, it even seems a touch faster than webpack-hotreload (although their MVP can't do hotswapping of individual files yet) 2) fair point! I've found this great for PoC and article work. Just creatively write some code, polish it a little until it's good enough to treat as a first push for a new repo, and then export the filesystem as a zip so I can push it up to git later. That said, I _have_ already made some things of which I thought I was going to put it on git, but then just kept working on in Thimble instead because there wasn't actually any reason to put it on git: The code's already accessible because everyone can hit "remix" and I don't need to deal with gh-pages branches because the project's autohosted for free =) 3) not sure this one applies, since it's explicitly for building web content. It's an MVP atm so base html, css, javascript, fonts, etc. all work, and things like coffee script or JSX just require you to add a transformer library the way you'd do if you weren't bundling code. No complaints on that so far (might change, but I'm pretty cool with what it does right now) 4) which one? http://blog.humphd.org/thimble-and-bramble http://blog.humphd.org/thimble-and-bramble explains that this is literally just the Brackets code editor, running in the browser, and pretty much any Brackets extension will work with it, so if you can find your favourite syntax highlighter and file an issue against https://github.com/humphd/brackets https://github.com/humphd/brackets to have it added to the default set, problem solved!

cadecairos 11y ago

This post helps explain the why and how of thimble really well. Recommended read! http://blog.humphd.org/thimble-and-bramble/ http://blog.humphd.org/thimble-and-bramble/

aaaaaa11 11y ago

I don't think texteditors are supposed to hog a whole core of a quadcore cpu.

danvesma 11y ago

no safari 9 support makes dan a sad boy.

tempodox 11y ago

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. 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?

acdha 11y ago
Sadly, it's not anywhere on the page text but the <title> makes it clear: “for learners and educators” This makes a TON of sense for those groups where someone doesn't spend half of their class time walking people through installing and configuring apps, dealing with whatever weird system customizations they've made, etc. Every time I've helped at a tutorial, that's been a big problem with some people never getting fully up and running in time. Instead, it's “click this link” and you're actually in the class, with the ability to have pre-canned examples and starting points ready to go without also having to cover things like version control first.
- nateabele 11y ago
  As someone who has taught JavaScript workshops in which 10% of the class wasted half the class trying to install Node & NPM just to set up a development server that could reliably serve static assets (the last thing I expected to be a problem), I can attest to the value of this. Granted, plnkr.co probably would have worked just as well, but giving everybody a consistent (and persistent, and reasonably performant) dev environment in an educational setting makes a huge difference.
- hiou 11y ago
  The more I realize how much students struggle with setting up tooling for development, the more I start to wonder if we need to start focusing more on that instead of trying to skip it. When I first starting programming a lot of my difficulty and frustration was trying to get my free copy of Borland Turbo C++ running. Once I got a bit older and started to learn Linux and more fundamental things about operating systems, programming became a much easier because the additional tooling steps were much easier. EDIT: It's certainly possible tooling will soon become a thing of the past, but judging by the trends and past experience, I do start to wonder if it's time to expect it as a necessary evil and start to handle if head on as opposed to trying to avoid it.

rkercz 11y ago

The custom tutorial aspect of this is exactly what I need for a new intern that will be starting soon.

poseid 11y ago

nice! reminds me on a better processing IDE

TheRealPomax 11y ago
As one of the devs who used to work on Processing.js, this is an extremely tempting idea to try to make work =P

shabinesh 11y ago

I ended up in this when trying to signup. :/ {"statusCode":400,"error":"Bad Request","message":"\"uid\" is not allowed","validation":{"source":"query","keys":["uid"]}}

ickwabe 11y ago
It wold appear you must use the Login link at the top-right of https://thimble.mozilla.org/ https://thimble.mozilla.org/. That sends you to a login page with a bunch of extra parameters after the https://id.webmaker.org/login? https://id.webmaker.org/login?. e.g. https://id.webmaker.org/login?client_id=wm_id_wMvw9BSwq2A480dxr&response_type=code&state=e9baaf0a-07e0-497d-85d7-72a7eefc36&scopes=user%20email https://id.webmaker.org/login?client_id=wm_id_wMvw9BSwq2A480... If you try to login just from https://id.webmaker.org/login https://id.webmaker.org/login you will get the error you saw.

AdmiralAsshat 11y ago

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: - Work laptop (Dell workstation) - Home Windows laptop (Primarily for gaming) - Chromebook Pixel (Chrome OS / Ubuntu) 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. 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).

hmsimha 11y ago

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: - 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+'['/']') 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

TheRealPomax 11y ago
http://blog.humphd.org/thimble-and-bramble/ http://blog.humphd.org/thimble-and-bramble/ explains the tech behind all of it - it's literally just the Brackets editor, so virtually all shortcuts from Brackets will work in Thimble.

csharpminor 11y ago

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. 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.

_RPM 11y ago

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?

filearts 11y ago

I'm the creator of http://plnkr.co/edit/ http://plnkr.co/edit/ which is a similar (but perhaps less 'professional') online web editor. 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.

VOYD 11y ago

too bad it doesn't work.

blorenz 11y ago

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.

ErikRogneby 11y ago

pretty slick online editor. Has some nice touches.