Behind The Scenes: Edition 2 - Adding Search To A Static Site
We recently added the ability to search on our website. In total, we’re using: React and Lunrjs for our search functionality. Lunrjs is simpler, javascript version of solr which is an open source enterprise search platform. If you’ve heard of elasticsearch, solr is a similar product to that.
First, we build out jekyll documents into a JSON array and expose them to the window object using javascript:
There is some complexity that we handle by passing in flags to which type of collection we want to index on that particular page:
- If we’re on the /blog page of our site we only want to search blog entries. Makes sense right? If we’re on the /social page to view our social media posts we only want to search social posts.
- If we’re on the home page we want to search blog and social posts so in that case we pass the flag as true for both the blogDocs and the socialDocs.
Check part two of how we integrated this search with React to render the results.