Projects
Fujivo - Premium Japanese Watches
Fujivo is a modern, high-performance, and scalable full-stack e-commerce web application designed specifically for selling authentic Japanese lifestyle products and premium watches. The platform provides a seamless and visually stunning shopping experience for users, while offering a robust backend for admins to manage products, categories, brands, inventory, and orders.
✨ Key Features & Functionalities
1. Dynamic Product & Category Management
- Advanced Filtering: Users can seamlessly browse and filter products by categories, brands, new arrivals, and featured items.
- Dynamic Routing: Beautifully rendered individual product pages using dynamic slugs for optimized SEO and fast loading.
2. Secure Authentication & Authorization
- Secure user registration and login using JWT with both Access & Refresh Tokens for persistent sessions.
- Email OTP verification using Nodemailer for secure account creation, password resets, and user verification.
- Role-based access control (RBAC) securely separating standard Users and Admin functionalities.
3. Streamlined Order & Checkout Process
- Seamless order placement system allowing both guest users and logged-in users to securely checkout.
- Dedicated order history dashboard for users to track their past and current purchases.
- Strict backend validation to ensure precise pricing and stock accuracy during checkout.
4. Rich User Experience (UX) & Animations
- Highly interactive and premium user interface built with Radix UI and Tailwind CSS v4.
- Smooth micro-animations and page transitions using Framer Motion to highlight the premium nature of the products.
- Fully responsive design optimized for seamless browsing across mobile, tablet, and desktop devices.
5. Comprehensive Admin Dashboard
- Admins have full CRUD capabilities to securely create, update, and delete products, categories, and brand listings.
- Real-time order tracking dashboard allowing admins to view details and update order statuses such as Pending, Processing, and Shipped.
- Centralized control over featured and new arrival product placements on the storefront.
6. Seamless Media Management
- Integrated Cloudinary for secure, fast, and optimized image uploads directly from the admin panel.
- Efficient delivery of high-resolution watch and lifestyle product images without compromising frontend performance.
🛠️ Technologies Used
Frontend (Client-Side)
- Framework: Next.js v16, React v19
- Styling: Tailwind CSS v4, Radix UI
- State Management & Data Fetching: TanStack React Query
- Animations: Framer Motion
- Forms & Validation: React Hook Form, Zod
Backend (Server-Side)
- Runtime & Framework: Node.js, Express.js v5, TypeScript
- Database & ORM: MongoDB via Prisma ORM
- Authentication: JWT with Access & Refresh Tokens
- Media Storage: Cloudinary
- Email Services: SMTP with Nodemailer
🧠 Key Challenges & Solutions
- Robust State & Token Management: Implemented a secure authentication flow using both short-lived access tokens and long-lived refresh tokens, ensuring users stay securely logged in without friction while navigating the store.
- Complex Data Relationships: Utilized Prisma ORM with MongoDB to efficiently model and query complex relationships between products, multiple categories, brands, and user orders, ensuring fast API response times.
- Performance Optimization: Optimized Next.js rendering strategies and leveraged Cloudinary's dynamic image delivery to ensure fast page load times and maintain high Lighthouse scores, even with a media-heavy catalog of premium watches.
Orlior
Orlior is a modern, high-performance, and scalable full-stack e-commerce web application designed specifically for selling premium battery-free E-Ink iPhone Smart Cases. The platform provides a seamless and visually stunning shopping experience for users, while offering a robust backend for admins to manage products, dynamic bundle pricing, stock, and orders.
✨ Key Features & Functionalities
1. Dynamic Product & Variant Management
- Color-Image Mapping: Dynamic UI that switches the main product image instantly when a user selects a specific color variant.
- Model Selection: Users can choose specific iPhone models (e.g., Pro, Pro Max), which dynamically adjust the base price.
2. Advanced Bundle Pricing Logic
-
Implemented a smart checkout algorithm where discounts are automatically
applied based on quantity:
- 1 Case: Standard Price
- 2 Cases: 10% Total Discount
- 3 Cases: 15% Total Discount
- Strict backend validation prevents frontend cart manipulation and ensures accurate pricing during checkout.
3. Secure Authentication & Authorization
- Secure user registration and login using JWT with Access & Refresh Tokens.
- Email OTP verification using Nodemailer for account creation and password resets.
- Role-based access control supporting User and Admin roles.
4. Rich User Experience (UX) & Animations
- Highly interactive and premium user interface built with Radix UI and Tailwind CSS.
- Smooth micro-animations and page transitions using Framer Motion and GSAP.
- Fully responsive design optimized for mobile, tablet, and desktop devices.
5. Comprehensive Admin Dashboard
- Admins can create, update, and delete products, categories, and brands.
- Real-time order tracking and status updates including Pending, Processing, Shipped, and Delivered.
- Integrated Recharts for visualizing sales data and analytics.
6. Seamless Media & Review Management
- Integrated Cloudinary for secure, fast, and optimized image uploads.
- Users can leave ratings and upload images for product reviews.
- Reviews can be marked as Verified Purchase to increase customer trust.
🛠️ Technologies Used
Frontend (Client-Side)
- Framework: Next.js v16, React v19
- Styling: Tailwind CSS v4, Radix UI
- State Management & Data Fetching: TanStack React Query
- Animations: Framer Motion, GSAP
- Forms & Validation: React Hook Form, Zod
- Data Visualization: Recharts
Backend (Server-Side)
- Runtime & Framework: Node.js, Express.js v5, TypeScript
- Database & ORM: MongoDB / PostgreSQL via Prisma ORM
- Authentication: JWT with Access & Refresh Tokens
- Media Storage: Cloudinary
- Email Services: SMTP with Nodemailer
🧠 Key Challenges & Solutions
- State Synchronization: Ensured the cart state remains synchronized across multiple tabs and persists seamlessly using React Query and local storage.
- Complex Pricing Algorithm: Built a secure backend pricing calculation system that combines dynamic base prices based on the selected phone model with bundle discount rules, ensuring payment amounts cannot be manipulated on the client side.
- Performance Optimization: Optimized Next.js rendering and Cloudinary image delivery to ensure fast page load times and maintain high Lighthouse scores despite heavy product galleries.
EvenTora
EvenTora is a robust, full-featured event management web application developed by Team #4b.
Designed to streamline how people host, discover, and participate in events, EvenTora supports a wide range of scenarios — from free community meetups to private, paid workshops.
Built with a strong focus on security, scalability, and user experience, the platform is protected by JWT-based authentication and offers advanced features for both hosts and participants.
🔐 Key Features
✅ Secure Authentication & Role-based Access
JWT-based authentication for session management
Role-based access control with User, Host, and Admin levels
Middleware-protected routes to prevent unauthorized access
📅 Event Creation & Hosting
Hosts can create public or private events
Events may be free or have a fee-based entry
Custom fields for date, time, location, and detailed descriptions
Cover image upload support using Cloudinary
🧍♂️🧍♀️ Participant Management
Manual approval flow for private or paid event join requests
Hosts can ban, unban, or invite specific users
Track total participants and monitor their payment status
💳 Payment Integration
Integrated with a secure payment gateway for processing fees
Tracks successful transactions for hosts and admins
Auto-generates revenue reports and monthly earnings
🔍 Event Discovery & Exploration
Explore upcoming and featured events from the homepage
Filter events by type (Public/Private), pricing (Free/Paid), and category
Search functionality for quick event lookup
📊 Admin Dashboard & Moderation
Dedicated admin panel to monitor users, events, and payments
Admins can approve or reject events to ensure platform quality
Visual insights with:
• Summary cards
• Revenue trend charts
• User growth statistics
Manage reported users and moderate flagged content
Cyclify – Bicycle E-Commerce Platform
Cyclify is a modern, full-featured bicycle e-commerce application that offers a seamless shopping experience for cycling enthusiasts.
Developed with a focus on performance, usability, and security, Cyclify provides both customers and admins with robust tools to manage product listings, orders, and payments effortlessly.
The platform is built using React.js, Redux, Ant Design, and TypeScript on the frontend, with a powerful backend powered by Node.js, Express, and MongoDB.
🚴♂️ Key Features
✅ Secure Authentication & Role-based Access
User authentication with login and registration
Role-based access with separate Admin and Customer dashboards
Protected routes to prevent unauthorized access
🛍️ Product Browsing & Shopping
Customers can explore a wide range of bicycles with detailed product descriptions
Dynamic search, filtering, and category-based browsing
Add to cart and update quantities directly from the product page
💳 Payment Integration
Integrated with ShurjoPay for secure online payments
Transaction tracking for both customers and admins
Order confirmation after successful payment
📦 Order Management & Tracking
Users can view their order history and track delivery status
Admins can update order statuses (e.g., Pending, Shipped, Delivered)
Detailed view of each order with product breakdown and payment info
🛠️ Admin Dashboard
Admins can manage all products — add, edit, or delete bicycles
Order overview with detailed insights and customer info
Inventory management with real-time updates
Portfolio - Website
Portfolio Website is a personal web application designed to showcase my skills, projects, and professional experience in a clean, modern, and responsive layout.
The website highlights my full stack development expertise through detailed project presentations, tech stack descriptions, and interactive elements to engage visitors and potential employers.
Built with a strong emphasis on usability, performance, and professional design, the portfolio demonstrates my commitment to quality and attention to detail.
🎯 Key Features
💻 Project Showcase
Detailed presentation of completed projects with descriptions, tech stack, and live/demo links
Projects are categorized and ordered to highlight my best work first
Interactive UI elements to enhance user experience
📝 Professional Experience & Skills
Clear, concise display of my educational background, certifications, and work experience
Showcasing skills with proficiency levels and relevant tools
📞 Contact & Social Links
Easy-to-use contact form for direct communication
Links to professional social profiles like LinkedIn, GitHub, and Twitter
⚡ Performance & Responsiveness
Optimized for fast loading and smooth navigation
Fully responsive design adapting to desktops, tablets, and mobile devices
MixHub - Blog Platform
Mixhub is a dynamic and user-friendly blog platform designed to deliver diverse content across multiple categories such as fashion, food, travel, parenting, and more.
Developed to enhance content discovery and engagement, Mixhub offers rich browsing features, social sharing options, and wishlist functionality, creating a seamless reading experience for users.
The application focuses on performance and interactivity, built with React.js, React Router, and Tailwind CSS, with real-time data support via Firebase.
📰 Key Features
🔍 Blog Discovery & Filtering
Users can browse blogs by category including fashion, travel, recipes, and more
Built-in search functionality for quick blog lookup
Category filter for focused content exploration
🌟 Featured & Recent Sections
Homepage highlights top-ranked featured blogs
Recent section displays the latest blog posts for returning users
Each blog shows the author’s name and profile image for added credibility
📑 Wishlist Functionality
Users can add blogs to a personal wishlist for later reading
Wishlist section lets users view and manage saved blogs
Improves user retention and reading continuity
📤 Social Sharing
Integrated sharing to platforms like Facebook, Instagram, and Twitter
Boosts blog visibility and engagement beyond the platform
Encourages content virality and broader reach
📱 Responsive Design
Optimized for mobile, tablet, and desktop viewing
Clean and professional UI powered by Tailwind CSS
Fast load times and smooth navigation on all devices
TechRadar
Tech Radar is a modern, easy-to-use gadget discovery platform that helps users explore the latest phones, tablets, laptops, and more — all in one place.
Built to simplify tech decision-making, Tech Radar aggregates product data, real-time pricing, and launch updates in a clean, searchable interface. Users can compare features, check current promotions, and save favorite items for later.
The project is powered by React.js, React Router, and Tailwind CSS on the frontend, with backend services handled by Express.js, MongoDB, and Firebase for authentication and deployment.
📱 Key Features
🔎 Product Discovery & Comparison
Explore a wide range of tech gadgets by category — phones, tablets, accessories, and more
Advanced filtering and search to help users narrow down choices
Product pages with detailed specs, images, and pricing
🆕 Real-Time Updates
Automatically shows new product launches as they’re added
Reflects live price drops and seasonal promotions
Helps users track market trends and timing for best deals
💾 Wishlist & Favorites
Users can save favorite items to a personal wishlist
Accessible wishlist menu to revisit saved products anytime
Improves decision-making and return visits
🌐 Responsive & Accessible UI
Clean, responsive layout optimized for all screen sizes
Accessible navigation and user-friendly interactions
Professional UI styled with Tailwind CSS
🔐 Authentication & Deployment
User authentication using Firebase for a secure experience
Deployed on Vercel for fast, global performance
Version-controlled with Git and GitHub for maintainability
Online Bookstore UI
Online Book Store UI is a clean, intuitive user interface designed to provide a seamless browsing and shopping experience for book lovers.
The application features modern UI elements with an emphasis on readability, navigation, and user engagement. It’s crafted using React.js and Tailwind CSS to ensure responsiveness, performance, and aesthetic appeal.
This frontend-only project showcases key e-commerce design practices including category browsing, book detail views, and add-to-cart interaction — laying the foundation for a full-stack book store experience.
📚 Key UI Features
🔍 Explore Books by Category
Books organized into categories like Fiction, Non-fiction, Business, and Self-Help
Users can browse collections or search for specific titles
Clickable categories and filters for a refined experience
📖 Book Details View
Detailed book pages with title, author, rating, price, and description
Cover image display for quick visual reference
Clear call-to-action buttons for buying or adding to cart
🛒 Add to Cart Flow
Functional add-to-cart button on each book card and detail page
Cart component UI designed to show item list, quantity, and total price
Responsive layout that adapts across devices
🎨 Clean, Professional UI
Minimalist yet modern interface using Tailwind CSS
Interactive components built with React.js
Consistent design language and color palette for a polished feel