Skip to content

Instantly share code, notes, and snippets.

@meetkool
Created July 7, 2026 10:49
Show Gist options
  • Select an option

  • Save meetkool/750b00f2c887b71598d0360897537745 to your computer and use it in GitHub Desktop.

Select an option

Save meetkool/750b00f2c887b71598d0360897537745 to your computer and use it in GitHub Desktop.
[BLOG] lol Frontend & Backend: Next.js 16 (App Router), React.js, JavaScript (ES6+), TypeScript, HTML5, CSS3, T
title lol
date 2026-07-07
excerpt Frontend & Backend: Next.js 16 (App Router), React.js, JavaScript (ES6+), TypeScript, HTML5, CSS3, T
tags
blog
quick-post
privacy public

Frontend & Backend: Next.js 16 (App Router), React.js, JavaScript (ES6+), TypeScript, HTML5, CSS3, Tailwind CSS, shadcn/ui, Node.js, Express.js, RESTful API Development, Zod, Next.js API Routes, CRUD Operations, Redux Toolkit, Context API, React Router DOM, Axios. Database & Auth: MongoDB Atlas, Mongoose ODM, Prisma ORM, Clerk Authentication, JWT Authentication & Authorization, Role-Based Access Control (RBAC), Protected Routes, Middleware, PostgreSQL, Cookie-based Authentication, HTTP-only Cookies. AI, Cloud & Deployment: Gemini AI API, Gemini Vision API, OCR-based Text Extraction, Cloudinary, Multer, Vercel Deployment, Render Deployment, Environment Variables, Git, GitHub, API Integration, Razorpay API, Payment Gateway Integration, MVC Architecture, Security Best Practices. State Management & Optimization: Redux Toolkit, Redux Thunk, RTK Query, React Query, Lazy Loading, Code Splitting, Compression Middleware, MongoDB Indexing, Responsive UI Optimization. Experience Software Developer (Personal Project-Based Experience) Tools Used: Git, VS Code, Postman – Developed 4+ production-grade full-stack applications using Next.js, React.js, Node.js, Express.js, MongoDB, and PostgreSQL following scalable modular architecture patterns. – Designed and maintained 60+ RESTful API endpoints supporting e-commerce, AI itinerary generation, course management, multiplayer quiz workflows, and project collaboration systems. – Implemented secure authentication and authorization systems using Clerk, JWT, Role-Based Access Control (RBAC), HTTP-only cookies, and protected middleware. – Built and deployed an AI-powered MERN travel itinerary platform integrating Gemini AI, Gemini Vision API, OCR processing, Cloudinary, and document upload workflows. – Developed intelligent document-processing pipelines supporting PDF, image, OCR text extraction, and AI-generated structured itinerary responses. – Engineered real-time multiplayer Game Matching & Quiz APIs implementing skill-level-based FIFO matchmaking architecture and centralized GameSession management. – Optimized MongoDB schema design, indexing strategies, and backend query architecture, improving API performance and reducing response time by approximately 25–30%. – Implemented randomized quiz generation using MongoDB aggregation pipelines ($sample) ensuring synchronized and fair question delivery across multiplayer sessions. – Built secure answer submission and validation workflows preventing duplicate submissions, unauthorized access, and race-condition-based scoring inconsistencies. – Integrated third-party services including Cloudinary media storage, Gemini AI APIs, and Razorpay payment gateway with secure transaction verification workflows. – Designed end-to-end production workflows including cart, checkout, AI itinerary generation, public itinerary sharing, export systems, and admin management modules. – Deployed full-stack applications and backend APIs on Vercel and Render using environment-based configurations, production deployment practices, and scalable backend architecture. Projects TravelAI – AI Powered Travel Itinerary Generator May 2026 – Present – Built a production-ready AI-powered MERN travel itinerary platform using React.js, Node.js, Express.js, MongoDB, and Gemini AI for intelligent trip planning workflows. – Implemented secure JWT authentication, protected routes, persistent login state, and dashboard-level access control. – Developed AI itinerary generation workflows integrating Gemini AI and Gemini Vision APIs to generate structured day-wise travel plans with budgeting and travel recommendations. – Engineered smart document-processing pipelines supporting flight tickets, hotel bookings, travel PDFs, OCR-based extraction, and AI-driven content parsing. – Built dual itinerary workflows supporting both AI-based document uploads and optional manual travel detail entry for flexible user experience. – Implemented itinerary management features including saved itineraries, trip history, public shareable links, and dynamic itinerary rendering. – Developed PDF/TXT export systems and integrated Cloudinary with Multer for secure media uploads and scalable cloud-based storage handling. – Designed scalable REST API architecture with Express.js middleware, MongoDB optimization, secure API handling, and production deployment on Vercel/Render. Full Stack E-commerce Platform Jan 2026 – Mar 2026 – Built a production-ready full-stack E-commerce platform using the MERN stack (MongoDB, Express.js, React.js, Node.js) with scalable MVC architecture. – Developed 25+ RESTful API endpoints for product catalog, cart management, checkout flow, order lifecycle, and user management. – Implemented global state management using Redux Toolkit and Thunk for efficient asynchronous API handling and optimized UI performance. – Designed and secured authentication & authorization using JWT and Role-Based Access Control (RBAC) for Admin and Customer roles. – Integrated Razorpay payment gateway with backend signature verification, enabling secure and reliable transaction processing. – Engineered complete Cart → Checkout → Payment → Order workflow simulating real-world e-commerce architecture. – Built an Admin Dashboard to manage products, users, and orders, including CRUD operations and role assignment. – Implemented Cloudinary-based image upload pipeline for optimized media storage and fast content delivery. – Designed a fully responsive mobile-first UI using Tailwind CSS, improving cross-device accessibility and user experience. – Deployed full-stack application on Vercel with environment-based configuration and production-ready setup. – Implemented secure payment signature verification using HMAC to prevent transaction tampering. Course Management System (CMS) Dec 2025 – Jan 2026 – Built a production-ready Course Management System using Next.js 16 (App Router), TypeScript, and MongoDB. – Implemented secure authentication using Clerk with webhook integration and protected routes. – Designed and enforced Role-Based Access Control (Admin, Moderator, Student) across the UI and APIs. – Developed course creation, lecture management, and publishing workflows using RESTful APIs. – Integrated Cloudinary for secure image and video uploads using DataURI processing. – Designed a fully responsive UI using Tailwind CSS and shadcn/ui. – Deployed the application on Vercel with production environment configuration. – Implemented scalable full-stack architecture following modern web development best practices, including API security, modular design, and performance optimization.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment