With well over 600 pages on the website, it's getting difficult to find the good stuff. And we can't be having that.
So after watching the same video a dozen times, I was able to get a search function working on the site. The Search Page scans every blog post and podcast episode for whatever terms you like. Give it a try; I hope you like it!
And if you're interested in how I got it working, read on!
Putting Dynamic Content on a Static Site (for non-developers) #
This website is built using the static site generator Eleventy. I have a folder full of plain text files, and I run them through Eleventy to create a folder full of HTML files. Those files sit on a server waiting for someone to ask for a web page, the server gives them the page, and it gets displayed in their browser. Simple, effective and lightning fast.
The challenge is that all the HTML pages are built once and sit there. Static. But Search is dynamic. That is, I don't know what you're looking for until you tell me, then I have to create a web page of search results on the fly and send that to you. How am I going to pull that off?
Thankfully, Eleventy also has this thing called Eleventy Edge. It lets you put a tiny function on the server that runs when called and does something. Like in this case, interpret a search query and then add the query results to the pre-existing static page before sending it off to your browser.
So my website can still be 1000 static HTML files and be super fast and easy. And there's one page, the search page that is 50% static but has a section that needs to be filled with search results before sending it to you. The 'edge function' I built[1] takes your search terms, queries it against a file of all the text on the website [2], and adds that to the search results page before sending it to your browser.
The entire process took me just over two hours to implement, and that's mainly because I'm not a proper developer so I stepped through the documentation very, very slowly. It took a while to understand where to locate the function so I could test it on my laptop and have it deploy to Netlify properly. The great thing about deploying the site to a service like Netlify is that it works very easily, so long as you use their services the way they are intended to be used. It just takes me longer than most to understand the intended way - it's not intuitive.
If you've read this far and want to learn more about what I did, reach out and I'd be glad to dig into it more. I'm very pleased I got this working and that I understand 95% of what is happening under the hood. But I'm not confident enough with my tech-speak to write a how-to post yet. But if you can put up with some hand waving, I'm your guy.