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, andgetRouteData - Route-level code-splitting
- Optionally JS-free
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.
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.
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.
Deliberately not. If you want SSR, use Astro.
Deliberately not. If you want client-side navigation, use one of the many other SPA frameworks.
Copyright © 2023 Matt Kane. Licenced under the MIT licence.
Impala logo created by Freepik - Flaticon