search.js

    inputField.addEventListener('keyup', event => {

        // prevent some evil queries
        const keyword = inputField.value.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, '\\$&')

        // at least two chars needed to trigger the search
        if (keyword.length < 2) {
            return false
        }

        // I use a timeout here, so the search is only then triggered, when the user stops typing for some milliseconds
        // this way you don't flood your site with requests
        clearTimeout(timer)
        timer = setTimeout(() => {
            fetch('/YOURSEARCH-PAGE.json?q=' + keyword, {
                method: 'GET',
            })
                .then(response => response.json())
                .then(response => {
                    // Here you can access the json result and create some html,

                    response.results.forEach((searchResult) => {
                        // get the fields you want
                        const title = searchResult.title;
                    })

                    // Append the generated html where you want it to be displayed
                })
                .catch(error => {
                    console.log(error)
                })
        }, 300)
    })