Refactor ToDo App

[sonukapoor]

• [ ] Use more components
  • [x] todo-list, todo-item
  • [ ] Break form into: Form, Input, Button
• [x] Use more ng-content
• [x] Use an interface ITodoItem to define the todo item type
• [x] Use BehaviorSubject to maintain the state, instead of having two local variables
• [ ] Add filtering of todos based on done/not-done
• [x] Add complete/delete button to each todo item
• [x] Create a ToDoModule
  • Benefits I can see by creating a new module.
  • A new module does not include the default modules like FormsModule, HttpModule etc.. Audience will be forced to include these modules.
  • We will need to export our components from our module, to make them available into the rootModule. We do not talk about export before, so it would make sense to include that.
  • Routes could then be configured into the ToDoModule instead of importing them into the root module.
  • Application will be logically grouped together into a single module.
• [ ] Show CSS in components
  • Show different ways to use CSS with encapsulation (not required for now as @winkerVSbecks)
• [x] Use feature based directory structure #544 - style guide

See example: https://github.com/winkerVSbecks/angular-2-training-13-dec/

FYI: @winkerVSbecks @gvwilson @jamesbs

Once the code-base has these changes, we will need to update our slides as well.

[winkerVSbecks]

@sonukapoor expanded the list a bit more

[sonukapoor]

@winkerVSbecks What do you think about creating a module as well for todo?

[winkerVSbecks]

I've never made it that far in a training but, we could do that as a stretch goal.

[sonukapoor]

@winkerVSbecks I think if we start with modules and explain how we should logically group our application into modules, then it should be an easy step. Right now we start with creating our components, services, pipes etc.. We should be starting with modules. Thoughts?