Skip to content

Commit

Permalink
Minor edits
Browse files Browse the repository at this point in the history
  • Loading branch information
m-allanson authored May 16, 2018
1 parent 87f15de commit d29b395
Showing 1 changed file with 6 additions and 6 deletions.
12 changes: 6 additions & 6 deletions docs/docs/adding-search.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,27 +19,27 @@ Then there are two ways to add search to your site:

## Search Index

The search index is a copy of your data stored in a search-friendly format. The purpose of storing an index is to optimize speed and performance in finding relevant documents for a search query. Without an index, every search would need to scan every page in your site, which would be too slow.
The search index is a copy of your data stored in a search-friendly format. The purpose of storing an index is to optimize speed and performance in finding relevant documents for a search query. Without an index every search would need to scan every page in your site which would quickly become very inefficient.

## Search engine

The search engine takes a search query, runs it through the search index, and returns any matching documents.

## Visual component

The visual component provides an interface to the user, which allows them to write search queries and view the restuls of each query.
The visual component provides an interface to the user, which allows them to write search queries and view the results of each query.

# Adding search to your site

Now that you know the three required components, there are few ways to approach adding search to your Gatsby-powered site.
Now that you know the three required components, there are a few ways to approach adding search to your Gatsby-powered site.

## Use an open source search engine

Using an open source search engine is always free and allows you to enable offline search for your site. Note that you need to be careful with offline search because the entire search index has to be brought into the client, which can affect the bundle size significantly.

Open source libraries like [`elesticlunr`](https://www.npmjs.com/package/elasticlunr) or [`js-search`](https://github.com/bvaughn/js-search) can be used to enable search for your site.
Open source libraries like [`elesticlunr`](https://www.npmjs.com/package/elasticlunr) or [`js-search`](https://github.com/bvaughn/js-search) can be used to enable search for your site.

Note that doing so will require you to create a search index when your site is built. For `elesticlunr`, there is a plugin called [`gatsby-plugin-elasticlunr-search`](https://github.com/andrew-codes/gatsby-plugin-elasticlunr-search) that creates a search index automatically.
Doing so will require you to create a search index when your site is built. For `elesticlunr`, there is a plugin called [`gatsby-plugin-elasticlunr-search`](https://github.com/andrew-codes/gatsby-plugin-elasticlunr-search) that creates a search index automatically.

For other libraries, you can use a combination of [`onCreateNode`](https://www.gatsbyjs.org/docs/node-apis/#onCreateNode), [`setFieldsOnGraphQLNodeType`](https://www.gatsbyjs.org/docs/node-apis/#setFieldsOnGraphQLNodeType) and [`sourceNodes`](https://www.gatsbyjs.org/docs/node-apis/#sourceNodes) from the Gatsby node API to create the search index and make it available in GraphQL. For more info on how to do this check out [`gatsby-plugin-elasticlunr-search`'s source code](https://github.com/andrew-codes/gatsby-plugin-elasticlunr-search/blob/master/src/gatsby-node.js#L88-L126).

Expand All @@ -53,4 +53,4 @@ If you're building a documentation website you can use [Algolia's DocSearch feat

If your website does not qualify as documentation, you need to collect the search index at build time and upload it using [`gatsby-plugin-algolia`](https://github.com/algolia/gatsby-plugin-algolia).

When using Algolia, they host the search index and search engine for you. Your search queries will be sent to their servers, which will respond with any results. You'll need to implement your own visual component; Algolia provides a [React library](https://github.com/algolia/react-instantsearch) which may have components you'd like to use.
When using Algolia, they host the search index and search engine for you. Your search queries will be sent to their servers which will respond with any results. You'll need to implement your own visual component; Algolia provides a [React library](https://github.com/algolia/react-instantsearch) which may have components you'd like to use.

0 comments on commit d29b395

Please sign in to comment.