This section we will be setting up the UI part of searchkit.
Also see Create React App if you're not using NextJS.
Setup Apollo Client
We add the @apollo/client & next-with-apollo dependencies via yarn
yarn add next-with-apollo @apollo/client
Then we configure apollo with next.
Now when you visit the root page, should perform a basic GQL query to the searchkit API for a list of hit ids. If it works, you should see a list of ids rendered. If it doesn't work, check the host is correct in the apollo configuration and make sure you can perform the same query on the graphql playground.
Setup a basic Searchkit UI
Next we need to add the searchkit client API to the client. Searchkit client API simplifies managing the query and filter state on the client.
Searchkit provides a
withSearchkit HOC that simplifies adding the provider and instantiating a new SearchkitClient.
First install the searchkit/client dependency via yarn
yarn add @searchkit/client
then update the root page to use the searchkit HOC
Next you have a choice of two paths: