Alice is mad over coffee and she loves to try out each type of coffee. She becomes so addictive that she decides to open an online e-commerce website for premium coffee beans. Alice goes online and collects data about various species. She has all the data she needs to start an e-commerce website. But her frontend skills are a bit weak and it would take a while for her to learn stuff. She reaches out to you to help her with a website that will run smoothly on all platforms. The website needs to be themed around coffee and user experience should have a WOW factor as Alice believes in first impressions.
Alice exposes her data through an API and shares a swagger spec with you. The API details are
Dummy API Base URL: https://alicecoffeeshop.devtesting.live
Swagger Doc: swagger.json
Swagger UI: https://alicecoffeeshop.devtesting.live/swagger/index.html
You need to create a website that consumes the API and has the following functionalities
- List Coffee bean species on the landing page. Listing should include the name, a resized image of the species, and the price of the species in USD ($), the price is the unit price of 500gms.
- Clicking on any list item should open up a view that helps the user to read about the coffee species and add units of 500gms each to their cart.
- After adding coffee beans, users can proceed to order with their details like name, address, email, and phone number. Payment will be done on delivery to delivery personnel who will be carrying a card machine along with them. It can also be done with cash.
For this challenge, cart item details can be cached on the client-side.
Constraints and Guidelines
- The website should not take more than 4 seconds for any operation.
- The UI is not necessary to be fancy but should be good looking, you can follow the well-known design guideline such as Material Design.
- Your solution should have a Dockerfile and a corresponding docker-compose. Problem reviewers should be able to start the app with a simple command: docker-compose up -d
- Please use the forums to ask any doubts.
- We will judge your submission based on the requirements being fulfilled, so as long as the requirements are met, you would be rewarded with points for that particular problem.
- Minimal code quality is expected, for the reviewer to review the submission and go through your code
- Obvious and deliberate code obfuscation will be rejected.
- Collaborating/Cheating in any way with anyone else (member or not) during a rated event is considered cheating.
- An excessive amount of unused content should be avoided.
- Code Readability is expected with necessary comments, indentation, and somewhat refactored code (as much as possible)
Whatever you feel like using.