Page 1 of 6
gram-backend System Requirements Document
Introduction
The purpose of this document is to outline the system requirements for the "gram-backend" project. The project aims to replace the existing Shopify backend with a scalable MERN (MongoDB, Express, React, Node.js) system. This transition will integrate direct Razorpay payments and Shadowfax shipping, while maintaining a React frontend. The architecture must be designed to scale efficiently without requiring a rewrite as order volumes increase.
System Overview
The gram-backend project will transition from a Shopify-based backend to a custom-built MERN stack solution. This change will provide greater control over the data model, enable custom logic implementations, and eliminate vendor lock-in. The system will support product catalog management, order processing, payment integration, shipping logistics, and content management.
Source Content Inventory
- Product Catalog: MongoDB collection for products and variants.
- Order Management: MongoDB collection for orders with status tracking.
- Payment Integration: Razorpay for direct payment processing.
- Shipping Integration: Shadowfax with a pluggable courier registry pattern.
- Content Management: Claude API for AI-generated blog content.
- Review System: MongoDB collection for product reviews.
Page 2 of 6
Functional Requirements as Story Points
- As a User, I should be able to view the product catalog.
- As a User, I should be able to place an order and receive a tracking link.
- As a User, I should be able to make payments directly through Razorpay.
- As an Admin, I should be able to manage product inventory.
- As an Admin, I should be able to moderate product reviews.
- As an Admin, I should be able to generate blog content using the Claude API.
- As a User, I should be able to subscribe to newsletters.
- As a User, I should be able to track my order status.
User Personas
- User: General customers who browse products, place orders, and track shipments.
- Admin: Backend operators who manage inventory, orders, reviews, and content.
Core User Flows
- User browses product catalog -> selects product -> adds to cart -> proceeds to checkout -> completes payment via Razorpay -> receives order confirmation and tracking link.
- Admin logs into the system -> updates product inventory -> reviews and moderates user reviews -> generates blog content -> publishes approved content.
Page 3 of 6
Visuals Colors and Theme
- primary: #1A73E8 (Deep Blue)
- primary_light: #E8F0FE (Light Blue)
- secondary: #FF6F61 (Coral)
- accent: #FFD700 (Gold)
- highlight: #FFA500 (Orange)
- bg: #FFFFFF (White)
- surface: rgba(250, 250, 250, 0.8)
- text: #333333 (Dark Gray)
- text_muted: #777777 (Light Gray)
- border: rgba(200, 200, 200, 0.5)
Signature Design Concept
Interactive Product Journey
The homepage will feature an interactive product journey map. As users scroll, they will see a visual representation of a product's lifecycle: from selection to checkout, payment, and delivery. Each stage will animate with smooth transitions using motion/react, providing a dynamic storytelling experience. Users can hover over each stage to see detailed information and click to explore related features.
Page 4 of 6
Landing Hero Motion Brief
The landing hero will depict a product being selected, processed through payment, and delivered to the user. The animation will loop every 10 seconds, showing the transformation of the product from a catalog item to a delivered package. The animation will use motion/react for smooth transitions and will be responsive to different screen sizes.
Interaction Model & Motion Direction
- Intended Interaction Model: Animated
- The landing page will feature moderate scroll-triggered reveals and hover transitions. Interactive elements will have spring physics for a polished user experience.
Non-Functional Requirements
- The system must be scalable to handle increased order volumes without a complete rewrite.
- Ensure high availability and reliability of the backend services.
- Maintain data security and integrity across all transactions.
Page 5 of 6
Tech Stack
- Frontend: React
- Backend: Node.js, Express
- Database: MongoDB (Atlas)
- Payment Gateway: Razorpay
- Shipping Integration: Shadowfax API
- Content Generation: Claude API
- Caching and Queue: Redis, BullMQ
- Containerization: Docker
- CI/CD: Jenkins
- Cloud Services: AWS (EC2/ECR/S3)
Assumptions and Constraints
- The system will initially launch in the Delhi NCR region.
- The architecture must support scaling from low to high order volumes.
- The system will not support multi-vendor marketplaces or subscription services in the initial version.
Page 6 of 6
Glossary
- MERN: MongoDB, Express, React, Node.js
- API: Application Programming Interface
- JWT: JSON Web Token
- SEO: Search Engine Optimization
- GMV: Gross Merchandise Volume
This document outlines the requirements and design for the gram-backend project, ensuring a robust and scalable solution for the transition from Shopify to a custom MERN stack backend.
No comments yet. Be the first!