Algolia Search with Contentful in 2023

I had to dig a lot in the documentation of Contentful and Algolia to integrate Algolia search with Contentful. So I am putting my learning here to make this integration super easy for the next developer.

Pre-requisite:

• Understanding of Content-type and Content in Contentful

Logic: Algolia Search keeps an entry of all the records in their server. So when a user makes a search request, results are shown from Algolia and not from Contentful. Every time a record is updated or deleted in COntenful, this needs to be informed to Algolia.

Go to Settings -> Webhooks in Contentful.

• Create an Application in the Algolia dashboard and add Algolia Application ID.
• The index name (in our case, this is posts) is the name of the index you created in the Algolia Index.
• The API key can be found on the Algolia dashboard. This is the admin key in Algolia Dashboard for API keys.

Once you create this webhook. Every change in records of this content type would be updated in Algolia records. This can also be configured later in webhooks in Contentful. Refer screenshot:

Now we need to work on step 2, getting records from Algolia.

Here is the code to put anywhere in the codebase.

Replace app-id and algolia-admin-api-key values from the Algolia dashboard and query text with your query text.

import algoliasearch from ‘algoliasearch’

const client = algoliasearch(‘app-id’, ‘algolia-admin-api-key’);

const index = client.initIndex(‘posts’);

index.search(‘query text’).then(({ hits }) => {

console.log(hits);

});

You would see results something like this:

Conclusion: Algolia Search with Contentful requires creating an application in Algolia and creating an index inside. Next, create a webhook in Contentful to connect with Algolia. Third, hit API to get a response from Algolia.

I would be happy to discuss it further if needed :)