Algolia Search

Indexing

The default behavior creates a record for each paragraph in your document which officially recommended by Algolia.

Each record contains searchable attributes title, section, and content. section is optional, it only exists in paragraphs under headings. Headings and paragraphs are all indexed as a record, and the attribute for distinct is page_id.

Setup

1. Install algoliasearch

   npm install algoliasearch

2. Sign up and obtain the required API keys for your search. Store these credentials in environment variables.

3. Create and sync your index with the sync function.

   import algosearch from 'algoliasearch'
   import { sync } from 'next-docs-zeta/algolia'
   import { structure } from 'next-docs-zeta/mdx-plugins'
    
   const client = algosearch(...)
    
   sync(client, {
     documents: allDocs.map(docs => ({
       ...docs,
       url: getPageUrl(docs.slug),
       structured: structure(docs.body.raw)
     }))
   })

   You may make it a script and manually sync with node ./update-index.mjs, or integrate it with your CI/CD pipeline.

4. To search documents on the client side, you may use the search dialog provided by Next Docs UI, or implement your own for advanced styling.

   In addition, you can use the useAlgoliaSearch hook which handles loading states with SWR.

   import { useAlgoliaSearch } from 'next-docs-zeta/search-algolia'
    
   const index = algoliasearch(...).initIndex('document')
    
   const { search, setSearch, query } = useAlgoliaSearch(index, {
      distinct: 5,
      hitsPerPage: 10
   })

Customise Attributes & Settings

While the default attributes might not suit your case, you can pass extra_data to index options for adding extra fields to each record.

sync(client, {
  documents: allDocs.map(docs => ({
    ...,
    extra_data: {
      tag: docs.tag
    }
  }))
})

To customize the default index settings, set index settings, and update documents with updateDocuments(...) separately.