Adding Search to Your Site with JavaScript

Static website generators like Gatsby and Jekyll are popular because they allow the creation of complex, templated pages that can be hosted anywhere. But the awesome simplicity of website generators is also limiting. Search is particularly hard. How do you allow users to search when you have no server functions and no database?

With JavaScript!

We’ve recently added Search to the TrackJS Documentation site, built using the Jekyll website generator and hosted on GitHub Pages. GitHub wasn’t too keen on letting us run search functions on their servers, so we had to find another way to run full-text search on our documentation.

Our documentation is about 43,000 words spread across 39 pages. That’s actually not much data as it turns out–only 35 kilobytes when serialized for search. That’s smaller than some JavaScript libraries.

Building the Search Index

We found a project called Lunr.

Check Full Content Here […]