We need to get the search query from the user to run a search. Now, we have all our documentation page data in a lunr search engine loaded on the client and ready for a search anytime the user visits the /search page. Then, we loop over all our global pages and add them to the index. We can even boost the importance of fields when searching, like increasing the importance of matches in page title over page content. We build out our new searchIndex by telling lunr about the shape of our data. We'll handle our custom search logic in a separate search.js script. Now we need to index our serialized page data with lunr. It creates a JavaScript global variable, pages, and uses Jekyll data to build out the values from site content pages. The above HTML fragment is the basic structure of the search page. This all comes together on a search.html page. We use these to build out an object with other important page context, like page title and url. We can serialize our data for search using Jekyll's native filters like: xml_escape, strip_html, and jsonify. Lunr takes an array of keyed objects to build its index, so we need to get our data to the client in the right shape. Plus, it's only 8.4 kilobytes, so we can easily run it client-side. We found a project called Lunr.js, which is a lightweight full-text search engine inspired by solr. That's smaller than some JavaScript libraries. That's actually not much data as it turns out-only 35 kilobytes when serialized for search. Our documentation is about 43,000 words spread across 39 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. We've recently added Search to the TrackJS Documentation site, built using the Jekyll website generator and hosted on GitHub Pages. How do you allow users to search when you have no server functions and no database? But the awesome simplicity of website generators is also limiting. Static website generators like Gatsby and Jekyll are popular because they allow the creation of complex, templated pages that can be hosted anywhere.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |