🔴Live Search Filter from Scratch with HTML, CSS & JavaScript

Welcome, In this video, we will be building a live search filter using HTML, CSS & JavaScript in Hindi. By the end of this tutorial, you will have a dynamic search feature on your website that updates the results in real-time as the user types in the search bar.

We will cover the basics of HTML & CSS to structure and style the search bar, and dive into JavaScript to add interactivity and functionality to our search filter. Whether you are a beginner or have some experience with these technologies, this video is for you! Get ready to take your website to the next level with a live search filter

😊 Become Member, get access to perks, free Source code, & more..

----------- TIMELINE---------
0:00 Introduction
0:40 Prerequisites
1:05 Free Source Code
1:40 Folder structure
1:50 HTML Code
3:45 logic
4:05 CSS top part styling
7:08 important CSS Tips
8:05 Input Search Styling
10:15 User List Styling
11:10 getting user references
12:08 Github user using AsyncAwait
13:50 adding JS file in HTML
14:35 Map & add data in Li Tag
17:00 HTML data
17:50 add dynamic data
20:50 styling dynamic data
25:05 let's tackle loading
25:50 Logic behind search
27:05 search functionality
34:00 More Tips

************* 😍 Must Watch Videos For Web Development 😍 *************

[ThapaTechnical]

😊 Become Member, get access to perks, free Source code, & more..

[omamachohan]

Awesome logic Thanks to Thapa Technical 😇😇

[wizadds]

significant video, do respect to you, sir

[mehranasmat]

Love from Pakistan
Kindly start teaching freelancing along

[AnwarAmazai]

Thapa sir please make a course on Laravel 🥺

[kkingop]

We need more JavaScript Project like this.

[kayasth]

sir ek program bana rahe hain ki ek intiger arrey hai jiske har element main 2 ko jod rahe hain aur ham chahate hain ki iski new value ek naye blank arrey main aaj jaye ye kaam kaise karenge

[nehapatle]

Wonderful sir thank you sach kind of projects and knowledge😊

[rishidongre]

Bhaiyya ek question hai or sayad sab naye developer ke dimag me aata hoga ye ki kon si chij kisse relate hai not in js but very technology jiska ek proper way ho jisme ye samjh me aaye ki kis topic ke bad kon sa topic aata

bas ye bolna chah raha hu ki jab hum kisi bhi technology ko sikh rahe ho uske pahle hume ye samjh me aana chahiye ki kon si chij kisse relate hai like jab job ki bari aati hai tab bahut jyada confusion ho jata hai
ap sahi samjhate ho lekin bas ye keh raha hu ki topic start hone ke pahle agar ye samjh me aajaye ki ye flow hota h real life example me. me topic se relate nhi bol raha hu bas choti choti chije jo connect h bas
or pata nhi me apni bat thik se bol bhi paya ki nhi
sorry agar kuchh glt bola to

[nitishsingh]

Need to know give user name then give all user name list live when searching on github page

[asadlaar]

map is not a function at getuserdata to resolve this error

[thrivenation_]

sir aik react project simple project series again

[abdullahalfahim]

sir, ap naruto fan ho? apke wallpaper mein minato hain

[asadlaar]

fetch me api ko kha se copy ker k paste krna he ...kindly guide me

[shahindomar]

Sir. How to create Search name and Numbers?

[kayasth]

sir ek program bana rahe hain ki ek intiger arrey hai jiske har element main 2 ko jod rahe hain aur ham chahate hain ki iski new value ek naye blank arrey main aaj jaye ye kaam kaise karenge

[kayasth]

sir ek program bana rahe hain ki ek intiger arrey hai jiske har element main 2 ko jod rahe hain aur ham chahate hain ki iski new value ek naye blank arrey main aaj jaye ye kaam kaise karenge

[kayasth]

sir ek program bana rahe hain ki ek intiger arrey hai jiske har element main 2 ko jod rahe hain aur ham chahate hain ki iski new value ek naye blank arrey main aaj jaye ye kaam kaise karenge

[kayasth]

sir ek program bana rahe hain ki ek intiger arrey hai jiske har element main 2 ko jod rahe hain aur ham chahate hain ki iski new value ek naye blank arrey main aaj jaye ye kaam kaise karenge

[kayasth]

sir ek program bana rahe hain ki ek intiger arrey hai jiske har element main 2 ko jod rahe hain aur ham chahate hain ki iski new value ek naye blank arrey main aaj jaye ye kaam kaise karenge