I recently discovered a static site generator called Astro, which supports many syntaxes but the .astro is a nice mix of TypeScript and JSX-like syntax. Content can use MDX which is like Markdown but with {JSX} style markup for variables and etc. The static components are used very similar to React, with familiar import statements and <ComponentName props=etc> patterns. It is extremely easy to pick up. Best of all, it has plugins to support all sorts of other interactivity, so you can create interactive 'islands' of content using React or Preact or SolidJS or Vue etc. That way you have most of your content statically generated, and then the dynamic parts can be done from the client side.

Best of all, if you use simple unchanged files for other dynamic stuff like JSON etc, you can just generate those on build and serve those files in the host directly as the 'response' to a simple REST request, which is sometimes overlooked despite being the most fundamental form of a REST API.

https://astro.build/

I came across this after researching various options for a website that had, mostly for my own entertainment, restrictions on wanting to be mostly statically generated but customizable easily without learning a lot of new syntax / etc, something JSX-like with Markdown support etc, and MDX was an immediate find - and astro was the easiest SSG I found for it after trying with 11ty and several others. Actually felt like a delight playing with it.

> if you use simple unchanged files for other dynamic stuff like JSON etc, you can just generate those on build and serve those files in the host directly

Other web frameworks support this too, if you look for "static export" options. Next.js, for example, supports this via the getInitialProps function.

What I like especially about Astro, that you perform this data loading during build time from any component/file on your page. With Next.js, this is only possible via the top level Page component.

That is legacy, the current way with page router model is to use getStaticProps or getServerSideProps.

And if using app router model, that is part of React server components.

I love astro. I use it for one of game curation projects. https://exhibitplay.com/

Built a few reusable templates and JSON for storing game data (maybe not ideal at scale, but seems to be working for now). JavaScript, CSS, and MDX. Hosted on Netlify which is an 'Official Deployment Partner'. It's light and simple. So far has been a joy to work with.