🌤️ Weather App Project – My Latest Frontend Project! I recently built a Weather App using HTML, CSS, and JavaScript that allows users to check real-time weather information for their current location or any city in the world 🌍. 🔧 Tech Stack & Tools Used: HTML5 – for building the structure of the app CSS3 – for styling and making it visually appealing JavaScript (ES6) – for dynamic content and API integration OpenWeatherMap API – to fetch live weather data Geolocation API – to get the user’s current location 📚 What I Learned: How to fetch and handle data from APIs using fetch() and promises How to manipulate the DOM dynamically to update weather information in real-time How to handle permissions and errors when accessing the user’s location Improved my understanding of asynchronous JavaScript and event handling Enhanced my CSS layout skills for responsive design 💡 Features of the App: ✅ Displays current temperature, humidity, wind speed, and weather condition ✅ Allows users to search weather by city name ✅ Automatically detects the user’s location using browser permissions ✅ Clean and responsive user interface Building this project helped me connect many concepts together — from APIs and async programming to clean UI design. Excited to keep learning and improving! 🚀 #JavaScript #FrontendDevelopment #WeatherApp #WebDevelopment #HTML #CSS #APIs #LearningByBuilding

📅 My 29th JavaScript Project – Sidebar Navigation Menu 🧭💻 💡 Today’s build is all about creating a responsive and interactive sidebar navigation — perfect for dashboards, productivity tools, and web apps. ⚙️ Built with: HTML, CSS, and JavaScript This project focuses on toggleable menus, dropdown submenus, and smooth transitions — giving a real app-like experience. ✨ Key Features: ✅ Collapsible sidebar with toggle button ✅ Dynamic dropdown menus for sub-items ✅ Clean and minimal UI design ✅ Fully responsive layout ✅ Simple yet efficient JavaScript logic for interactivity 🎯 Learning Highlight: This project helped me practice DOM event handling, class toggling, and nested menu logic, all while improving UI structure and usability. 🚀 With every project, my frontend journey becomes more fun and hands-on. Step by step, building interfaces that feel alive! #JavaScript #FrontendDevelopment #WebDevelopment #CodingJourney #SidebarMenu #InteractiveUI #WebProjects

I’m excited to share my latest project a fully functional Quiz App built using Tailwind CSS React.js Key Features: 1. User Authentication — Secure login/signup with personalized dashboards 2. Dynamic Quiz System — Choose your category, difficulty, and number of questions. Smart Timer — • Beginner: 5s • Intermediate: 10s • Advanced: 15s Auto-switches to the next question when time’s up! 3. Interactive Dashboard — • Track your score, streaks, and badges. • Visual analytics powered by Recharts. 4. Dark & Light Mode — Automatically adapts for readability and style. Built With: React.js | Context API | Tailwind CSS | Recharts This project helped me strengthen my concepts of React state management, props, and component architecture — turning theory into something truly interactive! Github Repo - https://lnkd.in/duu9MjM3 Live Preview - https://lnkd.in/dHgPda7Y I’d love your feedback and suggestions to make it even better — especially ideas for adding new features like authentication, difficulty levels, or analytics! #ReactJS #WebDevelopment #ProjectShowcase #LearningByBuilding #FrontendDevelopment #QuizApp #JavaScript

🚀 Day 11 — Mini Project: Searchify 🔍 Today I built a new mini project — Searchify a simple and clean JavaScript Search Functionality App that filters users by their name or email in real time! ⚡ This project helped me understand how to: ✨ Work with arrays of objects (user data) ✨ Use DOM manipulation effectively ✨ Implement real-time filtering using input events ✨ Make a clean and responsive UI with CSS ✨ Connect logic between HTML, CSS, and JS I’ve used: 💻 HTML – Structure 🎨 CSS – Clean responsive styling ⚙️ JavaScript – Logic for live searching This project might look simple — but it’s a great practice for learning how real search boxes work in modern web apps! 🔗 Live Demo: https://lnkd.in/gAstq426 📦 GitHub Repo: https://lnkd.in/gQGsnbbH 💬 If you’re also learning JavaScript, I’d love to hear what mini projects you’re building. Let’s grow together 🚀 #️⃣ #Day11 #JavaScript #FrontendDevelopment #MiniProject #WebDevelopment #HTML #CSS #SearchApp #LearningInPublic #100DaysOfCode #FrontendJourney

