Giter Club home page Giter Club logo

masa-store's Introduction

MASA Market

description

A lot of e-commerce pages are published recently in Gaza especially on Facebook and Instagram, without the existence of a website which makes shopping is a tedious work for customer and buyer, we are going to introduce our app to help both customers and sellers. the website will represent who the seller is and what he does and make an impression on his customers and form a competitive advantage within the increasing competition between online shops. It will be much easier for the buyers to have a place to display the list of orders and all the needed details instead of communication on private messages like they do in social media, As well as for customers, it is a better user experience to display the products and all the details with prices and easily make orders.

Application Setup ๐Ÿ”

  • clone this repo git clone https://github.com/GSG-G9/MASA-Store.git

  • run npm i && cd client npm i to install all dependencies & dev-dependencies for the server and clinet(react-app) .

  • add .env file that contains SECRET_KEY as Environmental Variable and PostgreSQL URLs for your database.

Environment Variables

Environment variables are one of the ways that we use to keep our product safe. If you want to access our app locally you will need to add your own.

First, create a .env file and add the following variables:

SECRET_KEY='add your secret key here'
Database Setup
  • If you don't install PostgreSQL yet in your machine follow this link.

  • then create two databases locally one for testing and one for development for more help follow this link.

  • now add your newly created database to the .env file

    DB_DEV_URL=postgres://{userName}:{password}@localhost:5432/{databaseName}
    DB_TEST_URL=postgres://{userName}:{password}@localhost:5432/{databaseName}
    
  • Now in the Terminal types psql YourdataBaseUrl and then type \i server/database/data/build.sql and finally type \i server/database/data/fakeData.sql

Run the Project
  • In terminal access to project folder on your machine write: npm run dev to start the server and in another terminal type npm run client to run the react app

The Problem Statement:

  • Using social media to sell products is not the best way for managing orders, the CLIENT/SELLER needs a more efficient way to manage purchase orders to minimize time and effort, also to improve the user experience of the buyers.

The Solution :

  • Make a website dedicated to e-commerce with a good UX/UI.
  • According to the problem statement, the client wants to save his time and effort, this can be achieved by creating a web app to help the client organize his time and purchase orders, obtain statistical data on the products and purchase orders, and convert all operations from manual to automatic.

User Journey :

  • In this project, we have two clients so we will describe that as seller, and buyer(customer)

"As a buyer:"

  • I can easily find a product and buy it.

"As a seller"

  • I can see all the important activities on the website, I can add a product to the site.

User Stories :

As a seller :
  • I want to view all my products.
  • I want to delete or edit any product.
  • I want a button to allow me to add the details of a new product then add the product to my products
  • I want to see all the details of the buyers who ordered my products and the products they ordered and when.
  • I want to see statics about the orders.
As a buyer/customer :
  • I want to be able to register and create my account.
  • I want to be able to log in to my account.
  • I want to be able to see my profile.
  • I want to see all the available categories.
  • I want to have a wish list to add the items I want to buy later.
  • I want to be able to select any product and obtain more details about it.
  • I want to combine all my orders in one place like a cart to purchase all orders at once.
  • I want to see my cart and all the added product with some details.
  • I want to see the total price of the products in the cart.
  • I want to see a button for placing an order.
  • I want to be able to add a shipping address with clear details.
  • I want to be able to add payment details with many options.

Application Deployment โœจ

we will use Heroku Platform to deploy our website.

Database Schema ๐Ÿ—„๏ธ

schema schema link

Technologies ๐Ÿ’ป

Frontend

  • React JS
  • React Hooks
  • Material-UI
  • Javascript
  • HTML and CSS

Backend

  • Express JS

Database

  • PostgreSQL

Stretch Goal :

  • add more than one seller
  • add the shipping option to the customers.
  • making the login/ sign-up the last step needed to buy any product, allowing the user to use the app freely as much as possible.
  • adding basic AI to guess what the user is searching for using his search history.
  • using google analytics to know the number of visitors number and the most wanted product.
  • creating a user center to help the users in need.
  • I want to be able to add a rating for any product.
  • Add product variant if exist.

masa-store's People

Contributors

ahmed-aed avatar alaashurrab avatar mflaifel avatar sondos-alalami avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

masa-store's Issues

Back-end Route| GET | /clients

/clients Route

Gets the list of all registered clients with their details in json format from the database

Route : /clients

Method : GET

Protected: true (seller)


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to fetch the data related to clients
using sql query (SELECT id, client_name, last_order, join_date, total_spendingfrom FROM users)


Response :

