Impala

Very simple React and Preact static site generator

npm create impala@latest

Impala is a bare-bones static-site framework, powered by Vite. It currently supports React and Preact. Features include:

• SSG-only, MPA-only. It's iMPAla, not iSPAla.
• File-based routing, with a syntax like Astro and Solid Start
• Static and dynamic routes
• Astro and Next.js-inspired data fetching in getStaticPaths, and getRouteData
• Route-level code-splitting
• Optionally JS-free

Usage

Routing

Create pages in src/routes and they will be available as routes in your site. For example, src/routes/about.tsx will be available at /about. You can also create dynamic routes, like src/routes/blog/[slug].tsx, but you'll need to add a [slug].data.ts file with a getStaticPaths function to tell Impala what paths to generate and the data to use.

You can also do catch-all routes, like src/routes/blog/[...slug].tsx, which also needs a [...slug].data.ts file with a getStaticPaths function.

Data fetching

For dynamic routes you should fetch data in getStaticPaths. For static routes you should fetch data in getRouteData. For example, if you have a route at src/routes/blog/[slug].tsx, you should create a src/routes/blog/[slug].data.ts file with a getStaticPaths function. This function should return an array of paths to generate, and the data to use for each path.

See the demo site for more.

FAQ

Why did you build this?

Mainly to learn, but also because there's no statically-rendered create-react-app equivalent. I often want a simple React site with static rendering but no SSR. Astro is awesome, but I want something that's more vanilla React.

Does it support SSR

Deliberately not. If you want SSR, use Astro.

Does it support client-side navigation?

Deliberately not. If you want client-side navigation, use one of the many other SPA frameworks.

License

Copyright © 2023 Matt Kane. Licenced under the MIT licence.

Impala logo created by Freepik - Flaticon