MERN Stack Intern
Technical Assessment
Project: EasyMart - Grocery E-commerce Platform
Reference Design - Build this page with full CRUD functionality
Overview
Build a fully functional single-page grocery e-commerce application called
EasyMart. This assessment evaluates your ability to build a complete MERN
stack application with proper state management, API design, and deployment
skills.
Time Limit
48-72 hours from receiving this assignment
Tech Stack Requirements
Layer Technology Options
Frontend [Link] or [Link]
State Management Redux Toolkit, Zustand, or React Context (mandatory)
Styling Tailwind CSS, CSS Modules, or Styled Components
Backend [Link] with [Link]
Database MongoDB with Mongoose
Language JavaScript or TypeScript
Frontend Requirements
UI Implementation
1. Replicate the provided design (EasyMart grocery store page) as
closely as possible
2. Header with logo, location selector, search bar, cart icon with item
count, and login button
3. Product grid displaying: product image, name, price per unit, sale
price, original price (strikethrough), and stock status
4. Responsive design that works on desktop and mobile
State Management
5. Mandatory: Use Redux Toolkit, Zustand, or React Context for
global state management
6. Manage cart state globally (items, quantities, total count)
7. Manage product filtering/search state
8. Demonstrate proper separation of concerns between UI and state logic
Core Features
9. Product Listing: Fetch and display all products from the API
10. Search: Filter products by name in real-time
11. Category Filter: Filter products by category (e.g., Orange, Strawberry,
Lime)
12. Add to Cart: Add products to cart with quantity management
13. Cart Display: Show cart item count in header, with a cart
modal/page showing all items
Backend Requirements
API Endpoints
Create a RESTful API with the following endpoints. All endpoints should be
testable via Postman:
Method Endpoint Description
GET /api/products Get all products (with optional query
params for search/filter)
GET /api/products/:id Get single product by ID
POST /api/products Create new product (Postman only)
PUT /api/products/:id Update product (Postman only)
DELETE /api/products/:id Delete product (Postman only)
Product Schema
Each product should have the following fields:
Field Type Description
name String Product name (required)
category String Product category e.g., Orange,
Strawberry, Lime
pricePerUnit String Price per unit e.g., "$2.71/lb"
salePrice Number Current sale price
originalPrice Number Original price before discount
stockLeft Number Quantity in stock
image String Image URL
Database Requirements
1. Use MongoDB (local or MongoDB Atlas)
2. Implement proper Mongoose schemas with validation
3. Seed the database with at least 10 sample products
Bonus Features (Optional)
Implementing these features will earn extra points:
1. Authentication: JWT-based login/register with protected routes
2. Price Sorting: Sort products by price (low to high, high to low)
3. Pagination: Implement pagination for product listing
4. Cart Persistence: Persist cart data in localStorage or database
5. Image Upload: Allow image upload when creating/updating products via
API
6. Loading States: Skeleton loaders or spinners during API calls
7. Error Handling: Proper error boundaries and user-friendly error messages
8. TypeScript: Using TypeScript throughout the project
Deployment Requirements
1. Frontend: Deploy to Vercel, Netlify, or similar platform
2. Backend: Deploy to Render, Railway, or similar platform
3. Database: Use MongoDB Atlas for cloud database
4. Provide live URLs for both frontend and backend
Submission Requirements
5. GitHub Repository: Public repo with clean commit history
6. [Link]: Include setup instructions, environment variables,
and API documentation
7. Postman Collection: Export and include your Postman collection for API
testing
8. Live Demo: Working URLs for deployed application
9. Video Walkthrough (Optional): 3–5-minute Loom video explaining
your implementation
Evaluation Criteria
Criteria Weight Focus Areas
Code Quality & Structure 25% Clean code, proper
folder structure,
naming conventions
State Management Implementation 20% Proper use of chosen
state management
tool
API Design & Backend Logic 20% RESTful design, error
handling, validation
UI/UX & Design Accuracy 15% Matches
reference
design,
responsive, user-
friendly
Deployment & Documentation 10% Working
deployment, clear
README
Bonus Features 10% Extra
features
implemente
d
Important Notes
Code Quality: Write clean, readable, and well-organized code
No Plagiarism: Your code must be original. We will check for copied code.
Ask Questions: If anything is unclear, reach out for clarification
Focus on Fundamentals: We value working code over fancy features. Make
sure the core functionality works perfectly.
Good luck! We look forward to seeing your submission.