EverUse

Welcome to the front end repository for EverUse! EverUse is a web application built for the Turing School of Software and Design's Mod 4 Capstone project. Read more about project requirements:https://mod4.turing.edu/projects/capstone/

Table of Contents

1. About The Project
   • Built With
2. Getting Started
   • Front End Repository
   • Back End Repository
3. Testing
4. Technical Solutions
5. Roadmap
Project Contributor Contact Info
6. Acknowledgments

About The Project

EverUse is a living breathing company that upcycles and repurposes discarded materials into jewelry and accessories. We aim to enhance the company's exposure and functionality by providing them with a full-stack web application.

In order to meet the business needs of this small company, we created a front end application focused on streamlining the user experience by beautifully displaying products and allowing buyers to easily place orders. After an order is submitted, the customer receives a detailed confirmation email, and the sellers receive an emailed order form containing the customer's contact information and requested items. Payment is handled externally, in line with the businesses current practices.

This application was built with scalability and longevity in mind, and we are proud to have created a website tailored to the company's specific needs.

See it in action

Github repositories:

• Front End:
• Back End:

(back to top)

Built With

• 
• 
• 
• 
• 
• 
• 

(back to top)

Getting Started

To demo EverUse on your local machine, follow these steps:

Front End Repository

1. Clone down this repository
2. cd into the directory
3. Run npm i to install dependencies
4. Run npm start to view live in your browser

Back End Repository

1. Clone the back end here
2. Follow instuctions in the back end repo README

(back to top)

Testing

We utilized Cypress for all end-to-end user testing. Run npm run cypress open to view and run the test suite. All tests passing at time of writing.

(back to top)

Technical Solutions:

As part of the Capstone project requirements, the EverUse front end team challenged ourselves to learn new technologies within the 14-day design and development process. We selected the following based on the challenges we anticipated facing while building out our MVP, and adjusted our choices to reflect our individual and team learning goals as well as blockers that came up during the course of working on the project.

GraphQL

• Challenge: Flexiblity of network requests
• Solution: GraphQL allowed us to use queries to obtain the exact data we needed at every stage of the application, streamlining our network request process.

React Swiper

• Challenge: Ease of navigation on mobile
• Solution: This application was designed with a mobile-first mindset. Because of the relatively small inventory size at this time, the design of the Products section was intentinoal, but the carousel feature limited navigability on mobile devices. We chose to use React Swiper to create a seamless scrolling experience, so all users can view inventory with ease.

React Cookies

• Challenge: Data persistence without an assumed user
• Solution: Because of the small scale of our MVP, user data was not created on the back end of the application. We implemented cookies to allow the current user to preserve their cart on page refresh.

(back to top)

Roadmap

Additional features, functionality, and potential refactors:

• Refactor with TypeScript for type checking
• Create a "Continue Shopping" button that appears on every page
• Create a user profile with login that allows users to view their previous orders
• Create an admin profile and login that allows business owners to edit inventory details, including adding new products
• Add estimated shipping costs to Request Summary sections

(back to top)

Project Contributor Contact Info

• Alec Livaditis:
• Taranveer Singh:
• Jamie Caudill:
• Rachel Prather:

(back to top)

Acknowledgments

• Special thanks to EverUse UpCycled Products

(back to top)