Mozilla Thimble | Hacker News Reader

Mozilla Thimble

thimble.webmaker.org

189 pointspathdependent49 comments

To developers complaining that this is not an IDE they'd actually use: where did you get the idea that this tool is meant to be an IDE for professionals? This is clearly an educational tool, and I think it looks pretty good for that.

0. pick text editor 1. install text editor 2. find some sample html 3. open file in your browser 4. find some resources for learning HTML & CSS (yep, w3schools) 5. learn that validators exist 6. learn that linters exist etc. etc.

With mozilla thimble: 1. click to start new project 2. try stuff (instant feedback), learn about code validation (instant feedback), share your page etc. 3. level up to more robust environment.

Right, this is a great educational tool, especially because of its instant feedback feature. Isn't it one of the founding features of Light Table? It makes learning/implementing so much more faster. And so even if one knows HTML/CSS, this will be a great tool for making simple web pages.

They are being hurt by their own branding. It shouldn't be positioned as a way to create web pages, just like Code Academy isn't positioned as a way to create javascript. They are both ways to learn with instant feedback and solid instructions. (The instructions are in the app for Code Academy and in the HTML comments for Thimble.)

For non-tech users it is a tool to create web pages, though. They will go to that more easily.

For the tech users they know it's not an IDE and not meant to be. Anyone claiming the opposite is a troll/likes to bash Mozilla (cause it's trendy in case you haven't noticed) and so on.

And in case you dare to argue my point: if you're talking about an IDE guess what? Well, you already did. You're a tech user.

The first thing I noticed was that the font of the editor is not monospaced... too bad.

my first thought exactly. Why would they build a texteditor with a proportional font? It looks horrible.

Look's like its a CSS cascade issue. They're setting '.CodeMirror' to have a monospaced font, but it's getting overridden in (several) other palaces

Thx, we'll see if we can find a good monospaced font. Although IMO it's not as important in html as in other languages, for some reason.

I like the proportional font better, anyway. It's still plenty easy enough to notice the punctuation, and this way, the words look nicer. And there are plenty of words - each project has lots of comments and sample text.

This looks like a fantastic tool to use for introduction to front end development. The inline tool tips / tag definitions are very useful if you aren't sure what a particular tag does.

> Thimble makes it ridiculously simple to create your own web pages.

Ridiculously simple way would be to edit straight inside the page.

Why contentEditable-based in-place editing is still missing in so many blog and website engines?

Navigating between html editor and preview feels a bit wrong and old when targeting regular users.

I'm not saying that only Thimble is the "old and wrong". I've been wondering about the same issue also with wordpress, drupal, joomla etc.

The goal is not just to create web pages but to teach people about the technologies that drives the web (the tool many nonprogrammers use day in and day out). A straight wysiwyg wouldn't achieve that end.

Neat -- poking around in the console, it looks like Webmaker is using Backbone.js ... I was wondering if anyone from the Webmaker team could tell us what exactly it's using it for?

I haven't had a chance to dive into it, but the source is at https://github.com/mozilla/webpagemaker

This feels like they're a bit confused about which target audience and abstraction layer they're aiming to. This is like trying to get more kids to program by trying to show them how easy and fun assembly language is. Shouldn't your energy be better spent developing, promoting and educating the use of higher level tools? It's hard for me to think of an use case for this. What kind of people, exactly would this help?

Don't get me wrong. I'm all for teaching more people to code. More importantly, getting more people to build stuff. But trying to teach newcomers to something historically bloated like HTML, sounds discouraging. Many others said before, HTML, CSS, JavaScript are pretty much the Machine Language of the web. It made sense for us to learn those first when it was all we had. But moved forward, it seems more intelligent to get more people to build stuff by having them use higher abstraction layers first. Even more, try to develop even higher layers that'll enable even more people to contribute.

I love Mozilla and I love the initiative. But I don't honestly think this will help much.

Plain old HTML is a fundamental building block of the web. It was designed to be, and still succeeds in being, a simple to learn tool to create documents for consumption by web browsers.

Sure, it has added complexity over the years, but you don't need to know every tag & attribute or CSS & Javascript to get started and see results immediately.

> and still succeeds in being,

The BOK for HTML5 is larger than what professionals have time for, and is definitely a deeper delve than HTML4.

> This is like trying to get more kids to program by trying to show them how easy and fun assembly language is.

Doesn't this way make sense if you are a manufacturer of microcontrollers, for example?

Of course, this is why I said it seems they're confused about their target. Their website and learning method seems designed for kids with zero technical knowledge. But the content material seems designed for manufacturers of microcontrollers. Who is this for? Something doesn't match.

