benciantar / boardgame-eshop

Hyper Island Project 7 - A board game themed e-commerce React app, including custom built Rest API that pulls data from a MongoDB database. Client deployed on Netlify, server deployed on Heroku.

#boardgame-eshop

Runic Online Board Game Store

Brief: Build a complete e-commerce website - develop the front end client in a technology of our choice, setting up a database in MongoDb, and creating a RESTful API to connect the two.

Timeframe: Three weeks.

Description: I decided to build a board game ecommerce app in React which featured all the main components of a typical e-store - sorting and filtering products, adding and removing objects from a cart, and placing orders. I also added a functioning login system to generate extra learnings.

Key Learnings:

JS/React:

  Vastly increased comfort using states to handle things like cart functionality and checking 
  whether the user is logged in.

  Using React Router to handle navigation between Pages.
            
  Creating functional form components.
  
  How to use Fetch requests to access DB data via an API using endpoints.

MongoDB:

  Setting up a MongoDB database.

  Formatting collection and document schemas so that data is logically accessible.
  
  Formatting queries to search and filter data.
  
REST APIs:

  How to build a RESTful API from the ground up.
  
  How to connect to a database.
  
  How to use CRUD operators (POST, GET, DELETE etc.) to store, retrieve and manipulate data in the DB.
  
Deployment:
  
  Used MongoAtlas to host DB online.
  
  Used Netlify to deploy the client.
  
  Used Heroku to deploy the server.
  
  Used variable URLs so the site will run both online and locally.