
Ellie – An Elm Live Editor - bpierre
https://www.humblespark.com/ellie-announcement/
======
napsterbr
Nice! (Still wouldn't trade it for my favorite editor + hot reload, but this
kind of app help people get on board)

Elm made me enjoy frontend development again. Can't recommend it enough.

------
scarhill
Clicking the About button I see:

"All content created with Ellie is released in the public domain (CC0)."

Are they claiming that any program written with Ellie is in the public domain?

(edit) I've emailed to ask their intent. I'll post an update if I get a reply.

~~~
scarhill
Evidently their intention is that if you write a program with Ellie and save
it it is in the public domain. According to my correspondent, they may switch
to releasing edited code with the MIT license.

I let him know that those terms would make me very reluctant to use Ellie for
anything, even open source code, since the ability to apply an open source
license requires that I have a copyright. I suggested that they putting a very
visible statement of what they're doing on the page.

------
innocentoldguy
Ellie has been quite helpful in my efforts to convert my company to Elm, so
many thanks to its creators.

~~~
lukewestby
Wow, that's awesome! Can you expand on this a little either here or at ellie-
app@humblespark.com? I'd love to hear how this helped.

~~~
innocentoldguy
Sure, I'll write something up this weekend.

------
drdaeman
Just tried Elm yesterday (not using this editor, though). Neat and simple.

But I found the documentation to be of a really low quality, and I believe
good docs are the most important thing for any language aiming for developers'
adoption.

At least the docs on elm-lang.org weren't any good - maybe there's some
alternative projects out there?

let rant_ = [

I just wanted to have a thin non-breakable space (U+202F) and haven't found
anything about actual syntax in the "syntax" document, nor anywhere around
that. Syntax docs is just a bunch of examples with a short notes - a quick
cheatsheet at best.

Then I wanted to browse Html package contents and see what's the difference
between beginnerProgram and program and what else do they have in stock (with
Haskell I always had good idea of module's contents by reading docs on
Hackage), but the docstrings were nearly meaningless, not even listing the
arguments. "Read about The Elm Architecture", really? I just came from that
document (and they only cover beginnerProgram basics), hoping a module docs
would give me better idea.

] in sorryAbout rant_ -- I had eventually figured it all out, but was quite
disappointed.

------
jnbiche
Cool, now if there were Vim bindings, I could really use it for something fun
(don't have the patience to use arrow keys + mouse). Even crude bindings
covering the basic Vi command. Anyone know what are they using for the text
editor? If it's something like CodeMirror, adding Vi bindings is pretty
trivial.

~~~
lukewestby
It is codemirror! We'll put this on the roadmap.

~~~
jnbiche
Thank you!

------
xixixao
Try to make a type error. Beautiful.

Format seems to be in Alpha, doesn't limit line length?

It's tricky with Elm because it's written in Haskell, so compilation etc.
takes long time in the browser, but this is quite nice. Should definitely push
to replace /try with this.

------
rmb81
This is beautiful. I'm sure it'll make picking up Elm much easier. Good job!

------
zachrose
By "live" is the intention that the program will recompile without losing the
state of the running app? I remember seeing a cool Elm demo of that, but it
seems like Ellie requires recompilation.

~~~
gregpardo
My thoughts exactly. Title is misleading. If I have to click compile or hot
reload it's not really a live editor. You can't change values and watch them
update on the fly.

~~~
lukewestby
¯\\_(ツ)_/¯ idk it's just a neat name. the env is more "live" than downloading
the platform, setting up an editor and running the compiler and package
manager from the terminal. i mean, is the name elm misleading because it's not
a programming language for trees?

~~~
zachrose
Essentially just asking if my browser was running it correctly :)

------
ShaneWilton
This is incredibly cool! I'm running an Elm workshop for my coworkers next
week, and this will provide a much better experience than having them install
everything locally.

------
sdroadie
Seems really well-suited towards teaching functional programming.

------
mrcactu5
it's a little bit pink for my taste. There's a way to change the CSS, right?

im a huge fan of the Elm broswer. and have been using Elm with atom along with
elm reactor. That has worked adequately. Most difficulties are ironed out by
making sure the Elm code compiles. Then at least all the parts are fitting
together.

But maybe I have written code that compiles, but doesn't express what I am
wanting.

~~~
lukewestby
We're going to change the color. We've been hearing feedback that it's a
little hard on the eyes.

