Hayat Ali
A passionate Full-Stack Developer creating modern, responsive, and user-friendly web applications.
My Tech Stack
I work with a variety of modern technologies to build high-quality web applications from front to back, and also build efficient databases.
HTML
CSS
JavaScript
Next.js
React.js
Bootstrap
Tailwind CSS
Express.js
MongoDB
PHP
XAMPP
MySQL
Node.js
C/C++
DSA
Git
GitHub
VS Code
PyCharm
Machine Learning
python
Auth.js
Antigravity
Featured Projects
Here are some of the projects I'm proud to have worked on.
A flagship Full-Stack E-Commerce solution meticulously built with Next.js 14. Featuring a high-security JWT Authentication layer and a custom-engineered Admin Dashboard for massive inventory control. Scaling over 250 laptop configurations with dynamic location-aware logic across 200+ countries.
A high-performance predictive engine built with Python and Scikit-learn, designed to analyze complex non-linear datasets and generate accurate, data-driven insights.
A modern, responsive Task Management Application built with React and Vite. Designed to streamline organizational workflow, it provides distinct, secure interfaces for Administrators and Employees to manage, track, and execute tasks efficiently.
A high-performance College Attendance Management System built with Next.js 16 and MongoDB. Features OTP-based teacher signup, bulk CSV student upload, a bubble-UI attendance interface, and advanced analytics with low-attendance alerts and multi-format export.
A high-efficiency, professional QR Code generator built with Flask and Pillow. Supports custom branding, center-logo embedding, color customization, and optimized scanning parameters for premium output.
A clinical AI platform that detects epileptic seizures from EEG signals in real time using a 3-layer hybrid deep learning ensemble (CNN-BiLSTM-Attention + RF + XGBoost). Features 3D brain visualization, WebSocket live streaming, and a full patient management system. Achieved ~98.3% accuracy and ~0.9949 ROC-AUC.
A masterclass in modern frontend architecture, featuring server-side rendering, zero-client-bundle data mutations, and an ultra-premium dark-mode aesthetic. Built with Next.js 14 and MongoDB Atlas.
A state-of-the-art, high-performance Task Management application blending a clean, premium UI with a robust backend. Features secure auth, smart session management, and real-time status sync.
A whimsical, browser-based creative tool that instantly crafts unique stories using randomized logic and string interpolation. Features a glowing glassmorphism UI and dynamic text replacement.
A dynamic card generator fetching live data from the PokéAPI. Automatically themes cards based on Pokémon types and includes a high-quality image download feature.
A production-grade, real-time messaging platform built as a single-file Flask application. Features end-to-end encryption, SHA-256 auth, and binary file transfer via WebSockets.
A pixel-perfect, responsive frontend clone of the X (formerly Twitter) interface. detailed recreation of the feed, sidebar, and trending section using Tailwind CSS.
A modern expense management web app with real-time budget tracking, balance calculations, and CRUD operations for expenses. Built with vanilla JavaScript and Tailwind CSS.
A comprehensive DSA sheet and programming learning repository featuring structured tutorials, C++ & Java code examples, and concept-based explanations for students and placement aspirants.
A modern creator-support crowdfunding platform built with Next.js 13+ App Router. Features creator profiles, donation flows, supporter messages, and scalable payment integration architecture.
An innovative game where you control movement using hand gestures captured via webcam. Built with Python and computer vision libraries for an immersive, touchless experience.
A high-performance link shortener featuring a sleek, modern UI, category-based browsing, and a smooth checkout flow. Optimized for speed and responsiveness.
A high-performance food delivery frontend featuring a sleek, modern UI, category-based browsing, and a smooth checkout flow. Optimized for speed and responsiveness.
A sophisticated personal AI assistant capable of voice recognition, natural language processing, and automated task execution. Designed to be your digital companion.
A clean, responsive Simple Calculator built using HTML, CSS, JavaScript, and math.js. features accurate mathematical operations with a modern glassmorphism UI.
Behind the Code
The Engineering Narrative
Bank Management System
A sophisticated C++ Infrastructure that redefines digital banking middleware. Architected with strict Object-Oriented principles to manage high-velocity transaction data and secure user lifecycles.
Featuring military-grade file persistence and a dual-layer authentication protocol, ensuring data integrity across complex banking operations.
Architecture
Safe-Core Transaction Logic v2.0
ML Intelligence Predictor
A data-driven engine powered by Python & Scikit-learn. This model processes non-linear data sets to deliver predictive insights with high-precision accuracy.
Integrated with OpenCV for computer vision capabilities, the system bridges raw computational power with a modern, reactive interface.
Algorithm
Non-Linear Prediction Matrix v1.4
Digital Portfolio Engine
The Next.js 14 Hub where design meets absolute scalability. This system delivers a high-performance, cyber-aesthetic experience with MongoDB Atlas powering real-time content delivery.
Core Features
- Dynamic Content Engine
- Cyber-Premium Aesthetic
- Interactive Framer Motion UI
- Full Responsive Optimization
Technical Stack
- Next.js 14 (App Router)
- MongoDB / Atlas
- Tailwind CSS / Shadcn UI
- Framer Motion
A masterclass in modern frontend architecture, featuring server-side rendering and zero-client-bundle data mutations via Server Actions.
Stack
Next.js 14 / MongoDB Atlas Core
TaskFlow Premium
A state-of-the-art, high-performance Task Management System blending a clean, premium UI with a robust Node.js & MongoDB backend.
Core Functionalities
- Advanced Auth & Sessions
- Intelligent Todo CRUD
- Real-time Status Sync
- Privacy & Segregation
Deep Tech Stack
- React 18 / Vite / Tailwind
- Node.js / Express REST API
- MongoDB / Mongoose ODM
- JWT / Bcrypt Security
Features a transition from local-first prototyping to a fully cloud-sovereign architecture, ensuring secure user onboarding and persistent data isolation.
Architecture
MERN Stack / JWT / REST
Al Mukammal Premium
A flagship Full-Stack E-Commerce solution meticulously built with Next.js 14. Featuring a high-security JWT Authentication layer and a custom-engineered Admin Dashboard for massive inventory control.
Core Features
- User & Admin Roles
- Dynamic Product Browsing
- Persistent Shopping Cart
- Global Location Selector
Tech Stack
- Next.js 14 API Routes
- MongoDB / Mongoose
- JWT Authentication
- React Context API
Scaling over 250 laptop configurations with dynamic location-aware logic across 200+ countries. Includes custom color management and bulk product operations.
JECRC Attendance App
A professional-grade College Portal engineered with Next.js 16 & MongoDB. From OTP-verified teacher onboarding to bulk CSV imports and a real-time bubble attendance UI — built for scale and speed.
Core Features
- OTP Email Verification
- Smart Bulk CSV Upload
- Bubble P/A Toggle UI
- Low-Attendance Alerts
Tech Stack
- Next.js 16 App Router
- MongoDB / Mongoose
- NextAuth.js (JWT)
- Nodemailer (Gmail OTP)
Features multi-format report export (CSV, TXT, Excel-ready), a full monthly register grid, and protected deletion flows requiring roll-number confirmation.
NeuroGuard AI
A real-time Clinical Neuroinformatics Platform built for Arya Verse 2.0 Hackathon. Detects epileptic seizures from raw EEG signals using a 3-layer hybrid deep learning ensemble with ~98.3% accuracy and 0.9949 ROC-AUC.
Platform Features
- Real-Time EEG WebSocket Stream
- 3D Brain Particle Visualization
- Seizure Probability Gauge
- Patient Dossier & Reports
AI Architecture
- CNN-BiLSTM-Attention (TensorFlow)
- Ensemble: RF + XGBoost
- DRL Adaptive Threshold (DQN)
- Three.js + Chart.js Frontend
Trained on the Bonn University EEG dataset (500 recordings, 5 classes). Sensitivity of ~93.5% ensures near-zero false negatives — because missing a real seizure can be life-threatening.
QR Studio
A high-efficiency Professional QR Code Generator engineered with Flask & Pillow. Supports custom branding, center-logo embedding, and precision-tuned scanning parameters for flawless, branded QR output.
Core Features
- Custom Logo Embedding
- Color Customization
- Optimized Scan Parameters
- REST API Backend
Tech Stack
- Python Flask
- Pillow (Image Processing)
- qrcode Library
- REST API Design
Generates high-resolution, print-ready QR codes with custom branding in seconds — bridging the gap between functional and visually premium output.
Hayat Task App
A client-side Single Page Application that mimics a robust enterprise system. Built with React & Vite, it features distinct Admin and Employee dashboards with a dark mode aesthetic.
System Features
- Role-Based Access (RBAC)
- Workforce Performance Stats
- Auto-Credential Generation
- Task Kanban Board
Stack Architecture
- React 18 / Vite
- Context API State
- Local Storage DB
- Tailwind CSS
Secure session management and data persistence are handled entirely client-side, demonstrating advanced React patterns and zero-backend capability.
FoodRush Advanced Platform
A state-of-the-art, full-stack food delivery application designed to seamlessly connect customers, restaurants, and delivery partners. Built with Next.js 14 for performance and MongoDB for real-time data management.
Core Features
- Dynamic Menu & Smart Cart
- Real-Time Order Tracking
- Three-Role Ecosystem
- Secure Payments (UPI/COD)
Tech Stack
- Next.js 14 (App Router)
- MongoDB / Mongoose
- NextAuth.js Security
- Zustand State Management
Optimized with Shadcn UI and Framer Motion. Features a robust Kitchen Display System (KDS) and a completely simulated UPI payment gateway for testing.
AI Voice & Chat Assistant
A groundbreaking Multimodal AI Interface powered by Flask, Python, and MongoDB. This system seamlessly integrates Push-to-Talk & Conversation Mode for a natural, voice-driven user experience.
Core Capabilities
- Perplexity Sonar Pro API
- Real-time Voice-to-Text
- Intelligent Context Retention
- Enterprise-Grade Security
Technical Stack
- Python Flask Backend
- MongoDB Persistence
- WebSpeech API
- Glassmorphism UI
Featuring a premium, glassmorphism-inspired design with syntax highlighting for 50+ languages and rigorous markdown rendering.
Engine
Flask / Perplexity Sonar / MongoDB
Gesture Command Interface
An innovative Human-Computer Interaction project built with Python, Mediapipe, and OpenCV. This system processes real-time webcam telemetry to map complex hand gestures directly to Windows keyboard interrupts.
Core Features
- Real-time Hand Tracking
- Sub-20ms Control Latency
- Dynamic FPS Monitoring
- Repeat-Key Prevention
Tech Stack
- Python 3.8+ Runtime
- Mediapipe Landmarking
- PyDirectInput Hooks
- OpenCV Vision Core
Architected specifically for high-speed gaming like Hill Climb Racing. Hand telemetry is mapped so the Right Hand triggers acceleration and Left Hand activates braking/reverse logic.
Visual Telemetry
Mediapipe Hands / OpenCV Core 4.8
BitLinks Analytics Engine
A production-grade URL Shortening Platform engineered with Next.js and Claude AI. This system delivers enterprise-level link management with real-time business intelligence.
Core Features
- Custom URL Shortening
- Real-Time Analytics Dashboard
- CTR & Click Tracking
- Secure User Accounts
AI Development
- Claude AI Code Generation
- Best Practices Enforcement
- Rapid Prototyping
- Component Logic Optimization
Built with Tailwind CSS for a polished, glassmorphism UI. The analytics dashboard provides key business metrics including Total Clicks, CTR, and Active Links in real-time.
AI-Assisted Development
Next.js 15 / Claude AI / Tailwind v4
Interactive Story Engine
A whimsical Browser-Based Application that demonstrates the power of JavaScript string interpolation and randomized logic. Built entirely with Vanilla JS to showcase raw DOM manipulation skills without frameworks.
Key Mechanics
- Dynamic Text Replacement
- Random Template Selection
- Input Validation & Sanitization
- Instant DOM Updates
Pure Stack
- HTML5 Semantic Markup
- CSS3 Glassmorphism
- Google Fonts (Outfit)
- ES6+ JavaScript
Features a glowing, neon-accented UI that proves complex aesthetics can be achieved with pure CSS3, requiring no external styling libraries.
Concept
User-Driven Narrative Logic
Pokémon Holo-Card Generator
A powerful Async Web App that interfaces with the public PokéAPI. It programmatically generates themed cards based on creature types in real-time.
Engineering Features
- Asynchronous Data Fetching
- Dynamic CSS Variable Mapping
- Canvas Rendering (html2canvas)
- Error Handling & Loading States
Tech Stack
- Vanilla JavaScript (ES6+)
- REST API Consumption
- CSS Grid/Flexbox
- Google Fonts (Bangers)
Includes a robust Download Feature that captures the DOM element and converts it to a high-quality PNG image for the user.
Functionality
REST API / DOM-to-Image / Dynamic Styling
SecureChat Platform
A production-grade, Real-Time Messaging System engineered for absolute privacy. Features custom reversible encryption algorithms, OTP-based authentication, and a scalable WebSocket architecture for instant delivery.
Security Core
- End-to-End Encryption
- SHA-256 Hashing
- OTP Verification
- Session Hijacking Protection
Backend Tech
- Python Flask (Single-File)
- Socket.IO / WebSockets
- MongoDB (Atlas)
- Binary File Handling
Demonstrates advanced backend concepts by condensing a full-stack real-time application into a highly portable, single-file server architecture.
Architecture
Socket.IO / MongoDB / Cryptography
X (Twitter) UI Clone
A pixel-perfect Responsive Interface Replication of the modern social media giant. Built with HTML5 & Tailwind CSS, focusing on layout precision, component scalability, and fluid responsiveness.
Design Fidelity
- Authentic 3-Column Grid
- Mobile-First Adaptation
- Material Symbols Integration
- Dark Mode Optimization
Utility Stack
- HTML5 Semantic Structure
- Tailwind CSS Utility Classes
- Responsive Breakpoints
- SVG & Flexbox Layouts
Demonstrates the ability to deconstruct complex UI patterns and rebuild them with cleaner, maintainable modern CSS utilities.
Styling Mastery
Tailwind CSS / Responsive Grid / UI Patterns
Budget Tracker
A comprehensive Expense Management System that enables real-time budget tracking and financial monitoring. Built with Vanilla JavaScript and Tailwind CSS for optimal performance and responsiveness.
Core Features
- Real-time Balance Calculation
- Expense CRUD Operations
- Dynamic Budget Updates
- Input Validation & Error Handling
Tech Stack
- HTML5 Semantic Markup
- Tailwind CSS Utilities
- ES6+ JavaScript
- Local State Management
Demonstrates proficiency in DOM manipulation, event handling, and building interactive financial tools without external frameworks.
Financial Tool
Real-time Tracking / CRUD / Vanilla JS
Code With H-Square
A comprehensive DSA Learning Platform designed for students and placement aspirants. Features structured tutorials, algorithm implementations, and side-by-side C++ & Java code examples for mastering data structures and algorithms.
Learning Features
- Structured DSA Sheet
- Concept-based Explanations
- Beginner-Friendly Flow
- Placement Preparation
Tech Coverage
- C++ Implementations
- Java Code Examples
- Algorithm Analysis
- Backend Concepts
A personal coding handbook inspired by industry-standard learning approaches, providing a single comprehensive resource for DSA mastery.
Learning Platform
DSA Sheet / C++ & Java / Algorithms
Get Me A Chai ☕
A modern Creator-Support Platform enabling financial contributions to content creators. Built with Next.js 13+ App Router, featuring scalable architecture, payment flow integration, and real-world product design principles.
Platform Features
- Creator Profile Pages
- Support Flow & Donations
- Supporter Messages
- Payment Gateway Ready
Tech Stack
- Next.js 13+ App Router
- React 18 Server Components
- Tailwind CSS
- Scalable Architecture
Demonstrates modern Next.js patterns, SEO-friendly routing, and production-ready full-stack development practices.
Full Stack Platform
Next.js 13+ / Crowdfunding / Payment Flows
Frontend Utility
HTML5 / CSS3 / JavaScript / math.js
Simple Calculator 🧮
A clean, responsive Simple Calculator built with Vanilla JavaScript and math.js. Designed for accuracy and a premium user experience, featuring glassmorphism elements and smooth mathematical evaluations.
Key Features
- Arithmetic Operations
- Precision Calculation
- Error Handling
- Responsive Design
Technical details
- math.js Evaluation
- DOM Manipulation
- CSS Grid Layout
- Safe Input Parsing
Focuses on efficient event handling and safe mathematical parsing, avoiding risky evaluation methods while maintaining a high-frequency UI response.
Achievements & Certificates
A passionate self-learner dedicated to turning ideas into real projects through consistent learning and hands-on practice.
Completed the Technology Strategy & Innovation job simulation, focusing on cloud transformation, technology infrastructure, and business optimization.
Participated in Round 1 Online MCQ Assessment + Coding of Adobe India Hackathon organized by Adobe & Unstop.
Participated in Prelims Level 1 of the Tata Crucible Campus Quiz 2025, demonstrating commitment to national level competitions.
Participated in a hands-on workshop on GitHub & Open Source Contribution conducted by 10X Club- Coding Ninjas.
Certified in Technology Entrepreneurship (Stanford) and Logical Reasoning (CareerRide) via Cursa platform.
Participated in the Innovicion Hackathon during ICI FEST 25 at Swami Keshvanand Institute of Technology.
Registered as a potential blood stem cell donor with DKMS BMST Foundation India to help delete blood cancer.
Admission and participation in Rajasthan Centre of Advanced Technology (R-CAT) for advanced technical studies.
Certified expert in OCI Data Science, covering machine learning model lifecycle, cloud architecture, and optimization.
Mastered Agentforce concepts and implemented autonomous AI agents to drive business outcomes.
Completed a comprehensive certified course in Machine Learning using Python and data science frameworks.
Completed the Algorithmic Trading A-Z with Python, Machine Learning & AWS course on Infosys Springboard (June 2025).
Learned backend development using PHP and MySQL.
Learned Data Structures & Algorithms in-depth using C++.
Participated in the 10X Online Coding Contest conducted by 10X Club-JECRC Foundation in collaboration with Coding Ninjas.
Attended workshop on HTML, CSS, JS & React for building websites.
Certified in basic C programming and problem solving.
Awarded for publishing a research review paper in a recognized academic journal.
Recognized for contributing to life-saving blood donation drives at Re Life Blood Center.
Certificate of Appreciation for donating blood at the Aashayein - The Life Saviours Mega Blood Donation Camp at JECRC, Nov 2024.
Completed the Logical Reasoning by CareerRide course on the Cursa platform (11 hrs 02 min + 5 exercises).
Certified participant in the "Say No to Drugs" national initiative by the Narcotics Control Bureau.
Certified for participating in the government initiative for tobacco awareness and prevention.
My Studies & Certificates
These are some academic achievements and certifications I've earned in school and college.
Salesforce Agentblazer Champion certification awarded for expertise in AI agents and the Agentforce platform.
Oracle certification demonstrating proficiency in cloud infrastructure, AI foundations, and cloud services.
Completed the BCG Data Science virtual experience program on Forage, covering data analysis, ML, and business insight generation.
Completed the Technology Strategy & Innovation job simulation, focusing on cloud transformation, technology infrastructure, and business optimization.
RTU Kota IV Semester Exam 2025 — Computer Science & Engg. SGPA: 8.40, CGPA: 9.03. Subjects include DBMS, TOC, Computer Networks, Microprocessor & more.
Academic record for the third semester, showcasing foundational engineering subjects.
Successful completion of the second semester in the bachelor of technology journey.
Initial academic performance and foundation in engineering studies.
Rank and performance in the Joint Entrance Examination for engineering admissions.
Higher Secondary education certificate from the Rajasthan Board of Secondary Education.
Secondary education certificate from the Rajasthan Board of Secondary Education.
Attended workshop on HTML, CSS, JS & React for building websites.
Certified in basic C programming and problem solving.
About Me
Hello! My name is Hayat Ali, son of Shahadat Ali. I am from Makrana, in the Nagaur district of Rajasthan. I completed my schooling in my hometown, where I secured a remarkable 94.2% in Class 12th. Currently, I am in my third year of B.Tech in Computer Science & Engineering at JECRC Foundation, Jaipur.
I have a strong interest in Machine Learning, Artificial Intelligence, and Web Development. I enjoy exploring complex programming challenges and continuously improving my technical skills. My academic journey is enriched with certifications and hands-on experience in C programming and modern web technologies. I thrive in team environments, having coordinated tasks and supported colleagues to achieve project goals efficiently.
My core strengths lie in problem-solving, quick learning, and meticulous attention to detail. I am driven by the ambition of becoming a professional Machine Learning Engineer. You can explore my full academic history in the Studies & Certificates section.
Beyond my professional goals, I come from a family of four siblings. My father works in the mining industry, and my mother is a dedicated homemaker. My background instills in me a strong work ethic and a desire for continuous growth.
Thank you for visiting my portfolio!
Get In Touch
Have a question or want to work together? Leave a message.