🚀 I’ve built a simple and responsive Calculator Web App using #HTML, #CSS, and #JavaScript. This project performs basic arithmetic operations like addition, subtraction, multiplication, and division — all through a clean and intuitive user interface. ✨ Features: Perform basic mathematical operations ( +, −, ×, ÷ ) Clear and reset buttons for easy use Attractive UI with responsive design for all devices Real-time display update using DOM manipulation Simple and beginner-friendly code structure 🧠 This project helped me strengthen my skills in: JavaScript logic building and event handling DOM manipulation and dynamic updates CSS layout and styling for responsive UIs Building interactive front-end applications This project was a great exercise to understand the fundamentals of JavaScript-based interactivity and improve my front-end development skills. 🔗 Check out the code on GitHub: 👉 https://lnkd.in/ggKayjx3 #HTML #CSS #JavaScript #WebDevelopment #Frontend #Coding #PortfolioProject #Learning

🚀 New Project Drop: Task Manager Web App Over the past few days, I’ve been working on building something simple yet super useful a Task Manager Web Application that helps you stay organized while maintaining a clean, premium interface. 🌟 What it does: Add, edit, delete, and mark tasks as complete Stores all data locally using JavaScript LocalStorage (so your tasks stay even after refresh!) Designed with a minimal and responsive UI for a clutter-free experience 💻 Tech Stack: HTML | CSS | JavaScript 🎯 What I learned: Managing state and user interaction with JavaScript Working with browser LocalStorage for persistent data Structuring frontend code efficiently and maintaining design consistency Hosting and deploying static projects on GitHub Pages 📂 GitHub Repository: https://lnkd.in/drPC5Zfb This project is a small but solid step toward my goal of mastering frontend and UI design while connecting it with real-world functionality. #WebDevelopment #JavaScript #FrontendDeveloper #CodingJourney #GitHubPages #ProjectShowcase #BuildInPublic #WomenInTech

🌍 World Countries Explorer | React.js + REST API + Tailwind CSS 🚀 Built a responsive web app that displays detailed information about all countries using the REST Countries API. Users can search, filter by region, and view country details such as flag, capital, region, and population — all in a clean, modern UI. 💡 Tech Stack: ⚛️ React.js – for dynamic UI and component structure 🎨 Tailwind CSS – for modern, responsive styling 🌐 REST API – for real-time country data fetching 🎯 Key Features: ✅ Search & filter functionality ✅ Dynamic routing for detailed country pages ✅ Fully responsive UI ✅ Smooth animations and hover effects 📦 GitHub: https://lnkd.in/eMD2NykQ 🌐 Live Demo: https://lnkd.in/esCB_C6X

🚀 Mini-Project Showcase: The Bomb Defuser Game! ⏱️ Thrilled to unveil a small yet powerful creation that deepened my grasp of core web development — a fully functional Time Bomb Defuser 🎮💻 This interactive web app challenges users to “defuse” a ticking bomb (a countdown timer) by entering the right keyword — a synonym for “Neutralize” — before time runs out. 👉 Try it here: bombdefuserf.ccbp.tech 💡 What I Brought to Life ⚙️ JavaScript Timer Logic: Leveraged setInterval() for a live countdown, mastering time-based control flow. 🎨 Dynamic DOM Manipulation: Used timerEl.textContent and timerEl.style.color to make the page react to user success or failure. 🎯 Event Handling: Captured real-time keyboard input with addEventListener("keydown", …) to listen for the Enter key. 🔍 Conditional Checks: Combined input validation, key detection, and countdown control for precise interaction. 🧹 Clean-Up Discipline: Applied clearInterval() for efficient resource handling and a clean finish. This mini-project reminded me that even small builds can deliver big learning moments — turning static pages into living, responsive experiences. #JavaScript #WebDevelopment #Frontend #MiniProject #DOMManipulation #EventHandling #CodingProjects #InnovationInCode

🚀 New Project Alert! I’m excited to share a personal project I’ve been working on: a Notes App built using React. 📝 This lightweight tool allows you to add, view and delete notes with a clean interface and full local-storage persistence. 🔧 What it does Create new notes with a title and body View all existing notes in a list Delete notes easily Data persists between browser sessions using localStorage Responsive layout with a scenic background + cards for readability 🧠 Why I built it To strengthen my understanding of React hooks like useState, useEffect To practice component architecture (NoteForm, NoteList, NoteItem) and conditional UI logic To deliver a simple, practical utility project that I can iterate on (next up: edit capability, filtering/search, tags/categories) 🛠️ Tech stack React (functional components + hooks) Bootstrap (for grid/layout & card styling) Plain JavaScript + browser localStorage Responsive design with full-screen background image Deploy to a live URL and share a GitHub link for collaboration and feedback I’d love for you to take a look, give feedback, or even contribute if you’d like! Feel free to drop me a message or comment below. Githublink:https://lnkd.in/g5HErT4w Live Link:https://lnkd.in/g4jUrNyU #ReactJS #WebDevelopment #PersonalProject #JavaScript #Frontend