ccoyotedev / numan-technical-challenge

Simple purchase flow frontend challenge for my Numan application

Numan Technical Challenge

View Deployed site here.

This is a Next.js + Typescript project bootstrapped with create-next-app.

 

Getting Started

First, install dependencies by running:

yarn

Then, run the development server:

yarn dev

 

Task

Develop a simple purchase flow using a set of web API endpoints. Every step in the flow needs to send events back to the API.

 

Outcome

• I chose to use NextJS due to its ability to easily build statically generated web pages using external data. This is useful for eCommerce sites as it allows for better SEO.

• The website makes use of localStorage + Cookies to store user's orders and personal details.

 

Further improvements

• If I was to take this project further, I would first write some tests to protect the current state of the app from regression. As it stands, I made good use of Typescript to ensure everything is type secure and give myself a more pleasent developer experience.

• I would also add images for each product type, and improve the landing page for a better first impression.

• Add in final check on overview page to check user + order details exist before submitting the order

• Sync personal details into a global state and give users an option to 'remember me' to save data into a cookie.