Giter VIP home page Giter VIP logo

accenturetest's Introduction

react-live-coding-test

Follow these steps

Application Setup (DO THIS FIRST)

  • Fork this repository into your GitHub account (You can create a GitHub account if you don't have one)
  • Clone the repository from your repository
  • Checkout main branch
  • Install dependencies
  • To start development use npm start

Project Overview

This project is about a frontend ecommerce application. the expected time to finish the project is around 12 hours (4 days, 3 hours each).

Required knowledge

  1. Tailwind
  2. Typescript
  3. NextJS
  4. Docker (BONUS)
  5. Any Free deployment platform Experience (Bonus)

we are open to any /components if it is needed in the test.

IMPORTANT

After implementing each feature for each test in the respective branch, create a Pull Request and merge to the main branch, then delete the merged branch.

First Test - Landing page

  1. create a new branch name - feature/landing-page
  2. create a clone of this page https://www.lazada.com.my/
  3. use this when product details is needed : https://fakestoreapi.com/
  4. this page should be in http://localhost:3000/

PS: clone as similiar as you can. As long as you are able to showcase your skill.

Second Test - Product listing

  1. create a new branch name - feature/product-listing
  2. use https://fakestoreapi.com/ as API for listing.
  3. create filterable, sortable and paginated table.
  4. the products can be filtered by categories - list of categories can be found at https://fakestoreapi.com/products/categories
  5. has floating button that when clicked, shows the current items in cart. (data is retained even if the page is refreshed).
  6. there will also be a quick buy button that redirects the user to receipts page.
  7. this page should be in http://localhost:3000/products

Third Test - Receipts page

  1. create a new branch name - feature/receipts based on feature/product-listing after you are done with second test.
  2. user will be redirected to this page once user click quick buy at http://localhost:3000/products
  3. user should be presented with a the items in the cart.
  4. user should be able to view a pie chart of the price of the items.
  5. user should be able to download a pdf of the receipts.
  6. this page should be in http://localhost:3000/receipts

Fourth test - Dashboard

  1. create a new branch name - feature/dashboard
  2. use https://randomuser.me/api/ as API for showing user profile.
  3. try to utilize every field in the result from the response.
  4. this page should be in http://localhost:3000/dashboard

Bonus

  1. Dockerize this application.
  2. Deploy this application online and share the link for viewing.

accenturetest's People

Contributors

sumitkumar-frontenddeveloper avatar

Watchers

James Cloos avatar sumit kumar 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.