I added a React component to a page in Astro. The component was written in .tsx.

To use this component, I needed to do followings:

Install @astrojs/solid-js.

npx astro add solid

Update astro.config.mjs to have solidJs() in integrations.

export default defineConfig({
  integrations: [mdx(), solidJs(), tailwind({ applyBaseStyles: false })],
  output: "server",
  adapter: adapter
});

What is SOLID.JS?

https://www.solidjs.com/

Solid is a modern JavaScript framework designed to build responsive and high-performing user interfaces (UI). It prioritizes a simple and predictable development experience, making it a great choice for developers of all skill levels.

This doesn’t tell much.

SolidJS in Astro

What is SOLID.JS?