Stack: Angular, MongoDB, Node, Sigma.js, Karma, Protractor Github: PebbleFrame/hacker-news-remake Team Members: Christina Holland, Michael Cheng, Jeff Peoples, Vinaya Gopisetti
The "legacy project" at Hack Reactor was part of our introduction to real-world coding situations, specifically a very common situation where you have to take over and add to an existing codebase. A previous team had built an app (in this case Hack Feed, a pretty cool app that gives you an enhanced UI to view Hacker News) and we were expected to add more features without changing their stack or redoing any of the existing features. We had 4 days to do this.
The existing app already added an improved view of the HN frontpage, as well as allowing users to "follow" other users, view the latest posts and comments from those users, and save their following list by creating an account.
We decided to add a mobile version of this app (Michael Cheng did this, using Ionic), other views such as "top users" (worked on by Vinaya Gopisetti), and social media sharing links (Jeff Peoples).
My contributions were to add tests using Karma (unit tests) and Protractor (e2e tests), since the project previously had no tests, as well as to improve the authentication by adding salt to password hashing, and tokens. After that, I created an engine to generate visual representations of any given thread, where each post was a circle node connected to its parent (the post it was replying to).
The graph was built with Sigma.js. I thought it might be interesting to try a different graphing library after learning D3 on our previous project. Here's a closeup of the graph:
I found it kind of interesting to see what you could get out of the different shapes generated by each thread. For instance, on a different thread, there was one long skinny branch that stood out:
Obviously I enjoyed making the graph a lot more than the testing, but I feel like I gained a lot of experience with Karma and Protractor, and the tests actually ended up catching some bugs, so I'm grateful for that.