------
madnight
Definitely better than [http://elm-lang.org/try](http://elm-lang.org/try)

------
johnhenry
Awesome! Anyone else having issues in chrome? The buttons along the top bar
are missing for me. Woks fine in Firefox and Safari.

~~~
lukewestby
this could have been the server falling over briefly and features being turned
off as a result. we weren't expecting so much attention tonight since it's
friday!

------
ndreckshage
Congrats Luke!

------
stuaxo
Can there be an option for it not to be pink ?

It's a bit much in the morning.

~~~
alimw
It's got some interesting design decisions for what's potentially a cool
classroom tool. If it appeals to girls that's great, but I'd have to hope it
wouldn't actually repel the boys.

~~~
alimw
I don't know who I've offended but I hope it wasn't the developers. I
genuinely think this is very cool, and if I can get my boss on board I will
try using it in my class.

~~~
ocharles
Probably the sexist nonsense about pink appealing to girls and scaring off
"the boys"?

~~~
alimw
I think it is disgusting that you throw around accusations of sexism without
foundation. I acknowledged ideas that children tend to have concerning sexual
identity (as the designer of Ellie will have done, as anybody who wishes to
address the issue of diversity in computing will have to do). I can assure you
I played no part in inculcating them.

------
dennyabraham
as a ruby dev that constantly dips into irb over syntax and semantic
questions, a tool like this really helps me think at the same increment with
elm!

------
allover
(Ellie is really cool, apologies for the meta comment, but):

It's a shame that all that hits me in the face with Elm code examples lately
is awkward style conventions. Why do they have to be so user hostile?

Trailing brace on the next line even for this?

    
    
        type alias Model =
        { counter : Int
        }
    

Instead of:

    
    
        type alias Model = { counter: Int }
    

Comma first, when trailing comma is so much more intuitive, why this?

    
    
        Html.program
            { view = view
            , update = update
            , subscriptions = \_ -> Sub.none
            , init = ( model, Cmd.none )
            }
    

instead of:

    
    
        Html.program {
            view = view,
            update = update,
            subscriptions = \_ -> Sub.none,
            init = ( model, Cmd.none ),
        }
    

(... which makes for better diffs too). And weird bracket soup for DOM:

    
    
        div []
            [ div [] [ button [ onClick Increment ] [ text "+" ] ]
            , div [] [ text <| toString model.counter ]
            , div [] [ button [ onClick Decrement ] [ text "-" ] ]
            ]
    

... when it's going to be translated to DOM anyway, why not?

    
    
        <div>
            <div><button onClick={increment}>+</button></div>
            <div>{toString model.counter}</div>
            <div><button onClick={decrement}>-</button></div>
        </div>
    

This is needlessly distracting from all the things that are nice about Elm.

~~~
timthelion
The reason for the commas at the beginning, is that it is easier to add a new
line at the end. That is, if you forbid a "last comma". Traditional languages
don't let you do

    
    
        Html.program {
            view = view,
            update = update,
            subscriptions = \_ -> Sub.none,
            init = ( model, Cmd.none ),
        }
    

Because the parse would expect something to come after that last comma. And
thus you would have the last line being special and different.

Also, it is much easier to look at this

    
    
        Html.program
            { view = view
            , update = update
            , subscriptions = \_ -> Sub.none
            , init = ( model, Cmd.none )
            }
    

And see if all of the commas are actually present ;)

~~~
allover
Yep, I get the preference over a lang that can't do trailing commas, which is
why I used the trailing comma style as the counter-example. In a compile-to-JS
language it's hopefully possible to make trailing commas legal. They've been
legal in JavaScript itself for a long time (ES5) [0]

> Also, it is much easier to look at this [...] and see if all the commas are
> actually present.

ESLint can trivially lint that you haven't missed a comma (including the final
trailing comma). The style guide/ESLint config I use (Airbnb's) enforces
trailing commas. If ESLint can do it, Elm should be able to.

[0] [https://developer.mozilla.org/en-
US/docs/Web/JavaScript/Refe...](https://developer.mozilla.org/en-
US/docs/Web/JavaScript/Reference/Trailing_commas)

~~~
RobertKerans
They might have been technically legal since ES5, but they were only finalised
this year (ES2017, with function params), and still don't seem to have full
support. I've been burned a few times by that: I know that MDN article cited
says they are, but code with trailing commas (esp objects) breaks in eg IE
without transpilation

~~~
allover
Yeah as the article says they were only added for object literals in ES5,
which is the main place the 'issue' comes up, and where I was making the
comparison to Elm. That works in IE > ~7/8? without transpilation.

