Over a million developers have joined DZone.

How to Build a TV Show Tracker with MongoDB, Node.js, and AngularJS

DZone 's Guide to

How to Build a TV Show Tracker with MongoDB, Node.js, and AngularJS

· Java Zone ·
Free Resource

If you're looking for a practical application to get you started with MongoDB, or to hone your skills, or you just to do something fun with your NoSQL savvy (and a variety of web skills, too), you might be interested in this tutorial from Sahat Yalkabov.

It covers the creation of a TV Show Tracker - more specifically, a REST API, authentication and signup process, data creation and retrieval, front-end work, and optimization - using MongoDB and Mongoose, Node.js and Express, Passport, AngularJS, and Bootstrap SASS. The end result, when Yalkabov puts it together, at least, is something like this:

(Source: sahatyalkabov.com/images/blog/tvshow-tracker-32.png)

And this tutorial is detailed. Every step is completely fleshed out, but also segmented so that you can skip around to the interesting parts or the parts you need to be walked through. The only major assumptions made are that you have already comfortably installed Node.js, MongoDB, and express-generator. From there, it's a thirteen-step process:

  1. Creating a new Express project
  2. Bootstrapping an AngularJS application
  3. AngularJS Routes and Templates
  4. Dealing with database schemas
  5. Creating Express API Routes
  6. Query and Parse the TVDB API
  7. Finishing up with AngularJS
  8. Client-side authentication
  9. Server-side authentication
  10. Handling subscription
  11. Setting up email notifications
  12. Optimization
  13. Deployment

Followed by a fourteenth step containing some closing remarks from the author, including tips on how to expand the project and some encouraging words for those not yet prepared enough to complete it. 

Check out Yalkabov's full article for all the steps to build a TV Show Tracker yourself.


Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}