PR: Elm(ish) Todo List (TodoMVC) Example issue #44

[nelsonic]

This will be an end-to-end learning resource so might take me a few days ... ⏳ It will be worth it. 😉

• [x] Elm(ish) Micro Front-end Framework TDD walkthrough/tutorial! elmish.md
  • [x] DOM #44
  • [x] Routing #46
  • [x] localStorage #47
• [x] remove init function from reset-counter example #49
• [x] Todo List Application ("Business") Logic #48
  • [x] ADD Todo item
  • [x] TOGGLE state of todo item done=true #50
  • [x] TOGGLE_ALL flip the state of all todos at once. #50
  • [x] render the `view #54
  • [x] Pressing [Enter] keyboard key creates new Todo Item #55
  • [x] Subscriptions #57
  • [x] Add an onclick=signal(action) attribute to any element #58
  • [x] DELETE a Todo List item #59
  • [x] EDIT a Todo List Item #60
  • [x] signal('EDIT', data)
  • [x] signal('SAVE', data)
  • [x] ESC key cancels editing and focus on new-todo input https://github.com/dwyl/learn-elm-architecture-in-javascript/issues/64

[codecov[bot]]

Codecov Report

Merging #45 into master will not change coverage. The diff coverage is 100%.

@@          Coverage Diff           @@
##           master    #45    +/-   ##
======================================
  Coverage     100%   100%            
======================================
  Files           1      4     +3     
  Lines          44    312   +268     
  Branches        0     89    +89     
======================================
+ Hits           44    312   +268

Impacted Files	Coverage Δ
examples/todo-list/elmish.js	100% <100%> (ø)
examples/counter-reset-keyboard/counter.js	100% <100%> (ø)
examples/todo-list/todo-app.js	100% <100%> (ø)
examples/counter-reset/counter.js	100% <100%> (ø)	:arrow_up:

---

Continue to review full report at Codecov.

Legend - Click here to learn more Δ = absolute <relative> (impact), ø = not affected, ? = missing data Powered by Codecov. Last update 814467e...ee9c95d. Read the comment docs.

[nelsonic]

Elmish Intro Header:

[nelsonic]

[nelsonic]

[nelsonic]

[nelsonic]

[nelsonic]

Once you achieve 100% coverage, there is no reason to "compromise" by going below this level.

[nelsonic]

[nelsonic]

[nelsonic]

@iteles this PR is not yet "ready" as I have not finished building the Todo App. (each time I sit down to work on this I get 1 or 2 "pomodoros" worth of time ... so it's taking forever!)

However this PR is already over 4.2k lines (roughly 13k words!) so it could use some "sense checking" ...

The Elmish "micro framework" writeup is "ready for review": https://github.com/dwyl/learn-elm-architecture-in-javascript/blob/elmish-todo-list-issue%2344/elmish.md

If you have time, please take a look and leave feedback. (thanks in advance!)

[nelsonic]

[nelsonic]

Given that this tutorial "extension" is now more than twice the size of the original Elm Architecture tutorial, I'm considering splitting it off into it's own new repo ... https://github.com/nelsonic/todomvc-plain-javascript-elm-architecture-example It will make the code organisation a bit "cleaner" because everything will be in a "top level directory" e.g: /lib/app.js as opposed to: /examples/todo-list/todo-app.js

Thoughts ...?

[nelsonic]

Temporarily putting this "on hold" to focus on Startup School App: https://github.com/nelsonic/nelsonic.github.io/issues/511

[nelsonic]

The Startup School Application https://github.com/dwyl/home/blob/master/YCombinator-Startup-School-Application.md was accepted (mostly because they did not bother reading the applications and instead decided to "let everyone in"...) but it means I can get back to finishing this epic tutorial!

[nelsonic]

[nelsonic]

@iteles this tutorial is finally in a reviewable state. 🎉 It's by far the longest one we've ever written ... (longer than my masters thesis...!) 😮 I intend to "refactor it quite a bit and release it as a separate repo: https://github.com/nelsonic/todomvc-vanilla-javascript-elm-architecture-example ✅ which will then be transferred to @dwyl 📥

Please review and give feedback (and/or merge) when you can thanks! 😉

[nelsonic]

Deployed demo to Heroku: https://todomvc-app.herokuapp.com/examples/todo-list/ in case you aren't able to run the branch on your localhost.

[nelsonic]

Made a Gif as "intro image":

[nelsonic]

@iteles I've been through and fixed as many typos and Mardown issues as I could see. 🔍 📝 ✅ Not going to touch this again until you've had a chance to review it. ✋ Thanks for making time. ❤️

[nelsonic]

@iteles agreed. merge and let everyone test it. thanks. 👍