Vijay Shekh’s Post

Day 12 – Built a Rock Paper Scissors Game with HTML, CSS & JavaScript Today I built a simple but fun Rock Paper Scissors game using pure HTML, CSS, and JavaScript. The game allows a user to choose Rock, Paper, or Scissors, and the bot randomly selects its move. The result is instantly displayed showing whether the player wins, the bot wins, or it’s a draw. What I practiced in this project: • DOM manipulation using JavaScript • Generating random choices for the bot • Game logic implementation • Interactive UI design with CSS • Handling user events (click interactions) Tech Stack HTML | CSS | JavaScript If you’re learning JavaScript, this is a great beginner project to understand how frontend logic works in real-time. #JavaScript #WebDevelopment #FrontendDevelopment #HTML #CSS #CodingJourney #BuildInPublic

🚀 Age Calculator Web Project 🎂 Just built a simple & responsive Age Calculator using HTML, CSS, and JavaScript 💻✨ This project calculates a user’s exact age based on their date of birth and displays the result dynamically. 🔹 Features: 📅 Date input for birthday 🧮 Accurate age calculation using JavaScript ⚡ Instant result display 🎨 Clean and responsive UI with CSS 🛠 Tech Stack: 🔸 HTML 🔸 CSS 🔸 JavaScript 📚 This project helped me practice DOM manipulation, JavaScript Date objects, and frontend fundamentals. More projects coming soon — learning one step at a time! 🚀🔥 #WebDevelopment 💻 #JavaScript 🚀 #HTML 🔖 #CSS 🎨 #Frontend #CodingJourney #Projects #Learning

💻 Understanding the Basics of Web Development Every website is built using three core technologies: 🔹 HTML – The Structure HTML creates the foundation of a webpage. It defines elements like headings, paragraphs, images and links. 🔹 CSS – The Design CSS is used to style the webpage. It controls colors, layouts, spacing and makes the website visually attractive. 🔹 JavaScript – The Behavior JavaScript makes the website interactive by adding features like animations, dynamic content and user interactions. In simple words: HTML builds the structure, CSS designs it, and JavaScript makes it interactive. #FrontendDeveloper #WebDevelopment #HTML #CSS #JavaScript #ReactJS #Coding #LearnInPublic #Developers #Programming

🚀 Mini Project #2 :- Random Quote Generator Today I created a Mini Project – Random Quote Generator using HTML, CSS, and JavaScript 💻✨ In this project, a new quote automatically appears every 2–3 seconds without clicking any button. JavaScript randomly selects a quote from a list and updates it on the screen, making the page dynamic and engaging. 🔹 What I practiced: ✅ DOM Manipulation(DOM Manipulation means changing or controlling the content, structure, or style of a webpage using JavaScript. 💻) ✅ Using Math.random() for random selection ✅ Using setInterval() to update quotes automatically ✅ Creating a simple interactive UI with HTML & CSS Small projects like this help me understand how JavaScript makes websites dynamic and interactive. If you have any suggestions or ideas for improvement, feel free to share them. I’d love to learn and improve! 😊 #Day21 #WebDevelopment #JavaScript #HTML #CSS #FrontendDevelopment #CodingJourney #100DaysOfCode

I’m excited to share my latest project – a fully responsive To-Do List Application built using HTML, CSS, and JavaScript. Live demo : https://lnkd.in/gSU5UcGX 🔹 Key Features: • Add, edit, and delete tasks • Mark tasks as completed • Interactive and user-friendly UI • Responsive design for mobile & desktop • Dynamic DOM manipulation using JavaScript 🔹 What I Learned: • Working with the DOM (Document Object Model) • Event handling in JavaScript • Local storage for saving tasks • Writing clean and structured code • Improving UI with CSS styling Note:- It uses local storage for To-Do lists. #WebDevelopment #JavaScript #HTML #CSS #FrontendDevelopment #LearningByDoing

DOM Manipulation Project – JavaScript in Action! I’m excited to share my latest JavaScript DOM project, where user interaction directly controls the UI behavior. In this project, clicking a button dynamically changes the colors of multiple elements on the screen, demonstrating how JavaScript can manipulate HTML and CSS in real time. What I learned through this project : 1.) Understanding the Document Object Model (DOM) and how web pages are structured. 2.) Selecting and targeting elements using methods like getElementById, querySelector, etc. 3.) Handling events (button click) to trigger actions. 4.) Dynamically updating styles and properties using JavaScript. 5.) How JavaScript acts as a bridge between HTML structure and CSS styling. 6.) Improving interactivity and responsiveness without reloading the page. This project helped me strengthen my foundation in core JavaScript concepts, especially DOM manipulation and event handling, which are essential for building interactive and user-friendly web applications. Small projects like these give big clarity. Feel free to check out my work on github and share your feedback : https://lnkd.in/guFaS8uq #JavaScript #DOMManipulation #WebDevelopment #FrontendDevelopment #LearningByDoing #CodingJourney #JavaScriptProjects #WebDesign #DeveloperLife #Programming #UIInteraction

🌟 Star Rating Component – Live! Just built a dynamic star rating using HTML, CSS & JavaScript! ✨ It’s interactive, sleek, and ready to add some sparkle to any web project. Try it out here: https://lnkd.in/guZ-EXyg Loving these small projects that make coding both fun and practical! 💻 #FrontendDevelopment #JavaScript #HTML #CSS #UI #WebDev #MiniProjects #CodingJourney #LearningByDoing

JavaScript is a programming language that enhances website interactivity. It operates directly within the web browser, allowing for a seamless user experience. When a user opens a webpage, the browser loads HTML, CSS, and JavaScript files: - HTML establishes the structure of the page. - CSS manages the design and layout. - JavaScript introduces behavior such as buttons, animations, and form validation. The browser utilizes a JavaScript engine to interpret and execute the code. JavaScript can modify page content through the DOM (Document Object Model) and respond to user actions like clicks, typing, or scrolling. This capability transforms websites from static pages into dynamic, interactive experiences.

Most developers blame hosting when a website feels slow. But in many projects I’ve worked on, the real problem was something else: • Huge PNG images • Importing entire JavaScript libraries • Large CSS files blocking rendering Small decisions like these quietly increase bundle size. For example: If you only need a button, import the button — not the entire UI library. Same with images. Converting PNG → WebP alone can reduce file size dramatically. And for CSS, modern tools like Tailwind can keep your styles much lighter. Fast websites are rarely about fancy frameworks. They’re about small, thoughtful optimizations. Curious — what usually slows down websites in your experience? #webdevelopment #frontenddevelopment #reactjs #javascript #webperformance #tailwindcss #softwaredevelopment #codingtips #developers

🚀 Built a Simple Counter Application using HTML, CSS & JavaScript Today I worked on a small front-end project to strengthen my JavaScript fundamentals. 🔹 Features: • Increment the value • Decrement the value • Reset the counter • Styled using Flexbox • Added box-shadow and modern UI design 💡 What I learned: DOM manipulation using getElementById Updating content dynamically with innerText Using Flexbox for alignment Improving UI with CSS properties like box-shadow and gap This small project helped me understand how JavaScript interacts with HTML elements in real-time. Step by step, building consistency towards becoming a better developer 💻✨ #HTML #CSS #JavaScript #WebDevelopment #Frontend #LearningJourney