Heart Disease Predictor is an AI-powered, browser-based clinical risk assessment tool built with Python, Scikit-learn, and Streamlit — designed to predict the likelihood of heart disease based on key health parameters entered by the user.

The app takes a set of medical inputs — including age, sex, chest pain type, resting blood pressure, cholesterol levels, fasting blood sugar, resting ECG results, maximum heart rate, exercise-induced angina, ST depression, slope of the ST segment, number of major vessels, and thalassemia type — and instantly runs them through a trained machine learning classification model to produce a real-time prediction of whether the patient is at risk of heart disease or not.

Under the hood, the model is trained on the widely used Cleveland Heart Disease Dataset from the UCI Machine Learning Repository, which contains clinical records from 303 patients. The dataset is preprocessed to handle feature scaling and encoding, and a classification algorithm — such as Logistic Regression, Random Forest, or Support Vector Machine — is trained and evaluated for accuracy before being serialized and loaded into the Streamlit app for live inference. The entire prediction pipeline runs server-side and delivers results in milliseconds directly in the browser.

The interface is built using Streamlit, making it fully interactive with sliders, dropdowns, and input fields — no frontend coding required. The app is deployed and publicly accessible via Streamlit Cloud, meaning anyone with a browser can use it without installing anything. It is a strong end-to-end demonstration of the complete machine learning workflow: data preprocessing, model training, evaluation, serialization, and production deployment.

⚠️ This tool is built for educational and demonstration purposes only. It is not a substitute for professional medical diagnosis or clinical advice.

Tech Stack: Python · Scikit-learn · Pandas · NumPy · Streamlit · Streamlit Cloud Key Concepts: Binary Classification · Feature Engineering · Model Serialization · ML Deployment · Interactive UI · Healthcare AI

World Clock is a lightweight, browser-based time zone tracker built entirely with vanilla HTML, CSS, and JavaScript — no frameworks, no libraries, zero dependencies.

The app lets users instantly check the current local time for any country in the world by selecting it from a dropdown menu. With support for 70+ countries and their capital cities — ranging from Afghanistan to Zimbabwe — it covers every major time zone across all continents. The displayed time updates in real time without requiring any page refresh, giving users a live, accurate reading the moment they make their selection.

Under the hood, the app leverages JavaScript's built-in Date object combined with the Intl.DateTimeFormat API to handle timezone conversion accurately for each country. The country list is mapped to their respective IANA timezone identifiers, ensuring correct offset handling including daylight saving time adjustments where applicable. DOM manipulation is used to dynamically render the result on the page every time the user changes their selection — keeping the interface instant and responsive.

The UI is clean and minimal by design — a single dropdown and a live time display — making it fast to load, easy to use on any device, and simple to extend. The project is a strong real-world demonstration of working with time and date APIs, handling international data, dynamic DOM updates, and building practical tools with nothing but core web technologies.

Tech Stack: HTML5 · CSS3 · Vanilla JavaScript Key Concepts: Date & Time API · Intl.DateTimeFormat · IANA Timezones · DOM Manipulation · Real-time UI Updates

Palindrome Checker is a lightweight, browser-based string validation tool built entirely with vanilla HTML, CSS, and JavaScript — no frameworks, no libraries, zero dependencies.

The app prompts the user to enter any word, sentence, phrase, or number and instantly determines whether it is a palindrome — a sequence that reads the same forwards and backwards. Before checking, the input is intelligently cleaned using a regular expression that strips all punctuation, special characters, and spaces, and converts everything to lowercase. This means classic palindromes like "A man, a plan, a canal: Panama" or "Was it a car or a cat I saw?" are correctly identified — not just simple ones like "racecar" or "12321".

Under the hood, the logic uses core JavaScript string and array methods: .replace() with a regex pattern to sanitize input, .toLowerCase() for case normalization, .split("") to convert the string into a character array, .reverse() to flip it, and .join("") to reconstruct it — then a strict equality check === to confirm the match.

The app runs in a continuous loop, allowing users to check multiple inputs back-to-back without reloading. If the user cancels, a "Check Again" button is available to restart the session instantly. The entire project is a clean demonstration of algorithmic thinking, string manipulation, regex usage, and DOM interaction using pure JavaScript fundamentals.

