Skip to content

Latest commit

 

History

History
46 lines (36 loc) · 1.73 KB

README.md

File metadata and controls

46 lines (36 loc) · 1.73 KB

Crazy-Card-Application

In this project I have develop a web application to allow customers to enter their details and review credit cards that are applicable to their credit status.

Key Points

Stack

  • Used React , Redux on the client . Node JS on the server
  • Materialized UI for CSS and Styling
  • Responsive using materialize-ui grids approach
  • Routing using React Router
  • Webpack for bundling

Code Quality

Did not use create-react-app instead used my own handrolled Webpack config to keep the project void of any unneccesary dependencies.

  • You can see examples of Context , Render Props in the theme handling part.
  • Components which do not have any state have been made functional components.
  • Wrote a component called TextFieldGenerator to generate text fields using json.
  • Snapshot for testing for UI components using Jest
  • Business logic is tested by testing the stores.

Extensibility

  • Server has a cards.json config which has all the configs . Adding a card is as simple as adding into the json.
  • Client has a Constants.js which has the text fields json for dynamic form generation . Adding another field is as easy as adding into the json.

Build

  • Clone the repo
  • Go to the server folder
    • npm i
    • npm run start
    • Server runs at localhost:3000
  • Go to client folder
    • yarn
    • yarn start
    • Navigate to localhost:8080
  • Run Client tests
    • yarn test

Description

  • The user should submit their details via a form.
  • The application should then return a filtered list of cards available to that user.
  • The user should be allowed to select one or more of the returned cards.
  • When multiple cards are selected, the total amount of credit available to the user on those cards should be displayed.