Response may be success or error :

  • Error :
    {
        status:400,
        message:'Bad request'
    }
  • Success
    {
        status:200,
        data: [{
                   client_id: 5,
                   client_name: 'ุณุงุฑุฉ',
                   last_order: '10/01/2020',
                   join_date: '15/05/2019',
                   total_spending: 358,
                   },
                     .......
                  ] , 
   }

Test :

  • Route :
    Test route by testing all the expected cases for correct retrieve for data from users table.

  • Query :
    Test select database query to make sure that everything is ok.

Back-end Route| PUT |/profile/:userId

profile by USERID

updates the user's data to the data base

Route : /profile/:userId

Method : PUT

Protected: true ,buyer


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to update to the database


Response :

Response may be success or error :

  • Error :
    {
        status:400,
        messgae:'Bad reqeust'
    }
  • Success
    {
        status:200,
    messgae:'added sucssefuly'
    }

Request :

Request body :

    {
       id :1
      email : "A@a "
      first_name:  " ุนู„ุงุก"
      last_name:" ุดุฑุงุจ"
      avatar : " ุตูˆุฑุฉ"
      shipping_address1: " ุฎุงู†ูŠูˆู†ูŠุณ -ุนู…ุงุฑุฉ ุฌุงุณุฑ"
      city : " ุบุฒุฉ"
    }

Test :

  • Route :
    Test route by testing all the expected cases for correct retrieve for data from the user's table.

  • Query :
    Test select database query to make sure that everything is ok.

Back-end Route | GET | /favorite/:userId

get products from the favorite table

gets the data of the products in the favorite

Route : /favorite/:userId

Method : GET

Protected: true,buyer


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to get products data from the database


Response :

Response may be success or error :

  • Error :
    {
        status:400,
        message :' no  favorite products '
    }
  • Success
    {
        status:200,
    data:[
        fav_ID:{
        id:1,
        name: "ุญุฐุงุก",
        quantity: 1,
        price : 6 ,
        description : " ุญุฐุงุก ุฃุจูŠุถ ู…ุงุฑูƒุฉ ุชูˆู…ูŠ",
        img: thumpnail
       
       },
       ... 
       ]
    }

Test :

  • Route :
    Test route by testing all the expected cases for correct retrieve for data from the products table.

  • Query :
    Test select database query to make sure that everything is ok.

Back-end Route| post |/orders/:userid

orders by ID Route

adds to the tabble of data a new order data for this user

Route : /orders/:userid Route

Method : POST

Protected: true,buyer


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to insert order data to the database


Response :

Response may be success or error :

  • Error :
    {
        status:400,
        messgae:'Bad reqeust'
    }
  • Success
    {
        status:200,
    messgae:'added sucssefuly'
    }

Request :

Request body :

    {
        quantity: 1,
        price : 6 ,
        payment method: 'cart'
        user_id : 1
        product_id:1
    }

Test :

  • Route :
    Test route by testing all the expected cases for correct retrieve for data from order table.

  • Query :
    Test select database query to make sure that everything is ok.

Back-end Route | POST | /favorite/:userId

product in the favorite table

adds the data of a products to the favorite

Route : /favorite/:userId

Method : POST

Protected: true, buyer


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to add products data to the database

Requist :

  • body:
    {
        user_id: 6532186,
        product_id: 5135165132
    }

Response :

Response may be success or error :

  • Error :
    {
        status : 400,
        message : ' adding failed '
    }
  • Success
  {
        status : 200,
        message : ' added successfully '
     }
       ... 
       ]
    }

Test :

  • Route :
    Test route by testing all the expected cases for correct addition for data to the favorite table.

  • Query :
    Test select database query to make sure that everything is ok.

Back-end Route| Delete |/cart/:userId

cart route by userId

remove a product from the CART

Route : cart/:userId

Method : Delete

Protected: true,buyer


Main Things :

  • Database
  • Response
  • Test

Response :

Response may be success or error :

  • Error :
    {
        status:400,
        messgae:'bad request'
    }
  • Success
    {
        status:200,
        data: [ ]
     }

Test :

  • Route :
    Test route by testing all the expected cases

  • Query :
    Test select database query to make sure that everything is ok.

Back-end Route| Delete |/favorite/:userId

remove product in the favorite table

delete the data of a products from the favorite

Route : /favorite/:userId

Method : DELETE

Protected: true, buyer


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to remove product data from the database

Requist :

  • body:
    {
        user_id: 6532186,
        product_id: 5135165132
    }

Response :

Response may be success or error :

  • Error :
    {
        status : 400,
        message : ' removing failed '
    }
  • Success
  {
        status : 200,
        message : ' removed successfully '
     }
       ... 
       ]
    }

