gsg-k3 / bills-system-analysis Goto Github PK

• On this page, you can create a new account by register your name, email, and password.
• Click on the signup button to complete your registration.

• When the user logged in: it consists of five items: the first one called Home when the user click on it, he/she will be turned to Home page, the second one called Bills when the user click on it he/she will be turned to Bill page, the third one called Profile when the user click on it he/she will be turned to Profile page, the forth one called Add new Bill when the user click on it he/she will be turned to Add new Bill page and the last one called Log out when the user click on it he/she will be logged out from the website and returned to landing page.

Must contain:

• Bill Info
• Content

Front-end

• React project must be in folder name client

• set up React ( npx create-react-app my-app)

• install Packages

• install Npm packages as Dependencies

  • @date-io/date-fns
  • @material-ui/core
  • @material-ui/icons
  • @material-ui/lab
  • @material-ui/pickers
  • @testing-library/jest-dom
  • @testing-library/react
  • @testing-library/user-event
  • axios
  • date-fns
  • js-cookie
  • react-swipeable-views
  • xregexp
  • sweetalert
  • react-dom
  • react-router-dom
  • @hapi/joi

Loader Progress

the query name is (getPersonalinfo) but you imported with name (getPersonalInfo) so pls change the query name into getPersonalInfo

Must contain :

• Tiltle
• Chart
  

User can add new bill by typing it's amount in Total amount text field, choose Bill date, Due date, From and To using calendar. In addition to that he/she can type subscription number in it's filed, finally he can submit that by clicking Add button.

To determine:

• Color of the theme

  • primary color : #505050
  • secondary color : #61989F

• Style of the theme

• Query to get last 5 bills by default, or get a bill by Date that has been entered by the user

we can see a set of statistical chart , to compare consume between bill and other bills

Must contain these items:

• Logo
• Home
• Bills
• Profile
• Add new Bill
• Log out

In Bill info Tab in Bill Page see Expansion Panel contains last 3 bill by default , and user can choose the Date , to get any bill want in any date , and Bill Panel contains brief info about bill , and most important info is statistics , if user click statistics link the App open Statistic page

Front-end

• Landing Page: /

• Login Page: /login

• Signup Page: /signup

• Home Page: /home

• Bills Page: /bill/:bill_type 

• Statistics Page: /bill/:bill_type/statistics/:billId

• Contact Page: /bill/:bill_type/contact

• Profile Page: /profile

• Add new bill Page: /new-bill

• Logout: /logout

Issues #2

• when you add a new issue

write a good description
add the issue to the project
add it to the milestone
and add suitable labels.

• when you start working on the issue assign yourself on it.

Must contain:

• Menu2 component
• Total amount
• Bill Date
• Due Date
• Date from
• Date To
• subscription number
• Add Button
• Add new bill page

• On this page, you can choose the type of bills that you want to see it.

Must contain:

• Text fields
• Button

Front-End issues

• Route

• Description

• User Interface

• Add label front-end

Add label component If the issue is about a component and if its a common component add label common-component

Deploying the project on Travis CI.

Deploying the project on Heroku.

Must contain:

• Text fields
• Button

Must contain:

• Heroku link

• Figma link

• Problem

• User Journey

• User Story

• Database Schema

• How to run the project locally?

• Used Technologies

• Team members

• in a login page, you can enter into the app by writing your email and password, or you can log in with google.
• if you do not have an account you can sign up.

Must contain:

• Menu1 Component
• Text fields
• Buttons

must contain:

• information about the service supplier

At this page the user can enter his/her name and mobile number by typing it in it's text field, and choose his/her status, Number of individuals and location using it's drop-down boxes, also he can choose number of his/her devises by click on one of the check boxes. Finally user submit the form by clicking on the button.

Must contain:

• Menu1 Component
• Text fields
• Buttons

home page contains all Types of Bills for the current user , Where the user can have more than one type of bills , when the user click any bill type , the App open Bill Page

• EndPoint: /api/login
• Type: post
• Action: login

Must contain:

• Menu2 component
• Display Name
• Mobile number
• status
• number of indivisulas
• location
• number of devices
• Submit Button

• EndPoint : /api/home
• Type : Get
• Action : getBillTypeOfCurrentUser

Must contain:

• Logo
• Title
• Goal
• Let's go button

• Landing page: no query needed

• Sign up

  • type: post
  • description: query to insert new user in DB

• Login

  • type: post
  • description: query to check user in DB

• Home

  • type: get
  • description: query to get all types of Bills for the current user

• Bill Page

  • type: get

  • description: query to get last 3 bills by default, or get a bill by Date that has been entered by the user

  • type: get

  • description: query to get the Contact for bill provider

• Statistics

  • type: get
  • description: query to get current bill info and bill info of neighbors who registered in the app depending on common
    factors Like location , number of devices and individuals

• Add new bill page

  • type: get

  • description: query to get prodivers types and providers themselves

  • type: post

  • description : query to Insert the new Bill in DB

• pesonal information

  • type: get

  • description: get personal info of current user

  • type : patch

  • description: query to update the user profile

Must contain:

• Menu2 Component
• Title
• Bill Type Card

This query is to allows the user from creating a new account on the website.

related to #21

Must contain these items:

• Logo
• Home
• Log in
• Sign up

• Create sql File
• Create a connection string
• Create build.js file

• When the user doesn't login: it consists of three items: the first one called Home when the user click on it, he/she will turned to landing page, the second one called Login when the user click on it he/she will be turned to login page and the last one called Signup when the user click on it he/she will be turned to signup page.

contains contact information for the service provider

Must contain:

• Text

• menu Icon

write the front-end for the personal information page.

Test the Figma on the users to find the problem

• when I enter the app, the first page that I can see it is a landing page.
  • The landing page displays the goal of the app.
  • its contain a button that returns us to login page