Tech Stack: HTML5 · CSS3 · Vanilla JavaScript Key Concepts: String manipulation · Regular expressions · Array methods · Loop control flow · DOM events

Number to Words Converter is a lightweight, browser-based numeric translation tool built entirely with vanilla HTML, CSS, and JavaScript — no frameworks, no libraries, zero dependencies.

The app takes any number entered by the user and instantly converts it into its full English word representation — so an input like 1947 becomes "One Thousand Nine Hundred Forty Seven", and 1000000 becomes "One Million". It handles a wide range of numeric values including ones, teens, tens, hundreds, thousands, and millions, correctly applying the unique English naming rules for each group — including the irregular teen numbers like eleven, twelve, thirteen and so on.

Under the hood, the logic is broken into recursive or iterative grouping functions that split the number into chunks — millions, thousands, hundreds, and the remainder — and map each chunk against a predefined array of word equivalents. Special edge cases such as zero, negative numbers, and numbers in the teens are handled separately to ensure the output is always grammatically correct and natural-sounding English.

The interface is clean and minimal — a single input field and an instant live result — making it fast to load, intuitive to use on any device, and easy to extend further. This project is a strong demonstration of number theory logic in JavaScript, array mapping, modular function design, and building genuinely useful everyday tools with nothing but core web technologies.

Tech Stack: HTML5 · CSS3 · Vanilla JavaScript Key Concepts: Number Parsing · Recursive Logic · Array Mapping · Edge Case Handling · DOM Manipulation

TaskFlow — To-Do List Manager is a clean, browser-based task management app built entirely with vanilla HTML, CSS, and JavaScript — no frameworks, no libraries, zero dependencies.

The app allows users to add tasks with both a title and a description, view all added items in a structured table with serial numbering, mark individual tasks as completed, and clear the entire list in one click. Each task entry is dynamically rendered into a live table with columns for serial number, item title, item description, completion status, and action buttons — giving users a clear, organized overview of everything on their list.

Under the hood, the app uses JavaScript DOM manipulation to dynamically create and insert table rows every time a new task is added. Input fields are read, validated, and cleared after each submission — ensuring a smooth, uninterrupted user experience. The completion toggle and delete actions are handled through event listeners attached to dynamically generated buttons, demonstrating an understanding of event delegation and dynamic element management in vanilla JavaScript.

The interface is minimal and distraction-free by design — a simple form at the top and a live task table below — making it fast to load and intuitive to use on any device. This project is a strong demonstration of dynamic DOM manipulation, form handling, table generation, and building genuinely useful productivity tools using nothing but core web technologies.

Tech Stack: HTML5 · CSS3 · Vanilla JavaScript Key Concepts: DOM Manipulation · Dynamic Table Rendering · Event Listeners · Form Handling · Task State Management

FontSizer — Interactive Font Size Controller is a clean, browser-based text accessibility tool built entirely with vanilla HTML, CSS, and JavaScript — no frameworks, no libraries, zero dependencies.

The app demonstrates three different ways to dynamically control font size on a live text block — all working in real time without any page refresh. Users can decrease or increase the font size using the A− and A+ buttons for quick step-by-step adjustments, drag a range slider for smooth continuous resizing, or type an exact value directly into a number input field for precise control. All three controls stay in sync with each other — changing one instantly reflects across all others.

Under the hood, every control is wired to the same JavaScript handler using DOM event listeners — onclick for the buttons, oninput for the range slider, and onchange for the number input. Each event reads or updates a shared font size value and applies it directly to the target element via element.style.fontSize, keeping the UI state consistent at all times.

This project is a practical demonstration of multi-input synchronization, real-time DOM style manipulation, event-driven UI design, and building genuinely useful accessibility features using nothing but core web technologies. It reflects real-world patterns used in content-heavy websites, e-readers, and accessibility toolbars.

Tech Stack: HTML5 · CSS3 · Vanilla JavaScript Key Concepts: DOM Style Manipulation · Event Listeners · Multi-Input Sync · Accessibility UI · Real-time Updates