Test :

  • Route :
    Test route by testing all the expected cases for correct removing of data from the favorite table.

  • Query :
    Test select database query to make sure that everything is ok.

Front-end Route |Sign in

  • Route
    /signin: The Sign-in page allows a user to gain access to the protected route in the app by entering their username and password.
    protected: no

  • UI

image

Back-end Route| GET | /products

Products Route

get all products information in json format from the database

Route : /products

Method : GET

Protected: false


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to fetch all the data related to products


Response :

Response may be success or error :

  • Error :
    {
        status:400,
        messgae:'Bad reqeust'
    }
  • Success
    {
        status:200,
        data: [
         {id:1, title: 'ู‚ู…ูŠุต ู…ุงุฑูƒุฉ ุจูˆู„ูˆ',.....},
         {id:1, title: 'ุญุฐุงุก ู…ุงุฑูƒุฉ ุงุฏูŠุฏุณ',.....}
         ] , 
    }

Test :

  • Route :
    Test route by testing all the expected cases for correct retrieve for data from application table.

  • Query :
    Test select database query to make sure that everything is ok.

Front End || product Card

Common Component - prductCard:

it will be in every page providing extended info about the website

  • props: data, variat= [common favourite],isAddedToFavorite

  • It will be used in Pages :
    Home page
    Category product page (variant)
    Favorite

  • Material UI link :
    link

  • UI Image From Design ๐Ÿ‘
    image
    main
    image

Back-end Route| POST |/sign in

Sing in route by USERID

sends the account credentials and checking if the user is authenticated from the database

Route : /sign in

Method : POST

Protected: false


Main Things :

  • Database
  • Response
  • Test

Response :

Response may be success or error :

  • Error :
    {
        status:400,
        messgae:'Bad reqeust'
    }
  • Success
    {
        status:200,
    messgae:'sing in sucssefuly'
    }

Request :

Request body :

    {
       id :1
    }

Test :

  • Route :
    Test route by testing all the expected cases when id with request === id in databases

  • Query :
    Test select database query to make sure that everything is ok.

Project Setup

  • create the basic file structure for backend and front end #5.
  • setup database #3.
  • create heroku.

Backend [Seller] Routes

Route GET POST PUT Delete Issue Number
/product adds a new product #11
/product/:id edits product details #12
/product/:id remove a product #15
/orders gets all purchase orders of the buyers with their details #22
/clients gets the list of all registered clients with their details #25
/search?section=value gets data of searched word that belong to section {value} #33

Front End || Header

Common Component - Header:

the user is going to have a header in every page and the header contains a navigation bar to channel the pages and also a search bar to search in the data depending on the page and the filter, Also the user profile name and image, and the website logo

Back-end Route| PUT |/cart/:userId

cart route by userId

change QUANTITY of a product

Route : cart/:userId

Method : PUT

Protected: true,buyer


Main Things :

  • Database
  • Response
  • Test

Request :

  • body :
    {
         user_id: 6532186,
        product_id: 5135165132
        quantity: 2

    }

Response :

Response may be success or error :

  • Error :
    {
        status:400,
        messgae:'bad request'
    }
  • Success
    {
        status:200,
        message: "update successful"
     
    },

Test :

  • Route :
    Test route by testing all the expected cases

  • Query :
    Test select database query to make sure that everything is ok.

Front-end Route | page 404

  • Route
    /404: a landing page that tells your site viewers the requested page is unavailable or, in some cases, doesn't exist.
    protected: no

Back-end Route| POST | /product

/product Route

add a new product with its details the database

Route : /product

Method : POST

