Portfolio | Mr Men News

This is a Full stack reddit-style news website. (Named Mr Men News as all the users have mr men icons.)

For the backend I created a database using PostgreSQL. I then used Knex.js to interact with it and build an api for my database using an Express server. I created several end points on my api (for details see the backend code below) that I went on to use when making the frontend for the application. I used heroku to host the api and it can be found here

I built the frontend using React with the help of Material UI for some pre styled components. I used Netlify to host the application, see the live demo below.

Watch the video below to see some of the functionality available:

Some cool features (and some im planning on adding):

The website is logged in as a user:
This is to allow for features such as adding and deleting your own comments. There is more functionality I would like to add tht will use this logged in feature such as posting your own article.
Login/logout switch
This toggleable switch allows a user to logout which then blocks their ability to post or delete their own comments. Currently this is hardcoded to the user 'cooljmessy', I am working on an input appearing when trying to login so that any user can login.
User Profile page
If you click on a username, it will take you to their profile page which includes their avatar and full name. This profile page also shows you all the articles by that user.
Sort by and filter
The two bars at the top of the list of articles allow the user to specify the type of articles they see. The bars also show the user how the articles are currently sorted.

There are more features available, checkout the live demo below and have a play around on the app.

Mr Men News

Some cool features (and some im planning on adding):

The website is logged in as a user:

Login/logout switch

User Profile page

Sort by and filter