Building a Hacker News Clone in AngularJS – Part 2


This is part 2 of my walkthrough on creating a Hacker News clone in AngularJS. This is one of the final projects in the Learn Verified Curriculum. I recommend reading through Part 1 of the series on Building a Hacker News Clone first.

In the first post, we bootstrapped our Angular app, created a nested view using Angular UI Router, created a TopStoriesService to connect to the Hacker News API, and used that service to display a list of story ids in the browser. In this post, we’ll cover the following tasks:

  • Adding a custom directive to display each story
  • Calling on our TopStoriesService within our directive’s controller to fetch information from the Hacker News API
  • Adding our custom directive to the top-stories view
  • Adding a view template for our new directive to use