Relates #2

Route: GET api/v1/profile/:artistId

get the artist information by ID

Acceptance Criteria

• Request
• Response
• Testing

Response

• Success

{ statusCode:200 ,data : [{
id,
first_name,
last_name,
email,
mobile_no,
reviews,
profile_img,
social_accounts,
budget,
bio
}]  }

Testing

to be a successful test

• status === 200
• typeof(data) === "object"

• create admin table
• alter artist table (add new column "active" with default value false)
• add new case admin for login controller
• make POST route for admin login
• make GET rout for get all artist
• make PATCH route for update table artist to activate

admin dashboard

• make login page for admin
• make dashboard with add artist
• activate/not artist with switch button
• admin can see budget
• logout button

Relates #2

Route: POST api/v1/login

Acceptance Criteria

• Request
• Response
• Testing

Request body

 req.body =  {
      email,
      password,
      role,
  }

Validation

{
 email: yup.string().alphanum().required(),
 password: yup.string().min(8).required(),
}

Response

• Success

{ statusCode:200 }

• Failed

{statusCode:401, message:"Unauthorized"}

Testing

to be a successful test

• status === 200
• typeof(data) === "object"

Backend Route template

Name should be : METHOD /full-route

Acceptance Criteria

• Validation Schema

• Request body

• Response

• Testing

Validation schema

Request body

Response

• Success

{ statusCode:  ,data : { }}

• Failed

{statusCode: , message:" "}

Testing

Descreption

This component to display artworks stored in our database and filter them based on conditions

layout

make login page

Relates #2

Route: POST api/v1/signup

Acceptance Criteria

• Request
• Response
• Testing

Request body

 req.body =  {
      firstName,
      lastName,
      email,
      password,
      confirmPassword,
      role (artist or user),
  }

Validation

{
 email: yup.string().alphanum().required(),
 password: yup.string().min(8).required(),
 confirmPassword: yup.string().ref('password'),
 firstName: yup.string().required(),
 lastName: yup.string().required(),
 role: yup.string().required(),
}

Response

• Success

{ statusCode:201 ,data : { }  }

• Failed

{statusCode:401, message:"Unauthorized"}

Testing

to be a successful test

• status === 200
• typeof(data) === "object"

relates #2

Route: GET api/v1/logout

Acceptance Criteria

• Response
• Testing

res.clearCookie('token').redirect('/');

Response

• Success

{ statusCode:200 ,
Location: '/login'
}

• Failed

{statusCode:500, 
message:"Internal Server Error"}

Testing

to be a successful test

• status === 200
• location === '/login'

Relates #2

Route: PATCH api/v1/user/:id

Acceptance Criteria

• Request
• Response
• Testing

Request body

 req.body =  {
      socialMediaAccounts,
      profileImg,
      budget,
      bio,
      mobileNo,
  }

Validation

{
 budget: yup.number().round(),
}

Response

• Success

{ statusCode:200 ,data : { }  }

Testing

to be a successful test

• status === 200

Acceptance Criteria

• Validation Schema

• Request body

• Response

• Testing

Validation schema

{
details: yup.string().required(),
rate: yup.float().requird(),
artistsId: yup.number().integer().positive().required(),
}

Request body

req.body = {
details,
rate,
artistic,
}

Response

• Success

{ statusCode: 201  ,  data: {rows} }

• Failed

{statusCode: 400 , message:"Invalid Data "}

Testing

to be a successful test

status === 201
typeof(data) === "object"

Acceptance Criteria

• Validation Schema

• Request body

• Response

• Testing

Validation schema

{
title: yup.string().required(),
description: yup.string().required(),
category: yup.string().required(),
property: yup.string().required(),
countSold: yup.number().integer().positive().required(),
painting_img: yup.string().required(),
artistsId: yup.number().integer().positive().required(),
}

Request body

req.body = { title,
description,
category,
property,
countSold,
artistsId,
painting_img
}

Response

• Success

