Profile PictureCodebase Mentor
$0+

React Ecommerce

1 rating
Add to cart

React Ecommerce

1 rating

What is this project about?

This project consists of a GitHub repository with a codebase for a e-commerce marketplace. We encourage you to watch the attached video where we walk you through this project.

In addition to code, the GitHub repository also has 8 issues - 4 bugs and 4 feature requests. Your task as a software engineer is to fix them - just like you would do at a real job. Please see the description of issues below.

Why did we create this project?

We built this project to help aspiring web developers simulate the actual job of a software engineer. We are senior web developers with over 10 years of experience in the industry. Back when we were getting started, we did not have confidence and suffered from a severe imposter syndrome for months. With this project we hope to help aspiring web developers gain the confidence they need to get better job offers and feel comfortable at their jobs from day 1.

To learn more about our motivations and about us please visit our website: https://yep.so/p/jobsimulatordev

Feature Requests

  • Display "Empty Cart" Placeholder on Cart Component (Difficulty: Easy)
    • Description: When a user clicks the cart icon, they see a lot of blank whitespace. Our designers want us to show some content to fill this blank space. We need to complete this using flexbox, since it is our team's preferred CSS method .
  • Sort products by price and release date (Difficulty: Medium)
    • Description: We would like to be able to show products in order of descending price, and descending date.
  • Persist contents of shopping cart on page refresh (Difficulty: Medium)
    • Description: We would like to persist a customer's cart on refresh. You are required to use the localStorage API to build this enhancement.
  • Add product filters functionality (Difficulty: Hard)
    • Description: We would like to be able to narrow down products based on selected filters. This is a complex task. Therefore, as a good product manager would, we split this work into 3 subtasks that you should complete in order:
      • Subtask 1: On filter input interaction, update filter text
      • Subtask 2: On filter input interaction, update ProductTable
      • Subtask 3: "Clear All" button clears the filters

Bugs

  • Fix useEffect infinite loop (Difficulty: Easy)
  • Update Cart Icon with Cart Size (Difficulty: Easy)
  • Cart not closing when user clicks out of Cart (Difficulty: Medium)
  • Compute Subtotal (Difficulty: Medium)


GitHub repository has more information on how to get started on about each issue.

Stay in Touch

We also have a constantly growing community on discord, where you can talk to people who are also doing our projects, ask for help, get career advice from senior developers or simply hang out. Come say hello: https://discord.gg/7cAkUcKbjB

$
Add to cart
76 sales

You'll get access to the GitHub repository with codebase for React-based e-commerce website and a list of 8 issues for you to work through.

You'll work with a codebase similar to what you'd see on a real job
You'll build your confidence by doing the same work that devs in the industry do every day.
You'll solidify your React knowledge
You'll apply the stuff you've been learning on courses to do real work.
We thoroughly review your pull requests
You'll get real-life feedback on your work. It is the same feedback that your team lead would share.
You'll work in safe environment
If you screw up, it won't be reflected in your performance review. It won't affect your promotion or your bonus. It's better to screw up here than on a real job.
You'll get a video guide with solution to all issues
We provide a video guide where a senior web developer goes through all project issues and solves them following industry best practices.
Size
1.97 GB
Copy product URL

Ratings

4
(1 rating)
5 stars
0%
4 stars
100%
3 stars
0%
2 stars
0%
1 star
0%