Try, try, try again!

[badlydrawnrob]

Simplify and create notes

🌟 Start splitting these out into proper repo examples
🧑‍🎓 Intermediate Elm is difficult. There's lots to learn. Keep practicing and persevere.
Here we're trying out some examples from books. Often if you've reached the fourth chapter, the first chapter stuff has evolved or is "hidden" because our app has become complex. It's handy to have both a simplified version of the code, and the code in context.

1. Code isn't that important. Limit what you do and live a full life!
2. What happens if Ellie app disappears? You've lost all your examples!
3. This list is already feeling a bit narly, write some code stories!
4. ELi5 for beginners. Can you understand it after 5 years?
5. Split code into manageable chunks.
6. Some problems will come back around. Leave them out.
7. Esoteric stuff is maybe not as urgent. Leave that out too.
8. The stuff that's simple and always crops up, you can probably skip that too!
9. Below we have different versions of the same problem.
   • Consider only adding the accepted or "one way to do it" version.
   • Unless it's a gotcha that you've got to be careful with.
10. Programming Elm's refactoring tasks are quite useful to teach with.
    • However, the npm dependencies make it an absolute chore.
    • Drastically simplify this into a nice little story. Possibly Draw!

Other complimentary cards

• As easy as ... finger painting for adults #11
• To be or not to be: custom types #38 (simple rules to follow)
• Start grouping related ideas together in a better format than issues #18
• Questions: How do you do __ in Elm? #24
• Learning: lazy loading and other methods #12
• 📖 Elm Guide: the good and the bad #31 (for writing and teaching)
• 📖 Elm in Action: the good and the bad #19 (for reducing what you teach)
• 📖 Programming Elm: The Good and the Bad #35 (for simplifying language and reducing wordcount)

It's different from React

• Make data structures, not components!
• Elm Land has it's own particular way of doing things

The easy stuff (or easier)

• The most simple program you could get
• Types as functions

Simple recursion

• A simple recursion problem (-vs- doing it in Lisp)¹
  • Version 2 (almost works), Version 3 (does work)
  • Slightly simplified version using (0, "string") :: (1, "string") :: [] (you can do that!)
  • A better way of using List.filter
  • A better way to use functions in general (see here and here)
    • 🌟 And a final refactor from @polarit (with notes)²
• Recursion using functions and accumulators (foldl, reduce, etc)

Random package

• Using Cmd and Msg with Random
• ⭐ Using Cmd.batch with a weighted randomised dice (and the unweighted version)
  • This could've been simplified with a simple Model Int DieFace DieFace and ...
  • Using Random.map2 or something.

Fixing bugs

• Reasoning about bugs in your code (Is List.map or List.filter the culprit?)

Slightly bigger programs

Splitting out modules

I think I need a proper tutorial to understand this

• Msg in different modules (and passing messages between modules)
• How do you start splitting things into different modules? (🎥 scaling Elm apps)

Dealing with strings

• A server and a string³ (chapter 04a Elm-in-Action)
  • ⭐ A simpler server and a string (Beginning Elm, using a local server)
    • This version adds an error message handler (quite painstaking)⁴

Dealing with JSON

• 🌟 A server and json (Elm in Action with expectJson)
  • A simple json string (Beginning Elm json (part 01), using json-server and decodeString)
  • ⭐ A simple json array (Beginning Elm json (part 01), with a simpler case and decodeJson)
  • A json object converted to a record (Beginning Elm json (part 02), using decodeJson)
    • Converting postDecoder to use pipeline (with an optional field)
    • ⭐ A nested decoder using pipeline (db.json now has more info for author)
    • A flat Elm type (from a nested json object, requiredAt — same as Json.Decode.at)
• Photo select from server with Dict (Elm In Action)
  • Hardcoding Photo data as a testing method (initialModel without server)
  • Hardcoding Folders data (using a recursive type/viewFunction)

Stuff for later/never

Wherever possible, reduce state and javascript dependencies.
Keep any Javascript (ports, flags, subs) as simple and small as possible.
See the limits of Elm and javascript interop

1. Image filters using custom element, ports, flags and subscriptions (Elm in Action)

Footnotes

1. Wherever possible, simplify!! The original problem was a simple case statement on a bunch of days. You might not need any more than that! Also, the longer the functions/definitions the harder it is to look through and see how it works. Don't make life complicated for your future stupid self :) ↩

2. An even more concise version from the List.Extra package. This isn't as performant as a case statement it seems. You might also want to consider converting this list of tuples into a Dict for faster lookup. ↩

3. Be sure to use Console to check for errors with the server. It's complaining when trying to connect to the server using http — it must be https. ↩

4. What's the simplest way to handle an error message? ↩