jrmedina / deadstock-v1

Deadstock is an application that brings sneaker heads together to buy, sell, and show off their collection without the hassle of a middleman!

Deadstock is an application that brings sneaker heads together to buy, sell, and show off their collection without the hassle of a middleman!

Gain further understanding and practice with React fundamentals

Create an Express server will handrolled data that allows the use of CRUD methods

Use Cypress to test the a user's experience end to end

Create a multi-page UX using Router

🛸 Deployed Pages:

Deadstock
username: dsJosh
password: dogs

Deadstock API
ENDPOINTS:
/inventory for all shoes
/users for all users
/inventory/:id for detailed view

⚡️ Getting Started:

To simply experience the application visit the links listed above

For the curious developer:

1. Fork this repository and this repository for the API
2. Clone both of the repositories to your local machine
3. cd into the repository
4. Once in the repository, run npm install and npm i -g nodemon for the API (may need to run sudo npm i -g nodemon)
5. After installation, run npm start and nodemon index.js for the API
6. A live server for thr client should now be available at http://localhost:3000/ and http://localhost:3001/ for the server
7. Paste this addresses into your browser

🧑🏻‍💻 Contributor(s):

• Joshua Medina
  LinkedIn
  Github
  Portfolio

🚶🏻‍♂️ Walkthrough:

new_recording_-_9_25_2022._9_01_50_pm.720p.mp4

new_recording_-_9_25_2022._9_25_56_pm.720p.mp4

✍🏼 Planning:

• See where it all began...
• Project Board

🎬 Features:

User:

• Ability to see recently added shoes in a hero
• Filter by brand, color, size, and SKU
• Login and see personal inventory
• Delete, edit, and create listings
• See all details related to a posting
• Have a method to contact the seller by direct email
• Contact contributor for assistance

Developer:

• Lighthouse score of 100%
• End to End testing with mulitple UX in mind
• Provide different React Router routes
• Proper error handling for all "Sad Paths" of a UX
• CRUD functionality for requests to last
• A consistent, modular file structure
• PropTypes to ensure data being passed is consistent
  

🔮 Future Extensions:

• Develop functionality for new users to sign up and create a profile
• Expand on the CreatePost form to have details about trade options
• Dark Mode accessibility
• Filter by date added, price, and alphabet
• TypeScript for developer empathy
• Global State Management

💿 Technologies:

• React
• Express
• Cypress
• React Router
• JavaScript
• HTML
• CSS
• NPM
• Github

🕵🏻‍♂️ Project Specs:

Turing - Showcase