React Ecommerce Website

Initially, I made the design with my peers as a project for UI Design course at Douglas College. I decided to create an actual website implementation of it using MERN web stack with the help of some friends who are also interested in web development.
Explore the docs »

Prototype · Report Bug · Request Feature

Table of Contents

1. About The Project
   • Built With
2. Getting Started
   • Prerequisites
   • Installation
3. Contributing
4. License
5. Contact

About The Project

This is an ecommerce website made using MERN web stack. It is the redesigned website of Toronto Cupcake which was made on Figma. Toronto Cupcake is a store that delivers cupcakes for different kinds of events in the GTA, Ontario. You can visit the original website by clicking on this link.

Purpose: The project aims to redesign the Toronto Cupcake website that has an improved overall user experience, additional functionalities, more attractive and simplified cupcake purchases.

Website is currently using:

• Axios for frontend API request to backend
• Bcrypt for authentication
• JSON Web Token for user's token based authentication
• Cloudinary for storing product images
• Express for API routes
• Mongoose for database schema

(back to top)

Built With

• 
• 
• 
• 

(back to top)

Getting Started

This is an example of how you may give instructions on setting up your project locally. To get a local copy up and running follow these simple example steps.

Prerequisites

This is an example of how to list things you need to use the software and how to install them.

• npm

  npm install npm@latest -g

Installation

1. Clone the repo

   git clone https://github.com/ChiefMigz/ecommerce-website.git

2. Install NPM packages

   npm install

3. Generate .env file by typing the command touch .env in bash or by just manually creating the file, type the following and then configure the parameters. Please be advised that a Cloudinary and MongoDB account is required

   ACCESS_TOKEN_SECRET = 
   REFRESH_TOKEN_SECRET = 
   CLOUD_NAME =
   CLOUD_API_KEY =
   CLOUD_API_SECRET =

4. In client/package.json set up the port to link frontend to backend

   "proxy": "http://localhost:PORT/"

(back to top)

Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

(back to top)

License

Distributed under the MIT License. See LICENSE for more information.

(back to top)

Contact

• Miguel Shelwyn Pe Benito - LinkedIn Profile - pebenitomiguel@gmail.com
  
• Sebastian Molina Acosta - LinkedIn Profile - sacostamolin@gmail.com

Project Link: https://github.com/ChiefMigz/ecommerce-website

(back to top)