Search Autocomplete Stimulus

Review search results in a dropdown

Image by Author

Introduction

Learn how to set-up a search autocomplete with Stimulus. A user can see query results after typing in the input field. The Stimulus Autocomplete library is a Stimulus controller that provides an easy solution to auto-completion.

Before you start

Make sure you have Stimulus installed. Check the package.json file or run yarn why stimulus. If Stimulus is not yet installed, follow the documentation.

1. Install package

Add stimulus autocomplete to your project
yarn add stimulus-autocomplete

2. Import library

Add to the index.js file

3. Add basic HTML layout