Hacker News Clone

Using the MEAN stack

Posted on 2016-03-05 13:32:00 in webdev, angular, nodejs, mongodb

The MEAN stack

MEAN stands for MongoDB, Express, Angular, and Node.js.

All of these technologies are brand new to me, but from what I could understand, this stack is perfect for creating web apps quickly. It is unique because it allows you to use javascript throughout so don't have to worry about converting data back and forth from the frontend to the backend.

Node is known for its versatility and its asynchronous nature. When bundled with express, it takes just minutes to get a backend up and running. Also, with npm at your fingertips, you can "stand on the shoulders of giants" with just a few commands.

MongoDB is the leading NoSQL database. It can store json so it eliminates all the time wasted converting data between the frontend and backend. MongoDB is my first taste of NoSQL, but it's been pretty easy to learn. It's so nice to store json in the database.

Although future frameworks are sure to replace Angular (like Vue), it is still very powerful and great for small apps. And it doesn't detract from our javascript focus, so it's great fit with Node, Express, and MongoDB.

Flapper News

All of these technologies are brand new to me, so I followed a tutorial that walked me through making a Hacker News clone called "Flapper News". It has these features:

  • Create new posts
  • View all posts ordered by upvotes
  • Add comments about a given post
  • View comments for a given post
  • Upvote posts and comments
  • Login/Register as a user

The main point of this exercise was to get familiar with the workflow of this stack. It's a lot to take in, but I have a better idea of how to make my own project now.

See it on Github