Code Monkey home page Code Monkey logo

lhl_final's Introduction

Project: PayKids

PayKids is a multi-page React application, that allows children to customise their own virtual debit cards and bank account user interface.

The application uses React, Postgres, Node and Express.

PayKids: Landing Page and Login Form

"Screenshot of URLs page"

PayKids: Dashboard

"Screenshot of URLs page"

PayKids: Request Money Form

"Screenshot of URLs page"

PayKids: Personalise Virtual Debit Card

"Screenshot of URLs page"

PayKids: Personalise Account User Interface Theme

"Screenshot of URLs page"

PayKids: Logout Screen to Landing Page

"Screenshot of URLs page"

Frontend Dependencies

  • React ^16.9.0
  • React-dom ^17.0.2
  • React-router-dom ^6.0.2
  • React-scripts 4.0.3
  • Axios ^0.24.0
  • Muicss ^0.10.3
  • Testing-library/react ^8.0.7
  • Testing-library/react-hooks 7.0.2
  • Testing-library/jest-dom ^4.0.0

Backend Dependencies

  • chalk ^4.1.2
  • cookie-parser ~1.4.4
  • cookie-session ^1.4.0
  • cors ^2.8.5
  • debug ~2.6.9
  • dotenv ^10.0.0
  • express ~4.16.1
  • morgan ~1.9.1
  • pg ^8.7.1
  • pg-native ^3.0.0
  • uuid ^8.3.2

Getting Started

  • Use the following Frontend and Backend to install dependencies
npm install

Know Package Version Issue

  • Use the following install command if there is a Muicss version error
npm install --save muicss --legacy-peer-deps

Running Webpack Developmement Server or Express

  • Use the following command to start the frondend and backend from within each app root directory
npm start

Seeding The Database

  • Seed and reset the database using the following command
npm db:reset

TODO:

  • Add schemas and seed data for updated frontend
  • Create new backend endpoints
  • Refactor
  • Create Parents UI/UX

NOTE: The creative commons license is meant for the app design and user interfaces

Shield: CC BY-NC-SA 4.0

This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.

CC BY-NC-SA 4.0

lhl_final's People

Contributors

nsagias avatar astarinamaulida avatar tonyloba avatar

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.