I wish people who have written HTML for years would play around with this if for no other reason then to learn what all the new semantics of HTML5 are.

What are you actually suggesting here? What is the "higher abstraction layer" you think people should be learning instead?

You know, I waited too long for the right higher level layer or even outright replacement for html/javascript to come along and rise in popularity. Now I wish I'd just dived in to plain html/javascript earlier and become adept with them just as they were. A lot of "higher level" layers have come and gone, while javascript and html are still with us, and getting stronger all the time. What's more even with a higher level layer above them, you're going to have to know them anyway, to use them in real projects.

Anyone else getting a 500 error? Looks like they are having some server issues at the moment

I received a javascript alert that an error has occurred. I'm using Chrome. I can see the editor but not the template/project I chose.

Yah, we suffered some issues on the cluster which caused temporary failures. Sorry 'bout that!

Yeah, still not loading for me.

am I the only one seeing this? https://thimble.webmaker.org/en-US/editor

Internal Server Error

The server encountered an internal error or misconfiguration and was unable to complete your request.

Please contact the server administrator, webmaster@mozilla.com and inform them of the time the error occurred, and anything you might have done that may have caused the error.

More information about this error may be available in the server error log.

I am not getting that message.

Temporary glitch, sorry 'bout that!

Ah, Netscape Composer, we hardly missed you.

It complains about perfectly valid HTML, e.g.:

  <ul>
    <li>Item
    <li>Item
  </ul>

Why doesn't it know about optional end tags? :(

Even though I also enjoy not closing my li's, I don't think this is an egregious error. The app appears to be focused on helping novices interested in learning HTML. To those just beginning, it's probably most important to enforce the idea of most elements having opening and closing tags.

However, if their target audience is actual developers...well, they've got lots of other problems to deal with as well.

The target audience is very much _NOT_ real developers. Think of it as "lesson 2", where "lesson 1" is something like x-ray goggles: https://webmaker.org/en-US/tools/x-ray-goggles/ for someone who _knows nothing_ to start with. Your average (not geeky) 12-year old or 70-year old, for example.

I'm a computer science graduate (aka, I hope I'm a geek) who did the whole html / css track at Code Academy in about 3 hours (aka, hopefully I'm past lesson 0, I haven't taken any web dev classes or some such ever) but trying to keep all the possible tags in my brain at once is still hard. I feel like this kind of tool does nothing if the newbie doesn't know the tags to match the ideas they have for the page.

Horrible. No code completion. No separation of css and js. I pretended I don't know anything and got to the point where I had no idea what to do next pretty quick and zoned out.

I literally shudder at the thought of editing code from within a browser. That said, it does seem useful for introducing html.

Any reason why this is using CodeMirror and not Ace, the successor to Mozilla's own in-browser code editor?

IMO this sort of thing is primitive after seeing easel.io last week.

I suppose I would have liked this when I was first learning, if just for the error messages. But I think, like any programming, part of the learning is running/viewing your program and figuring out why the output isn't what you expected. Maybe each error pointing to w3schools for more information would benefit the user.

w3schools is not the place to point. are you a web developer? I haven't seen a legitimate developer, even an amateur, suggest w3schools is anything but crap in the last few years.

"ridiculously simple" - Advertising copy like this just grates now. "Stunningly Beautiful". Meh.

It seems to me more like a jsbin.com/jsfiddle.com clone than a real Web IDE.

The editor is helpful though, specially for novices. The syntax highlight is very different from what you're used to. Although I find it a little too much intrusive it makes it very easy to spot small typos.

This is really good for coderdojo!

anyone notice that the screenshot on the landing page is taken with firefox 2 on mac?

looking for reasons to use this. Other than educational purposes? And where are the pages hosted? This is basically for one off displays of random content?

It's primarily for educational purposes, indeed. The pages are hosted on Mozilla servers.

Looks like javascript is not allowed here. If so - what is the purpose of all this? Does anyone still make pages which have zero javascript?

But the html editor is a really nice one :-)

Javascript is not an essential part of web development. This tool is geared towards web pages rather than applications, where client-side scripting might play a bigger role.

Unfortunately (and with some good reason) there are still many people who use NoScript et al to browse the web without javascript.

>> Javascript is not an essential part of web development.

This is a very strong statement and I probably disagree. I am not talking about client-side applications here, but all those Google Analytics snippets, Facebook Like buttons, Discus comments etc. The script block essentially became a standard way to include third party functionality into the web page. And without it this tool is less useful than it could be.

Right -- we'll be adding JS support in a later release. That can be lesson 4 (where 1. is "what's HTML", 2. is "what does HMTL look like", ...)

Reply on news.ycombinator.com