Calendar-based app to track habits using Angular 2
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.


My first Angular 2 app. A calendar-based approach to tracking succes/failure when establishing a new habit. You can find a live running version here.

Angular 2 Notes

The app uses the following Angular 2 features:

  • Components
  • Forms
  • Pipes
  • services
  • Routing (Path Location Strategy)
  • TypeScript (classes, interfaces, typings...)
  • angular-cli version 1.0.0-beta.19-3.

Other libraries use:

  • angularfire2 for Angular2-friendly access to Firebase database APIs.
  • Twitter bootstrap

Still To Do

  • Write tests. The testing (.spec) files are currently empty shells
  • Habit-Edit Form: Async validation if habit name already exists. Ran into issues before with FormControl not having access to component's this object. (Try .bind(this) or let self = this)
  • Habit-Edit: Resolve undefined errors if you go directly to add route
  • Improve performance. Currently loads slow on mobile devices.
  • Improve comments
  • Habit-Edit: On cancel, go back to previous location. See ng2 Location service...location.back()

Refactor Opportunities

  • Combine common code, html, css into from child components into main CalendarComponent. I initially avoided this to play around with multiple components and services.
  • Consider creating a CalendarModule with its own child routing. This would allow for possibly lazy loading the app, maybe improve performance.