https://github.com/di-void/payment-flow

https://github.com/di-void/payment-flow

Last synced: about 1 year ago
JSON representation

• Host: GitHub
• URL: https://github.com/di-void/payment-flow
• Owner: di-void
• Created: 2022-08-19T21:09:33.000Z (almost 4 years ago)
• Default Branch: main
• Last Pushed: 2022-08-22T11:09:46.000Z (almost 4 years ago)
• Last Synced: 2025-02-13T20:35:25.771Z (over 1 year ago)
• Language: JavaScript
• Size: 1.02 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Payment Flow - Sofware Engineer Task 1

This is a solution to the [FIRST TASK(TASK 1)](https://docs.google.com/document/d/1R1tnvH2jkCFF1XHqzBLoE9D6ylUgCcdSVJom2gl5d1A/edit) for the Software Engineer Test Questions for Frontend.

## Table of contents

- [Payment Flow - Sofware Engineer Task 1](#payment-flow---sofware-engineer-task-1)

  - [Table of contents](#table-of-contents)

  - [Overview](#overview)

    - [The challenge](#the-challenge)

    - [Screenshot](#screenshot)

    - [Links](#links)

  - [My process](#my-process)

    - [Built with](#built-with)

    - [Useful resources](#useful-resources)

  - [Author](#author)

## Overview

### The challenge

Candidates should implement the design flow in the [link](<​​https://www.figma.com/file/Cz5bFXR6FuYl1N0YcGxwvJ/Frontend-Dev-Task-(Payment-Flow)?node-id=0%3A1>) with React JS.

### Screenshot

![PERSONAL INFO](./src/personal.png)

![BILLING INFO](./src/payment.png)

![CONFIRM PAYMENT](./src/purchase.png)

![PURCHASE COMPLETE](./src/complete.png)

### Links

- Solution URL: [My Solution](https://github.com/Multimarix/payment-flow)

- Live Site URL: [Live Site Demo](https://payment-flow-task.netlify.app/)

## My process

### Built with

- Semantic HTML5 markup

- CSS custom properties

- Flexbox

- CSS Grid

- [React](https://reactjs.org/) - JS library

- [Styled Components](https://styled-components.com/) - For styles

### Useful resources

- [OverAPI(Cheatsheets)](https://overapi.com/) - This help me look up methods and functions and what they do quickly.

## Author

- Github - [DEE](https://www.your-site.com)

- Frontend Mentor - [@Multimarix](https://www.frontendmentor.io/profile/Multimarix)

- LinkedIn - [Don AKhirebhulu](https://www.linkedin.com/in/don-akhirebhulu-675082242/)