Intern2GrowLocked
Certificate of completion
Your Name
successfully completed the React.js Developer virtual internship
INTERNSHIP TASKS
Glad to meet you here. In this page, you can navigate between the different tasks of your internship.
React.js Developer
Work on a real-world e-commerce React application by fixing bugs, implementing missing features, optimizing UX patterns, and managing state — all tasks mirror professional frontend development workflows.
ReactJavaScriptZustandTailwind CSSReact Router
Your progress0 of 12 tasks submitted
1: Onboarding
Get familiar with the e-commerce React application, fork and clone the repository, install dependencies, and explore the project structure. Understand the tech stack (React, Zustand, Tailwind CSS, React Router) and how you'll be contributing to it.
Explore Now2: Implement Full Search, Filters, Sorting, and Pagination
Wire the Products Listing page to use the filterProducts() function from the service layer instead of manually loading all products. Implement search, category filters, sorting, and pagination that all work together.
Explore Now3: Store Filters in URL Query Parameters
Persist search, filters, sorting, and pagination state in URL query parameters so users can share links and use browser back/forward navigation.
Explore Now4: Implement Full Wishlist Functionality
Complete the wishlist feature so users can add, remove, and manage items in their wishlist, including toggle functionality and 'Move to Cart' support.
Explore Now5: Implement Product Comparison Feature
Build a full comparison feature that highlights differences between two selected products in a side-by-side table with visual indicators.
Explore Now6: Add Product Reviews to Product Details
Display customer reviews on the Product Details page using mock review data, including star ratings, comments, dates, and aggregate statistics.
Explore Now7: Add Checkout Form Validation
Implement client-side validation for the checkout form, including required fields, email/phone format validation, inline error messages, and submission prevention.
Explore Now8: Fix Cart Quantity Bug
Fix the bug in the cart where product quantity can reach 0 or become negative by adding a minimum quantity check to the updateQuantity function.
Explore Now9: Replace Spinner with Skeleton Loading
Replace the loading spinner in the Products Listing page with skeleton loading UI (content placeholders) using animated Tailwind classes for a more polished user experience.
Explore Now10: Trigger Toast Notifications on Cart and Wishlist Actions
Implement toast notifications using react-hot-toast for cart and wishlist actions to provide immediate, dismissible feedback to users.
Explore Now11: Persist State in Local Storage
Configure the Cart, Wishlist, and Comparison stores to persist their state in localStorage using Zustand's persist middleware so data is not lost on page refresh.
Explore Now12: Deploy The Project
Deploy the completed e-commerce application to a hosting service (such as Vercel, Netlify, or GitHub Pages) and submit the live URL as your final deliverable.
Explore NowSubmit every task, then send the final form to receive this certificate.