How to Elm
This is a basic guide on how to learn Elm rather than actually teach you. I'm going to mostly link to resources that I feel are valuable and try to "teach you how to fish".
The main purpose is to accelerate your learning and save you a lot of googling and weeding through bad explinations.
- Main website http://elm-lang.org
- Elm packages search and docs http://package.elm-lang.org
- Elm slack invite http://elmlang.herokuapp.com/
- Syntax Cheat sheet http://elm-lang.org/docs/syntax
- Elm code examples http://elm-lang.org/examples
- Automatic JSON decoders http://eeue56.github.io/json-to-elm/
There is many different ways to learn Elm. Pick the one that best suits your learning style. With that said I feel that an interactive, "real-ish" project approach to be especially effective for me.
Path 0: Make something (recommended)
- Read through the syntax guide
- Start with a basic project example that uses
- Start making a prototype of something (default: to-do list) doing no JS interop or http requests.
- Refractor some things by changing the models type and following the compiler messages
- Pull out some of the larger parts into new files like
- Get to the point it's basically done except for a HTTP request and learn about JSON decoding. I recommend using this: http://eeue56.github.io/json-to-elm/ to do it automatically.
- If this path didn't work for you make an issue or tell me in some way
Path 1: By exercise
- Exercism http://exercism.io/languages/elm
Path 2: By video
- This is a great course (and free!) https://egghead.io/courses/start-using-elm-to-build-web-applications
- Elm seeds https://elmseeds.thaterikperson.com/
- daily drip (paid + a few free) https://www.dailydrip.com/topics/elm
- front-end masters course (paid)
Path 3: By book
- Main Elm book https://guide.elm-lang.org/install.html
- Elm in action (physical / eBook, paid) https://www.manning.com/books/elm-in-action
- 99 problems solved in Elm https://johncrane.gitbooks.io/ninety-nine-elm-problems/content/
- Elm tutorial https://www.elm-tutorial.org/en/
How to "Scale" Elm
One of the first questions JS developers tend to have is how organize and keep code clean when growwing an Elm applicaiton.
There's also not one cure-all way to organize your code like many frameworks encourage you to do. For instance, despite the
Html.program funciton being organized into view, update, model, subscriptions, etc... doesn't mean you have to organize your code that way. Do what makes sense for your domain. Don't prematurely optimize.
These are some basic rules to follow
- Make good models
- Hide implementaiton if it's complex
- Use the view to transform that into html
- If your program needs to change just modify the model and follow the errors till you've got a working app again.
- Remember, Elm makes it easy to fix your mistakes so don't sweat it too much.