BinaryBridge — Decimal to Binary Converter is a clean, browser-based number system conversion tool built entirely with vanilla HTML, CSS, and JavaScript — no frameworks, no libraries, zero dependencies.

The app prompts the user to enter any decimal number and instantly converts it into its binary (base-2) representation, displaying both the original decimal value and the full binary string as output. What makes this project stand out is the visual bit display — each binary digit is rendered as an individual styled box, with 1 bits highlighted in green and 0 bits shown in grey, giving users an immediate, intuitive understanding of how binary numbers are structured at the bit level.

Under the hood, the conversion uses JavaScript's built-in .toString(2) method to convert the integer to its binary string equivalent. The binary string is then iterated character by character using a for loop, dynamically creating a div element for each bit via document.createElement(), applying the appropriate CSS class (one or zero) based on the bit value, and appending it to a flex container in the DOM. Invalid or non-numeric inputs are gracefully handled with an error message. A "New Convert" button triggers location.reload() to restart the process instantly without any manual page refresh.

This project is a strong demonstration of number system logic, dynamic DOM element creation, CSS class-based conditional styling, and building visually engaging educational tools using nothing but core web technologies.

Tech Stack: HTML5 · CSS3 · Vanilla JavaScript Key Concepts: Number Base Conversion · Dynamic DOM Creation · Conditional Styling · Input Validation · Bitwise Visualization

SipherTech Website Clone is a fully responsive, multi-page website built as a 3-day workshop assignment conducted by Sipher Web Tech at my college. The project involved cloning the official SipherTech Solutions website — a professional IT company offering web development, mobile apps, cloud infrastructure, and digital marketing services — using pure HTML and CSS with clean, production-style code.

The website includes multiple fully functional pages — a Home page with an image carousel/banner slider, an About Us page, a Services page, a Careers page, and a Contact section with an embedded Google Maps location. The home page features a responsive navigation bar with dropdown menus, a hero section with rotating banners and taglines, a services grid, a portfolio/work section, a team members section, and a footer — all structured and styled to closely match the original SipherTech company website layout.

The project demonstrates real-world front-end skills including multi-page site architecture, responsive layout design, navigation with dropdowns, CSS flexbox and grid, banner/slider UI, and embedding third-party content like Google Maps. Completing this in just 3 days under workshop conditions reflects the ability to work under tight deadlines and translate a live professional website into clean, hand-written code.

Built During: 3-Day Web Development Workshop by Sipher Web Tech Tech Stack: HTML5 · CSS3 · Vanilla JavaScript Key Concepts: Responsive Design · Multi-Page Architecture · Navigation Dropdowns · Image Sliders · CSS Flexbox/Grid · Google Maps Embed

Binary Clock is a real-time, browser-based clock that displays the current time — hours, minutes, and seconds — entirely in binary (base-2) format using glowing LED-style bit columns. Instead of showing digits like 14:35:52, it lights up binary columns where each row represents a power of 2 — values 1, 2, 4, 8, 16, 32 — and the combination of lit and unlit cells encodes the exact current time in binary at every second.

The clock is divided into six columns — two for hours, two for minutes, and two for seconds — with each column independently displaying its value in binary by illuminating the corresponding bit rows. For example, the hour 14 becomes 1110 in binary, lighting up the 8, 4, and 2 rows while leaving 1 dark. This makes reading the clock an engaging mental exercise in binary arithmetic and number systems.

Under the hood, the clock uses JavaScript's Date object to fetch the current hours, minutes, and seconds every second via setInterval(). Each time value is converted to binary and split digit by digit. The DOM is then updated in real time — toggling CSS classes on each bit cell to turn them on or off — creating a smooth, live ticking binary display without any page refresh.

This project is a creative and technically impressive demonstration of real-time DOM updates, binary number representation, setInterval timing, CSS class toggling, and building visually unique clock UIs using nothing but core web technologies.

Tech Stack: HTML5 · CSS3 · Vanilla JavaScript
Key Concepts: Binary Number System · Real-Time Clock · setInterval · DOM Class Toggling · LED-Style UI