{ statusCode: 201  ,  data: {artId, message: "Art Added Successfully} }

• Failed

{statusCode: 400 , message:"Invalid Data "}

Testing

to be a successful test

status === 201
typeof(data) === "object"

• make a slideshow for best selling paintings

Routes

Paintings

Cart

Log

Artist

Review

Relates #2

Route: PATCH api/v1/buy/:productId

This route when user buy product to update both budget for customer and artist and count_sold at product table

Acceptance Criteria

• Request
• Response
• Testing

Response

• Success

{ statusCode:200 ,data : { }  }

Testing

to be a successful test

• status === 200

Relates #2

Route: PATCH api/v1/artist/:id

Acceptance Criteria

• Request
• Response
• Testing

Request body

 req.body =  {
      socialMediaAccounts,
      profileImg,
      budget,
      bio,
      mobileNo,
  }

Validation

{
 socialMediaAccounts: yup.array(),
 profileImg: yup.string(),
 budget: yup.number().round(),
 bio: yup.string(),
 mobileNo: yup.string(),
}

Response

• Success

{ statusCode:200 ,data : { }  }

Testing

to be a successful test

• status === 200

Relates #2

Route: GET api/v1/paintings/:artistId

get the artworks for specific artist by artist ID

Acceptance Criteria

• Request
• Response
• Testing

Response

• Success

{ statusCode:200 ,data : [{
id,
title,
description,
category,
property,
count_sold,
artisit_id,
}]  }

Testing

to be a successful test

• status === 200
• typeof(data) === "object"

make sign up page

File Structure

• client/

  • public/
  • src/
    • assets/
      • icons/
        • .gitkeep
      • images/
        • .gitkeep
    • components/
      • index.js
    • constants/
      • routes.js
    • containers/
      • index.js
    • app/
      - index.js
      - app.module.css
  • .gitignore
  • .eslintrc.json
  • package-lock.json
  • package.json

• server/

  • controllers/
    - index.js
    - errorHandle/
    - index.js

  • database/

    • data/
      • build.sql
      • fakeData.sql
      • build.js
    • queries/
      • index.js
    • connection.js

  • utils/

    • validation/
      • index.js

  • app.js

  • index.js

  • .env

• test/

  • index.js

• .travis.yml

• .gitignore

• .eslintrc.json

• package-lock.json

• package.json

I will try to use nodemailer module in order to send an email to customer after buying a product.

• create a review page for user to add a review about the artist

• convert verify at jsonwebtoken to promise to use async await
  the same for upload image at Cloudinary

Acceptance Criteria

• State
• Props
• Components
• Snapshot

State

Default state will be as follows:

state = {
customerDate: []
}

Component

Then, when the components did mount and request the data from the API it will be as follows:

state = {
customerData:[
   {
    id: integer,
    first_name: string,
    last_name: string,
    email: string,
    budget: integer,
},
...
]
}

Props

There are no props for this page

Snapshot

Name : GET /cart

Description

• get all product for specific user

Acceptance Criteria

• Response

• Testing

Response

• Success

{ 200:  ,data : { }}

• Failed

{[400,500]: , message:" "}

Testing

Routes

Home

Relates #2

Route: GET api/v1/profile/:userId

get the customer information by ID

Acceptance Criteria

• Request
• Response
• Testing

Response

• Success

{ statusCode:200 ,data : [{
id,
first_name,
last_name,
email,
mobile_no,
profile_img,
budget
}]  }

Testing

to be a successful test

• status === 200
• typeof(data) === "object"

#4

Acceptance Criteria

• File Structure
• Server Setup
• Client (React) Setup
• ESLINT config

File Strucutre

• Client
• Server
• Testing
  #3

Server Setup

• Install modules :
  • express
  • jsonwebtoken
  • yup
  • dotenv
  • cookie-parser
  • compression
  • pg
  • nodemon
  • supertest
  • jest
  • eslint
  • pre-commit

React Setup

Generate react app for the client using command

npx create-react-app 

• Install modules :
  • prop-types
  • react-router-dom
  • axios
  • antd

Travis CI

add .yml to the structure

ESLINT config

• ESLINT for the server

      eslint
      eslint-config-airbnb-base
      eslint-plugin-import
      eslint-config-prettier
      eslint-plugin-prettier
      eslint-plugin-flowtype
      eslint-plugin-jsx-a11y
      eslint-plugin-react
      eslint-plugin-react-hooks
      prettier

• ESLINT for the react

      eslint
      eslint-config-airbnb
      eslint-plugin-prettier
      save-exact prettier
      eslint-config-prettier
      prettier

Description

A component that lets the user upload background image and try our painting on his wall and resize it.

Relates #2

Name : GET /cart

Description

• get all reviews for specific artist by artistID as params

Acceptance Criteria

• Response

• Testing

Response

• Success

{ 200:  ,data : { }}

• Failed

{[400,500]: , message:" "}

Testing

relates #2

Route: DELETE api/v1/paintings/:id

Acceptance Criteria

• Request
• Response
• Testing

DB query

DELETE FROM product WHERE id = id;

Response

• Success

{ StatusCode: 200,
  data: { message: "painting deleted successfully" }
}

Testing

to be a successful test

• status === 200

Write the README which should contain the following 👍

• Project Title
• Team Members
• About Project ( a small summary to explain for what our app is )
• Challenge
• Solution
• User Stories
  • As an artist
  • As an user
  • As a admin
• Set up the app locally
• Data Base Schema
• Technologies ( what we use to build the app )

artist profile

• view all artist data
• edit artist info
• add art picture
• view all picture relates to artist
• artist can delete his artist

filter paintings by categories on server (all ,......)

Route: GET api/v1/auth

Description

route to decode token and send userID and role

Response

{ statusCode:200 ,data : {
userID,
role,
} }

Route: GET api/v1/paintings

Acceptance Criteria

• Response
• Testing

Response

• Success

{ statusCode:200,
 data: [{
          id,
          title,
          description,
          category,
          property,
          countSold,
          artistsId
        }] }

• Failed

{statusCode:400, message:" Bad Request"}

Testing

to be a successful test

• status === 200
• typeof(data) === "array"
• data.length !== 0

Create the database tables using Postgres according to this schema

Some frontend routes have to be protected so in order to achieve this purpose we handled a backend route which send a response with status code 200 and user id and role if he is authorized to access this route, and a response of status code 401 and message Un-Authorize if he wasn't authorized, We will check these responses and handle our frontend protected routes in response to them

Travis CI

• Create a config file [ .travis.yml ]
• Connect repository with travis.

Backend Route template

Name : POST /cart

Acceptance Criteria

• Validation Schema

• Request body

• Response

• Testing

Validation schema

Request body

• product id
• price

Response

• Success

{ 200:  ,data : { }}

• Failed

{[400,500]: , message:" "}

Testing

Name : DELETE /cart/:paintingsId

Description :

• delete product from cart

Acceptance Criteria

• Response

• Testing

Validation schema

Request body

Response

• Success

{ 200:  ,data : { }}

• Failed

{[400,500]: , message:" "}

Testing

get painting data by id

Initialize the express app by

• setup express server on port 5000 and

  • use these middleware
    • app.use(cookieParser());
    • app.use(express.json());
    • app.use(compression());
  • set the port
  • disable powered by

• import app.js on index.js and listen to our app

Also install morgan package to make HTTP request logger for node.js

Create a component that renders paintings detail and let the user try painting on his wall

• Upload artist profile image .

• add a fake data to the data base .