Aspiring IT Professional | CSE Student | Java Enthusiast | MERN Developer.

Gagan Rai  • Peerlist

How I Built a Sleek, Interactive Calculator with Just HTML, CSS, and JavaScript!" Ever wanted to build something both practical and fun? I took on the challenge of creating a fully functional calculator from scratch—no fancy frameworks, just pure HTML, CSS, and JavaScript! 🔢 What It Does: Basic Math Operations: Add, subtract, multiply, and divide with ease. Interactive Design: Buttons that respond to clicks (and even keyboard input!). Clean UI: A sleek, modern interface with a satisfying display animation. Error Handling: No more "NaN" nightmares—graceful error messages instead! 💡 The Journey: HTML: Structured the layout with a display and responsive buttons. CSS: Styled it with gradients, shadows, and hover effects for a polished look. JavaScript: Made it actually work with logic for calculations, clearing, and even decimal inputs. 🚀 Why It’s Cool: This wasn’t just about crunching numbers—it was about problem-solving, debugging (so much debugging!), and turning code into a real, clickable tool. And now? It’s alive!

Calculator

This React-based Drum Machine app lets users play audio samples by clicking pads or pressing keyboard keys (Q, W, E, A, S, D, Z, X, C). Each pad triggers a unique sound (e.g., Heater kits, claps, cymbals), with a display showing the active sound. Built to meet freeCodeCamp's test requirements, it demonstrates React state/event handling, dynamic UI updates, and responsive CSS styling.

Drum machine

https://gen-ai-integrated-resume-builder.onrender.com/interview/6a05e1940886583a8b6977de Developed and deployed a full-stack, AI-integrated resume builder designed to streamline the career documentation process for job seekers. By leveraging advanced Generative AI, the platform automates the creation of professional, high-impact bullet points and tailored job descriptions based on minimal user input. Core Deliverables: Gen-AI Integration: Implemented AI capabilities to transform raw user experience data into polished, professional achievements. Dynamic Rendering: Built a sleek, responsive UI featuring real-time document preview and generation. ATS Optimization: Structured the output data and templates to comply with standard Applicant Tracking System (ATS) parsing requirements. Suggest Skills Gap between Job requirements and your skills. Provide Most probably asked questions on interview , both technical as well as behavioural question. Give structural roadmap to get placed in the job. Deployment: Configured and managed continuous deployment via Render for a seamless production environment.

ResuGen AI

I built a fully functional Tic Tac Toe game using HTML, CSS, and vanilla JavaScript—no external libraries or frameworks. This project focuses on two-player mode (Player vs Player), allowing two users to play on the same device. Key Features 1. Interactive Game Board 3×3 grid with smooth hover effects Visual feedback when a cell is selected Dynamic turn indicator (shows whose turn it is—X or O) 2. Game Logic & Win Detection Tracks player turns (alternates between X and O) Checks for wins in rows, columns, and diagonals Detects draws when no moves are left Displays the winner instantly when the game ends 3. User-Friendly UI Restart button to reset the game anytime Scoreboard to keep track of wins for both players Responsive design that works on desktop and mobile 4. No AI / Computer Mode (Player vs Player Only) Unlike many Tic Tac Toe implementations, this version does not include a computer opponent. Instead, it’s designed for two human players taking turns on the same device. How I Built It HTML: Structured the game board and UI elements CSS: Styled the grid, buttons, and animations JavaScript: Used event listeners for cell clicks Implemented game state management Added win/draw detection logic Updated the UI dynamically This project was a great way to practice DOM manipulation, event handling, and game logic in pure JavaScript.