Showcasing: Stackbit, Algolia & on-demand static generation with Next.js
Live demo: search-example.stackbit.app.
Details of all themes in jamstackthemes.dev are copied into this repository (under /content).
Individual themes can be then added & edited within the Stackbit UI, and are indexed to Algolia to power a fast search.
There are currently about ~1,000 themes, and each has its own page. To keep build times short, we're not actually generating all pages at build time. Rather, we use Next's dynamic routes + the fallback parameter to instruct Next to generate pages on demand. Meaning, once per page (after each deployment) only.
If you don't have an existing Algolia account, create one (it's free).
Create a new local project:
npx create-stackbit-app@latest --example algolia-search
cd algolia-searchThen do the following:
- Copy
env.local.exampletoenv.localand set the needed Algolia settings (find them in Algolia's API Keys screen). - Index themes data to Algolia:
npm run index. - Run your site in development mode:
npm run dev. - You can now open localhost:3000.
To edit the site in the Stackbit UI (a.k.a. local dev):
- Install our CLI (if you haven't already):
npm i -g @stackbit\cli. - Run
stackbit dev. - Click the shown URL.
Join us on Discord for community support.
