Wrapping Up Strength Tracker


Over the past couple of months on my spare time, I've been creating a MEAN stack app to track my strength training called strength-tracker.  I'm at a point where I've got the functionality working, as well as some super basic login and registration capability.  Before I move on the to next web framework, I'd like to add some finer points to the app to get some exposure to how to do these things work in the JavaScript and Node ecosystem, as well as to give myself a little better feeling about what I've done.

I'm looking to plow through these things during the evenings this week, and then post something on lessons learned about MEAN stack programming from the project.  Here are my wrap-up tasks:

Improve the architecture

Because I'm new the MEAN stack.  Much of the app was written in a mode of fiddling with the code and frameworks to get it going.  Now that I got things functional I want to do some refactoring modularize things and separate concerns.  A few of things I have in mind:

  • Use node's require mechanism to split out some concerns on the node-side, such as passportjs code.
  • Use AngularJS's "controller as" construct, get away from the $scope

Add More Tests

Of course to avoid making my refactoring a painful exercise I want to add tests around my code, I've been doing this on the AngularJS end of things, but I also want to get some automation going on the node/express end.  Plus this will give me a good intro to in testing node.

Add Error Messages

Since I've been pushing to get this project working, I've been intentionally putting off error display.  Now's the time to circle back and errors are properly communicated to the user when appropriate.  I'll likely implement an animated interstitial for it, and I'll probably find something I can use from the angular open source community.

Use Grunt or Gulp to set up a nicer build solution

I hear Gulp is the newer hotness but it seems like grunt has a more goodies as far as plugins  out there. I'd like to get an automated build going based on changes as I go, and include things like jshint/linting, tests, coverage, complexity, etc.

Use a require mechanism in angular

Right now the code base is loading all its script dependencies in the main index.html as script tags.  I'd like to try out one of the javascript libraries for including file dependencies, like requireJS or browserify