

Mozilla Thimble - pathdependent
https://thimble.webmaker.org/

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

~~~
toddmorey
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.)

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

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

~~~
loganlinn
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

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

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

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

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

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

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

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

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

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

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

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

~~~
daa
Temporary glitch, sorry 'bout that!

------
swdunlop
Ah, Netscape Composer, we hardly missed you.

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

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

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

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

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

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

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

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

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

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

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

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

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

------
smagch
This is really good for coderdojo!

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

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

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

------
alexkam
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 :-)

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

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