Protected: true (seller)


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to insert a new item to the products table
using SQL query (INSERT INTO products(quantity, price, name..) VALUES (ุญู‚ูŠุจุฉ ุญู…ุฑุงุก ุงุชุด ุงู†ุฏ ุงู…, 150, 100...)


Request :

  • Request body:
    {
        name: 'ุญู‚ูŠุจุฉ ุญู…ุฑุงุก ุงุชุด ุงู†ุฏ ุงู…',
        price: 120,
        quantity: 5,
         .....
    }

Response :

Response may be success or error :

  • Error :
    {
        status:400,
        message:'Bad request'
    }
  • Success
    {
        status:200,
        message: 'product added successfully', 
    }

Test :

  • Route :
    Test route by testing all the expected cases for inserting data into products table.

  • Query :
    Test insert database query to make sure that everything is ok.

Handle Server errors

  • create a general function to handle errors and pass the error as middleware to the error function in the server.
  • handle 404 requests on the server

Back-end Route | GET | /products/top-rated

product by rating

gets the data of the products with the best ratings

Route : /products/top-rated

Method : GET

Protected: false


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to get product data from the database


Response :

Response may be success or error :

  • Error :
    {
        status:400,
        messgae:'Bad reqeust'
    }
  • Success
    {
        status:200,
    data:[{
        id:1,
        name: "ุญุฐุงุก",
        quantity: 1,
        price : 6 ,
        description : "  ุญุฐุงุก ุฃุจูŠุถ ู…ุงุฑูƒุฉ ุชูˆู…ูŠ",
        img: thumpnail
       
       },
       ... 
       ]
    }

Test :

  • Route :
    Test route by testing all the expected cases for correct retrieve for data from the products table.

  • Query :
    Test select database query to make sure that everything is ok.

Component map

Components Map โœ”๏ธ

No. component Name Issue Number
1- Button #68
2- Header #73
3- Footer #76
4- Product Card #78
5- Special Container #81
6- Container #82
7- Input field #86
8- Cart card #88
9- Admin notification card #90
10- loader #96

Back-end Route| DELETE | /product/:id

Delete product Route

delete a product from database by its id

Route : /product/:id

Method : DELETE

Protected: true (seller)


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to delete a specific product by its id from the database
using SQL query (DELETE FROM products WHERE id = 1)


Response :

Response may be success or error :

  • Error :
    {
        status:400,
        message:'Bad request'
    }
  • Success
    {
        status:200,
       message: 'product removed successfully' , 
    }

Test :

  • Route :
    Test route by testing all the expected cases for correct deleting of a product by id.

  • Query :
    Test delete database query to make sure that everything is ok.

Frontend Routes

Frontend [Applicants] Routes ๐Ÿ‘ถ :

Route Description Issue Number
/ Home page, displaying Hamburger Icons contain login sign up #69
/products/:category Category product page variant #74
/404 404 page #75
/signin Sign in #77
/signup Sign up #79
/profile/ Profile #80
/favorite/ Favourite #83
/cart/:userId Cart #84
/products Product #87
payment/:userId Payment #89
orders/:userId Order #93
dashboard/products products/seller #94
dashboard/product/:id editProduct/seller #95
dashboard/addProduct clients/seller #107
dashboard/editProduct #
dashboard/orders orders/seller #108
dashboard/home home/seller #109
dashboard/clients #

Configuration of Eslint

Extend โ€œCreate React Appโ€ with AirBnBโ€™s ESLint config:

  • Extend ESLint configuration with AirBnBโ€™s linting rules
npm i eslint-config-airbnb eslint-config-prettier eslint-plugin-jsx-a11y --save-dev
  • Create a .eslintrc file in your project root folder, adding the following configuration:

    This file basically tells to esLint to use airbnb rules and generally how to lint the code.

{
  "extends": [
    "react-app",
    "airbnb",
    "plugin:jsx-a11y/recommended",
  ],
  "plugins": [
    "jsx-a11y"
  ],
  "rules": {
    "semi": 0,
    "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
  }
}
  • Add a script to your project to lint your files.
    To lint your codebase, in your package.json you need to add the lint command, in this way:
"scripts": {
  "start": "react-scripts start",
  "build": "react-scripts build",
  "test": "react-scripts test",
  "eject": "react-scripts eject",
  "lint": "eslint ."
},
npm run lint
  • Configure eslint :
    link

Back-end Route| GET |/signout/:userId

signout route

yes delete coockies and token

Route : /signout

Method : GET

Protected: true ,buyer,seller


Main Things :

  • Database
  • Response
  • Test

Response :

Response may be success or error :

  • Error :
    {
        status:400,
        messgae:'"log out filed'
    }
  • Success
    {
        status:200,
    messgae:'log out sucssefuly'
    }

#### Test : 
* Route : 
  Test route by testing all the expected cases. all token and cookies should be deleted
  
* Query : 
  Test select database query to make sure that everything is ok. 

Back-end Route |Travis

add Travis configuration

language: node_js

node_js:
 - lts/*

services:
 - postgresql

before_script:
 - psql -c "create database db_test;" -U postgres
 - psql -c "create user db1_project with password 'test';" -U postgres
env: 
 global:
 - PGPORT=5432
test:
 adapter: postgresql
 database: db_test

Front-end Route |Sign Up

  • Route
    /signup : A signup page (also known as a registration page) enables users and organizations to independently register and gain access to my app
    protected: no

  • UI

image

Back-end Route | POST | /cart/:userId

product in the CART table

adds a product to the CART

Route : /cart/:userId

Method : POST

Protected: true, buyer


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to add products data to the database

Requist :

  • body:
    {
        user_id: 6532186,
        product_id: 5135165132,
        quantity:2
    }

Response :

Response may be success or error :

  • Error :
    {
        status : 400,
        message : ' adding failed '
    }
  • Success
  {
        status : 200,
        message : ' added successfully '
     }
       ... 
       ]
    }

Test :

  • Route :
    Test route by testing all the expected cases for correct addition for data to the cart table.

  • Query :
    Test select database query to make sure that everything is ok.

Front End || Button

Common Component - Button:

The App will have many Buttons on many pages so, we have to use a common component called Button and used it more than once.

  • props: width, height, name, color, icon, onClick,

  • It will be used in Pages :
    almost every page.

  • Material UI link :
    button link

  • UI Image From Design ๐Ÿ‘
    image
    image
    image

Configure rtl support

Main Things :

  • Material-UI Right-to-left Configuration
  • Arabic font from google font

Material-UI Right-to-left Configuration

  • To change the direction of Material-UI components the following steps must be followed:
  1. HTML
    the dir attribute should be set on the body, otherwise native components will break
<body dir="rtl">
  1. jss-rtl
npm install jss-rtl
  1. When a JSS instance with the plugin is created, it should be available to all the components in the component tree. The StylesProvider component enables this:
import { create } from 'jss';
import rtl from 'jss-rtl';
import { StylesProvider, jssPreset } from '@material-ui/core/styles';

// Configure JSS
const jss = create({ plugins: [...jssPreset().plugins, rtl()] });

function RTL(props) {
  return (
    <StylesProvider jss={jss}>
      {props.children}
    </StylesProvider>
  );
}

Arabic font from google font

  • A clear arabic font should be chosen, it should be consistent with the design and appearance of the website.

Material-UI Right-to-left Configuration

Back-end Route | GET | /products/trending

product by the number of orders

gets the data of the products with the best order number

Route : /products/trending

Method : GET

Protected: false


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to get product data from the database


Response :

Response may be success or error :

  • Error :
    {
        status:400,
        messgae:'Bad reqeust'
    }
  • Success
    {
        status:200,
    data:[{
        id:1,
        name: "ุญุฐุงุก",
        quantity: 1,
        price : 6 ,
        description : "ุญุฐุงุก ุฃุจูŠุถ ู…ุงุฑูƒุฉ ุชูˆู…ูŠ ",
        img: thumpnail
       
       },
       ... 
       ]
    }

Test :

  • Route :
    Test route by testing all the expected cases for correct retrieve for data from the products table.

  • Query :
    Test select database query to make sure that everything is ok.

Front End || Footer

Common Component - Footer:

it will be on every page providing extended info about the website

  • props: isAdmin

  • It will be used in Pages :
    almost every page.

  • Material UI link: there is no component for the footer, you will make it from scratch.

  • UI Image From Design ๐Ÿ‘
    image
    log in
    image
    buyer
    image
    seller

Back-end Route| GET |/product/:productId

product by ID Route

gets the data of the product for this ID

Route : /product/:productId

Method : GET

Protected: False


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to get order data from the database


Response :

Response may be success or error :

  • Error :
    {
        status:400,
        messgae:'Bad reqeust'
    }
  • Success
    {
        status:200,
    data:[{
        id:1,
        name : "ุญุฐุงุก" ,
        description : " ุญุฐุงุก ุงุจูŠุถ ู…ุงุฑูƒุฉ ุชูˆู…ูŠ " ,
        img : [{ URL : "https://dsgfhgjhkjlk"} , {...} , ....],
        category : "ุฑูŠุงุถุฉ",
        rating : 10,
        old_price : 6 ,
        new_price : 5 ,
        quantity : 5,
        add_date : 22/6/2020,
        
        }]
    }

Test :

  • Route :
    Test route by testing all the expected cases for correct retrieve for data from the products table.

  • Query :
    Test select database query to make sure that everything is ok.

Back-end Route| GET |/product-search ?category: value

product-search a route

gets the data of all the products with a category type {value} and in the search result

Route : /product-search ?category: value

Method : GET

Protected: fales


Main Things :

  • Database
  • Response
  • Test

Response :

Response may be success or error :

  • Error :
    {
        status:400,
        messgae:'Not found'
    }
  • Success
    {
        status:200,
        data: [
         {id:1, title: 'ู‚ู…ูŠุต ู…ุงุฑูƒุฉ ุจูˆู„ูˆ',.....},
         {id:1, title: '[`ุญุฐุงุก ู…ุงุฑูƒุฉ ุงุฏูŠุฏุณ',.....},
          ....
         ] 
    }

Test :

  • Route :
    Test route by testing all the expected cases

  • Query :
    Test select database query to make sure that everything is ok.

Back-end Route| PUT | /product/id

Update product Route

edit a product information by its id and update database

Route : /product/:id

Method : PUT

Protected: true (seller)


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to update a specific product information in products table


Request :

  • Request body:
    {
        name: 'ุญู‚ูŠุจุฉ ุญู…ุฑุงุก ุงุชุด ุงู†ุฏ ุงู…',
        price: 120,
        quantity: 5,
         .....
    }

Response :

Response may be success or error :

  • Error :
    {
        status:400,
        message:'Bad request'
    }
  • Success
    {
        status:200,
       message: 'product information updated successfully' , 
    }

Test :

  • Route :
    Test route by testing all the expected cases for update data from product table.

  • Query :
    Test update database query to make sure that everything is ok.

Back-end Route| GET |/orders/:userid

orders by ID Route

gets the data or the perhes orders with this user

Route : /orders/:userid Route

Method : GET

Protected: true,buyer


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to get order data from the database


Response :

Response may be success or error :

  • Error :
    {
        status:400,
        messgae:'Bad reqeust'
    }
  • Success
    {
        status:200,
    data:[{
        quantity: 1,
        price : 6 ,
        date :22/6/2020,
        payment method: 'cart',
        user_id : 1,
        product_id:1
        }]
    }

Test :

  • Route :
    Test route by testing all the expected cases for correct retrieve for data from order table.

  • Query :
    Test select database query to make sure that everything is ok.

Back-end Route| POST |/sign up

Sing up a route by USERID

sends the account credentials and creating a new user in the database

Route : /sign up

Method : POST

Protected: false


Main Things :

  • Database
  • Response
  • Test

Request :

Request body :

    {
   email: "A@a"
  password:123456
  first_name:'ุนู„ุงุก"
  last_name:"ุดุฑุงุจ"
    }

Response :

Response may be success or error :

  • Error :
    {
        status:400,
        messgae:'Bad reqeust'
    }
  • Success
    {
        status:200,
    messgae:'sing up sucssefuly'
    }

Test :

  • Route :
    Test route by testing all the expected cases

  • Query :
    Test select database query to make sure that everything is ok.

Back-end Route| GET |/profile/:userId

profile by USERID

gets the user's praivet data FROM THE DATABASE

Route : /profile/:userId

Method : GET

Protected: true,buyer


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to get data from the database


Response :

Response may be success or error :

  • Error :
    {
        status:400,
        messgae:'Bad reqeust'
    }
  • Success
    {
        status:200,
    messgae:'added sucssefuly'
    }

Request :

Request body :

    {
       id :1
      email : "A@a "
      first_name:  " ุนู„ุงุก"
      last_name:" ุดุฑุงุจ"
      avatar : " ุตูˆุฑุฉ"
      shipping_address1: " ุฎุงู†ูŠูˆู†ูŠุณ -ุนู…ุงุฑุฉ ุฌุงุณุฑ"
      city : " ุบุฒุฉ"
    }

Test :

  • Route :
    Test route by testing all the expected cases for correct retrieve for data from the user's table.

  • Query :
    Test select database query to make sure that everything is ok.

Back-end Route| GET | /orders

Orders Route

Gets all purchase orders of the buyers with their details in JSON format from the database

Route : /orders

Method : GET

Protected: true (seller)


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to fetch all the data related to orders
using SQL query (select) with inner join to select from multiple tables (orders, products, users) and determine needed attributes


Response :

Response may be success or error :

  • Error :
    {
        status:400,
        message:'Bad request'
    }
  • Success
    {
        status:200,
        data: [{
                   order_id:1,
                   client_id: 5,
                   client_name: ุฃุญู…ุฏ,
                   client_avatar: 'https://www.google.com/search?q=profile+personal+information',
                   product_id: 5,
                   product_title: ู‚ู…ูŠุต ุจูˆู„ูˆ,
                   product_price: 150,
                   category: ุฃุฒูŠุงุก,
                   quantity: 2,
                   total_price:300,
                   purchase_date: 10/01/2020
                }] , 
   }

Test :

  • Route :
    Test route by testing all the expected cases for correct retrieve for data from the orders table.

  • Query :
    Test select database query to make sure that everything is ok.

File structure

  • create a server folder with the following file structure:
server
โ”‚ app.js
โ”‚ index.js 
โ”‚
โ””โ”€โ”€โ”€routes :
โ”‚   โ”‚   index.js
โ”‚   โ”‚   file1.js
โ”‚   โ”‚   file2.js
โ”‚   โ”‚   ...
โ”‚ 
โ””โ”€โ”€โ”€controllers :
โ”‚       โ”‚   index.js
โ”‚       โ””โ”€โ”€โ”€   seller :
โ”‚       โ”‚             โ”‚   index.js
โ”‚       โ”‚             โ”‚   file1.js
โ”‚       โ”‚             โ”‚      ...
โ”‚       โ””โ”€โ”€โ”€  buyer :
โ”‚       โ”‚             โ”‚   index.js
โ”‚       โ”‚             โ”‚   file1.js
โ”‚       โ”‚             โ”‚      ...
โ”‚       โ””โ”€โ”€โ”€  common :
โ”‚       โ”‚             โ”‚   index.js
โ”‚       โ”‚             โ”‚   file1.js
โ”‚       โ”‚             โ”‚      ...
โ”‚       โ””โ”€โ”€โ”€  errors :
โ”‚       โ”‚             โ”‚   index.js
โ”‚       โ”‚             โ”‚   file1.js
โ”‚       โ”‚             โ”‚      ...
โ”‚       โ”‚   ...
โ”‚   
โ””โ”€โ”€โ”€ database :
โ”‚       โ”‚   connection.js
โ”‚       โ””โ”€โ”€โ”€   data :
โ”‚       โ”‚             โ”‚   bulid.js
โ”‚       โ”‚             โ”‚   bulid.sql
โ”‚       โ”‚             โ”‚   fakeData.sql
โ”‚       โ””โ”€โ”€โ”€  quieres :
โ”‚       โ”‚             โ”‚   index.js
โ”‚       โ”‚             โ”‚   file1.js
โ”‚       โ”‚             โ”‚      ...
โ”‚
โ””โ”€โ”€โ”€utilities :
โ”‚   โ”‚   index.js
โ”‚   โ”‚   file1.js
โ”‚   โ”‚   file2.js
โ”‚   โ”‚   ...
โ””โ”€โ”€โ”€middlewares :
โ”‚   โ”‚   index.js
โ”‚   โ”‚   file1.js
โ”‚   โ”‚   file2.js
โ”‚   โ”‚   ...
โ”‚ 
  • install the needed packages for the server
  • create a client folder using create-react-app with the following file structure:
client :
โ”‚
โ””โ”€โ”€โ”€public :
โ”‚   โ”‚   index.html
โ”‚ 
โ””โ”€โ”€โ”€src :
โ”‚       โ”‚   index.js
โ”‚       โ””โ”€โ”€โ”€   assets :
โ”‚       โ”‚             โ”‚   file1.jpg
โ”‚       โ”‚             โ”‚      ...
โ”‚       โ””โ”€โ”€โ”€  component :
โ”‚       โ”‚             โ”‚  index.js
โ”‚       โ”‚             โ””โ”€โ”€โ”€  component1:
โ”‚       โ”‚             โ”‚           โ”‚ index.js
โ”‚       โ”‚             โ”‚           โ”‚ style.css
โ”‚       โ”‚             โ””โ”€โ”€โ”€  component2:
โ”‚       โ”‚             โ”‚           โ”‚ index.js
โ”‚       โ”‚             โ”‚           โ”‚ style.css
โ”‚       โ”‚             โ”‚      ...
โ”‚       โ””โ”€โ”€โ”€  pages :
โ”‚       โ”‚             โ”‚   index.js
โ”‚       โ”‚             โ””โ”€โ”€โ”€  page1:
โ”‚       โ”‚             โ”‚           โ”‚ index.js
โ”‚       โ”‚             โ”‚           โ”‚ style.css
โ”‚       โ”‚             โ””โ”€โ”€โ”€  page2:
โ”‚       โ”‚             โ”‚           โ”‚ index.js
โ”‚       โ”‚             โ”‚           โ”‚ style.css
โ”‚       โ”‚             โ”‚      ...
โ””โ”€โ”€โ”€utilities :
โ”‚   โ”‚   index.js
โ”‚   โ”‚   file1.js
โ”‚   โ”‚   file2.js
โ”‚   โ”‚   ...
  • install the needed packages for the client
  • create a test folder :

Back-end Route| GET |/products/:catogory

product-catogory route

gets the data of all the products with a category type {value}

Route : /products/:catogory

Method : GET

Protected: fales,buyer,seller


Main Things :

  • Database
  • Response
  • Test

Response :

Response may be success or error :

  • Error :
    {
        status:400,
        messgae:'bad request'
    }
  • Success
    {
        status:200,
        data: [
         {id:1, title: 'ู‚ู…ูŠุต ู…ุงุฑูƒุฉ ุจูˆู„ูˆ',.....},
         {id:1, title: '[`ุญุฐุงุก ู…ุงุฑูƒุฉ ุงุฏูŠุฏุณ',.....},
          ....
         ] , 
           [ ]
    }

Test :

  • Route :
    Test route by testing all the expected cases

  • Query :
    Test select database query to make sure that everything is ok.

Back-end Route| GET | /search?section=value

/search?section=value Route

get result of searched word that belong to section (value)

Route : /search?section=value

Method : GET

Protected: true (seller)


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to fetch data corresponding to searched word that belong to section (value):

  • search in products section by product name: /search?section=products%q=ู‚ู…ูŠุต
    using sql query (SELECT id, name, description, price, quantity ... from products WHERE name LIKE '%ู‚ู…ูŠุต%)

  • search in users section by user name: /search?section=users%q=ุณุงุฑุฉ
    using sql query (SELECT id, name, join_date, total_spending, last_order ) from users WHERE name LIKE '%ุณุงุฑุฉ%)

  • search in orders section by user name: /search?section=orders%q=ู‚ู…ูŠุต
    using sql query to select client_name, client_img, product_title, .... with inner join of multiple tables (orders, users, products)


Response :

Response may be success or error :

  • Error :
    {
        status:400,
        message:'Bad request'
    }
  • Success

    • Response from search in orders section:
   
    {
        status:200,
        data:  [{
                   order_id:1,
                   client_id: 5,
                   client_name: ุฃุญู…ุฏ,
                   client_avatar: 'https://www.google.com/search?q=profile+personal+information',
                   product_id: 5,
                   product_title: ู‚ู…ูŠุต ุจูˆู„ูˆ,
                   product_price: 150,
                   category: ุฃุฒูŠุงุก,
                   quantity: 2,
                   total_price:300,
                   purchase_date: 10/01/2020
                 },
                 .....
                ] ,
    }
  • Response from search in users section:
    {
        status:200,
        data: [{
                   client_id: 5,
                   client_name: 'ุณุงุฑุฉ',
                   last_order: '10/01/2020',
                   join_date: '15/05/2019',
                   total_spending: 358,
                   },
                     .......
                 ] , 

    }
  • Response from search in products section:
   
    {
        status:200,
        data:  [
                   {id:1, title: 'ู‚ู…ูŠุต ู…ุงุฑูƒุฉ ุจูˆู„ูˆ',.....},
                   {id:1, title: '[`ุญุฐุงุก ู…ุงุฑูƒุฉ ุงุฏูŠุฏุณ',.....}
                  ] , 
              
    }

Test :

  • Route :
    Test route by testing all the expected cases for correct retrieve for data from (users, orders, products) tables.

  • Query :
    Test select database query to make sure that everything is ok.

Reference guide

in this thread, you can see the reference guide for this repo.

Back-end Route | GET | /cart/:userId

product in the cart table

gets the data of the products in the cart

Route : /cart/:userId

Method : GET

Protected: true,buyer


Main Things :

  • Database
  • Response
  • Test

Database :

Use database query to get products data from the database


Response :

Response may be success or error :

  • Error :
    {
        status:400,
        messgae:'no  cart products '
    }
  • Success
    {
        status:200,
    data:[ {cart_ID:{
        id:1,
        name: "ุญุฐุงุก",
        quantity: 1,
        price : 6 ,
        description : "ุญุฐุงุก ุฃุจูŠุถ ู…ุงุฑูƒุฉ ุชูˆู…ูŠ ",
        img: thumpnail
       
       },
       ... 
      } ]
    }

Test :

  • Route :
    Test route by testing all the expected cases for correct retrieve for data from the products table.

  • Query :
    Test select database query to make sure that everything is ok.

Backend [Buyer] Routes

Route GET POST PUT Delete Issue Number
/products get all product from the database #8
/product/:productId get the data of the product with this ID #16
/products/top-rated gits the data of the products with the highest rating #18
/products/trending gets the data most buyer #20
/favorite/:userId get all the data about the products that's in the favorite #21
/favorite/:userId adds a product to the favorite #29
/favorite/:userId remove a product from the favorite #32
/cart/:userId get all the data about the products that's in the CART #30
/cart/:userId adds a product to the CART #31
/cart/:userId change QUANTITY of a product #28
/cart/:userId remove a product from the CART #27
/products/:catogory gets the data of all the products with a category type {value #26
/product-search ?category: value gets the data of all the products with a category type {value} and in the search result #24
/signup sends the account credentials and creating a new user in the database #23
/sign in sends the account credentials and checking if the user is authenticated from the database #19
/signout delete coockies and token #17
/isAuth get all user data #101
/profile/:userId gets the user's praivet data FROM THE DATABASE #14
/profile/:userId updates the user's data to the data base #13
/orders/:userid gets the data or the perhes orders with this user #10
/orders/:userid adds to the tabble of data a new order data for this user #9

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.