Image Search Engine using JavaScript & Unsplash API! Excited to share my latest project — a clean and responsive Image Search Engine built using HTML, CSS, and JavaScript. It fetches high-quality images from the Unsplash API and displays them in a modern grid layout with pagination support. 🔹 Features: ✔️ Keyword-based image search ✔️ High-resolution images ✔️ “Show More” pagination ✔️ Responsive UI ✔️ Fast & lightweight (Vanilla JS) 🔧 Tech Stack: HTML | CSS | JavaScript | Unsplash API This project helped me strengthen my understanding of API integration, async/await, DOM manipulation, and UI design. 💡 Feedback and suggestions are welcome! Always open to learning and improving 🚀 GitHub : https://lnkd.in/gFK4AbwC #JavaScript #WebDevelopment #Frontend #APIs #Unsplash #HTML #CSS #Learning #Projects #Developer
More Relevant Posts
-
Built a Weather website using HTML, CSS, JavaScript & Bootstrap! I’m excited to share my latest project — a Weather Application that fetches real-time weather data using the OpenWeather API and displays it in a clean, responsive UI. 💡 Features: ✅ Search weather by city name ✅ Real-time temperature display (°C) ✅ Humidity & Wind Speed details ✅ Dynamic weather icons using Font Awesome ✅ Loading spinner & error handling ✅ Fully responsive design using Bootstrap 5 🛠️ Tech Stack: ✅HTML5 ✅CSS3 ✅JavaScript (Async/Await & Fetch API) ✅Bootstrap 5 ✅Font Awesome This project helped me strengthen my understanding of: ✅API integration ✅Asynchronous JavaScript ✅DOM manipulation ✅Error handling ✅Responsive UI design 🌐 Project Links 🔗 GitHub Repository: 👉https://lnkd.in/g8FcXtDv 🔗 Live Demo (GitHub Pages): 👉https://lnkd.in/gBgh-5gi Small projects like this are helping me build stronger frontend fundamentals step by step I’m continuously learning and improving — feedback is always welcome! #WebDevelopment #FrontendDeveloper #JavaScript #Bootstrap #APIs #LearningInPublic #StudentDeveloper
To view or add a comment, sign in
-
🚀 Mini Frontend Project: Interactive Like Button (HTML • CSS • JavaScript) Just built a small yet powerful UI interaction to strengthen my JavaScript fundamentals 💡 ✨ What this project demonstrates: DOM manipulation using vanilla JavaScript State management using a boolean flag Dynamic image & style updates on user interaction Clean UI built with HTML, CSS, Bootstrap & Font Awesome 👍 Clicking the Like button updates the image, icon color, and button style in real time—just like a real social media interaction. 🛠 Tech Stack: HTML | CSS | JavaScript | Bootstrap | Font Awesome 📈 Projects like these help me deeply understand how user actions connect with UI behavior and logic behind the scenes. Always learning, always building 💻✨ 🔗 https://lnkd.in/gU74UcdP #FrontendDevelopment #JavaScript #WebDevelopment #DOMManipulation #LearningByBuilding #MiniProject #HTML #CSS
To view or add a comment, sign in
-
-
🚀 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
To view or add a comment, sign in
-
Built a Feedback Form with JavaScript Validation. I recently developed a fully functional Feedback Form using HTML, CSS, and JavaScript as part of my front-end practice. Key Features: 🔹Form validation using JavaScript 🔹Real-time error handling 🔹Email format validation with Regex 🔹Dynamic star rating display ⭐ 🔹Clean and responsive UI design 🔹Prevented default form submission using event.preventDefault() What I Learned: 🔹Handling DOM elements efficiently 🔹Writing reusable validation functions 🔹Improving user experience with clear error messages 🔹Resetting forms after successful submission 🔹Structuring clean and readable code 🔹This project helped me strengthen my understanding of form validation, event handling, and DOM manipulation. 🔹Looking forward to building more interactive web applications! 🌐 Project Links 🔗 GitHub Repository: 👉 https://lnkd.in/gMmMtJhr 🔗 Live Demo (GitHub Pages): 👉 https://lnkd.in/gJEh2Th4 #WebDevelopment #JavaScript #FrontendDevelopment #HTML #CSS #LearningByDoing #CodingJourney
To view or add a comment, sign in
-
This Progress Bar Actually Works 🔥 #webdev #shorts In this short project, we create a dynamic progress bar using Semantic UI, jQuery, and Vanilla JavaScript. The bar starts at 0% and updates smoothly when clicking + or – buttons, showing live percentage changes. This is a beginner‑friendly project to learn Semantic UI components, DOM manipulation, and interactive UI design. Features - Semantic UI progress bar with indicating style. - jQuery + JavaScript for dynamic updates. - Increment (+) and Decrement (–) buttons to control progress. - Live percentage label update. - Centered, responsive design with clean layout. - Beginner‑friendly project for learning Semantic UI + JS integration. Connect with me YouTube: https://lnkd.in/gAtk9suf LinkedIn: https://lnkd.in/gu-ZN9dB Facebook: https://lnkd.in/gZNu3sb3 Instagram: https://lnkd.in/gEUR34hP TikTok: https://lnkd.in/gQvUEgSq GitHub: https://lnkd.in/gTcg6vFt Subscribe for more creative coding demos, Canvas tutorials, and short projects optimized for social platforms 🚀 #semanticui #javascript #jquery #progressbar #webdevelopment #frontenddevelopment #semanticuitutorial #codingforbeginners #htmlcssjavascript #dommanipulation #interactiveui #webdesign #frontendproject #semanticuiprogress #javascriptproject #learnjavascript #codingtutorial #semanticuidemo #webdevelopmentproject #uiuxdesign
To view or add a comment, sign in
-
#Day 60/100 – How JavaScript Powers Real Websites Behind the Scenes 🌐 When we open a website, everything looks simple. Click a button. Submit a form. Scroll. Like a post. But behind that smooth experience… JavaScript is doing A LOT. Today I realized something: JavaScript is not just “adding buttons.” It’s managing the entire interaction layer of the web. Here’s what it actually does behind the scenes: 🔹 Updates content without reloading the page (like Instagram or LinkedIn feed) 🔹 Validates forms before sending data 🔹 Handles API calls and displays live data 🔹 Manages state (what you clicked, typed, selected) 🔹 Controls animations and dynamic UI changes When you add an item to cart — JavaScript updates the UI instantly. When you see notifications — JavaScript fetched that data silently. When a website feels “fast” — That’s JavaScript working smartly. Big realization today 💡 Good JavaScript is invisible. You don’t notice it when it works — You only notice it when it breaks. Frontend is not just design. It’s logic, timing, state, and user experience. 60 days in… and I finally see how powerful this language really is. #100DaysOfCode #JavaScript #WebDevelopment #Frontend #LearningInPublic #CodingJourney
To view or add a comment, sign in
-
-
🔸 I used to think Lighthouse optimization was mostly about configuration tweaks. After seeing the scores barely improve, I realized it’s not about quick fixes, it’s about getting the frontend basics right 💡 Here’s what actually made a difference for me while working on real projects: • Image optimization was the biggest win (WebP/AVIF, correct dimensions, lazy loading) • Reducing JavaScript code through code splitting helped a lot • Removing unused CSS and inlining critical CSS noticeably improved first paint • Fixing render-blocking resources (defer, preload) cleaned up multiple warnings • Core Web Vitals improved only after I fixed layout shifts and heavy initial loads • Font loading (font-display: swap) solved invisible text issues • Cleaning up headings, meta tags, and landmarks boosted SEO score effortlessly #reactjs #nextjs #frontend #javascript #lighthouse #softwaredevelopment #technology #programming #ig
To view or add a comment, sign in
-
-
🚀 Just Built My Own To-Do List Web App using HTML, CSS & JavaScript! Instead of just watching tutorials, I challenged myself to build a fully functional To-Do List application from scratch — focusing purely on DOM manipulation and core JavaScript fundamentals. Here’s what I implemented 👇 🔹 Clean & responsive UI with modern gradient background 🔹 Add tasks dynamically 🔹 Delete tasks instantly 🔹 Real-time task counter 🔹 “Enter” key support for faster input 🔹 Input validation (no empty tasks allowed) 🔹 Smooth UI interactions & hover effects 💻 Tech Stack Used: • HTML5 • CSS3 (Flexbox + Gradients + UI Styling) • Vanilla JavaScript (DOM Manipulation & Event Handling) 📌 What I Learned: ✔️ Selecting & manipulating DOM elements ✔️ Handling events (click & keydown) ✔️ Creating dynamic elements using createElement() ✔️ Updating UI in real-time ✔️ Writing clean, structured JavaScript ✔️ Improving user experience with small UI details One feature I really liked implementing was the live task counter, which updates automatically whenever a task is added or removed — making the app feel more interactive and dynamic. Small projects like this strengthen the foundation much more than passive learning. Next step: Planning to add ➡️ Task completion toggle ➡️ Local storage support ➡️ Dark/Light mode switch ➡️ Edit task feature Would love your feedback and suggestions to improve it further 🙌 #WebDevelopment #JavaScript #FrontendDevelopment #HTML #CSS #DOM #100DaysOfCode #CodingJourney #BuildInPublic #StudentDeveloper #LearningByDoing #TechProjects #OpenToOpportunities
To view or add a comment, sign in
-
🚀 New Project Alert: Web-Based Age Calculator I built a responsive Age Calculator using HTML, CSS and JavaScript that calculates exact age in years, months, and days from date of birth. ✨ Features: ✔ Clean & responsive UI ✔ Accurate age calculation ✔ Modern gradient design 🔗 Live Demo: https://lnkd.in/g_Ka5dkN 💻 GitHub Repo: https://lnkd.in/g5ZqExsh #WebDevelopment #JavaScript #HTML #CSS #Frontend #Projects #LearningByDoing
To view or add a comment, sign in
Explore content categories
- Career
- Productivity
- Finance
- Soft Skills & Emotional Intelligence
- Project Management
- Education
- Technology
- Leadership
- Ecommerce
- User Experience
- Recruitment & HR
- Customer Experience
- Real Estate
- Marketing
- Sales
- Retail & Merchandising
- Science
- Supply Chain Management
- Future Of Work
- Consulting
- Writing
- Economics
- Artificial Intelligence
- Employee Experience
- Workplace Trends
- Fundraising
- Networking
- Corporate Social Responsibility
- Negotiation
- Communication
- Engineering
- Hospitality & Tourism
- Business Strategy
- Change Management
- Organizational Culture
- Design
- Innovation
- Event Planning
- Training & Development