Aranis is a highly scalable, feature-rich full-stack e-commerce platform built to deliver a seamless modern shopping experience and a powerful administrative backend. Designed with performance and aesthetics in mind, it features dynamic product filtering, real-time live chat, comprehensive inventory management, and built-in marketing tools like global offers and gift cards.
Frontend (Storefront & Admin Client)
- Framework: Next.js 15 (React 19) utilizing the App Router for server-side rendering (SSR) and advanced caching.
- Styling & Animation: Tailwind CSS combined with Framer Motion for highly interactive, buttery-smooth micro-animations and layout transitions.
- UI Architecture: Radix UI primitives and Shadcn UI for accessible, customizable, and headless components.
- State Management: Jotai (atomic state management) and React Context.
- Forms & Validation: React Hook Form coupled with Zod for robust client-side validation.
- Rich Text Editing: Plate.js integrated for writing rich product descriptions and dynamic content.
- Real-time Communication: Socket.io-client for live customer support chat.
Backend (API Server)
- Core Environment: Node.js, Express.js
- Language: TypeScript for strict type-safety and maintainability.
- Database: MongoDB (via Mongoose ODM) with complex aggregations for product filtering.
- Caching Engine: Redis for fast data retrieval and rate-limiting.
- Real-time Engine: Socket.io for bi-directional live chat and notifications.
- Authentication: Passport.js supporting both Google OAuth20 and secure Local Strategy (JWT-based).
- File Storage: AWS S3 and Cloudinary integrations for optimized image and media delivery.
- Background Tasks: Node-cron for scheduled jobs and database maintenance.
- Document Generation: PDFKit for dynamic invoice and receipt generation.
- Email Delivery: Nodemailer for transactional emails (OTPs, order confirmations).
User Experience (Storefront)
- Premium Responsive UI: Highly polished, mobile-first design with complex animations, dynamic headers, and skeleton loaders.
- Advanced Product Filtering: Real-time filtering by categories, sizes, colors, and prices without page reloads.
- Dynamic Cart & Wishlist System: Persistent shopping cart and wishlist with strict stock validation, auto-syncing, and variant selection (color/size).
- Secure Authentication: Seamless Email/password login with OTP verification and social login (Google OAuth).
- Checkout & Order Tracking: Streamlined checkout process with integrated order tracking and downloadable PDF invoices.
- Interactive Reviews: Verified users can leave detailed reviews and ratings for products.
- Real-time Customer Chat: Integrated live chat widget allowing users to talk directly to admins for immediate support.
- Gift Cards & Global Offers: Support for purchasing/applying gift cards, global promotional popup offers, and discount coupons.
- Restock Requests: Users can subscribe to "out of stock" products to be notified when they become available.
Admin Dashboard (Back-office)
- Comprehensive Product Management: Full CRUD capabilities for products, supporting multiple variants (color, size, stock) and drag-and-drop multi-image uploads.
- Order Lifecycle Processing: Full control over order management (Pending, Processing, Shipped, Delivered, Cancelled) with automated status emails and PDF invoice generation.
- Live Chat Support Portal: A dedicated real-time chat interface inside the admin panel to manage multiple customer conversations simultaneously.
- Marketing & Promotions Control: Tools to manage Hero Banners, Mini Banners, Popup Banners, Global Offers, and dynamic discount Coupons.
- Analytics & Stats: Interactive dashboard charts visualizing sales trends, revenue generation, and customer interest data.
- Dynamic Site Settings: Ability to update navigation menus, logos, contact information, delivery charges, and SEO metadata dynamically from the dashboard.
- Size Guides: Dynamic size guide creation and attachment to specific product categories.
Highlights for Portfolio
- Performance Optimized: Leverages Next.js advanced routing cache,
next/imageoptimization, and Redis backend caching to achieve blazing-fast load times and optimal Core Web Vitals.
- Robust Security: Implements JWT-based authentication, strict rate limiting, Helmet, HPP (HTTP Parameter Pollution protection), and comprehensive data sanitization to prevent common vulnerabilities.
- Scalable Modular Architecture: The backend strictly follows a modular architecture (
/src/app/modules), separating concerns (routes, controllers, services, models) for unparalleled code maintainability and scalability.
- SEO Ready: Server-side rendered product pages with dynamic metadata, ensuring high visibility on search engines.
