Here are the important steps for building a live search filter using HTML, CSS, JavaScript
HTML:
Create a container for the search bar and the results.
Add a search input field with a label.
Create a container for the results.
CSS:
Style the search bar container.
Style the search input field.
Style the results container.
JavaScript:
Fetch data from the Github API using the fetch() method.
Parse the data to extract the relevant information for the search.
Select the search input field and the results container.
Attach an event listener to the search input field to listen for changes.
Inside the event listener, get the value of the search input field.
Use the value to filter the results.
Update the results container with the filtered results.
Add debouncing to limit the number of times the event listener is triggered.
Note: These steps provide a basic outline, and the actual implementation will depend on the specific requirements of your project. Additionally, you will need to obtain a personal access token from Github to access the API.
Get the Source Code: https://github.com/thapatechnical/livesearch_filter_js
