Skip to content

Middleware that uses lite-jsx to render JSX templates in an Express application.

License

Notifications You must be signed in to change notification settings

lite-jsx/express

Repository files navigation

Lite JSX - Express Middleware

License Build Actions NPM Version NPM Downloads

Lite JSX is a lightweight JavaScript library that allows you to create and manipulate JSX elements using only vanilla JavaScript.


Installation

You can install Lite JSX via npm:

npm install @lite-jsx/core @lite-jsx/express

Using Lite JSX with Express

To use Lite JSX with Express, you can create a middleware that overrides the default res.render function to add support for JSX templates. Here's an example:

const express = require("express");
const { liteJsx } = require("@lite-jsx/express");
const Home = require("./home");

const app = express();

// Use the middleware to enable Lite JSX rendering in the Express app.
app.use(liteJsx);

// Render the component using Express.
app.get("/", (req, res) => {
  const data = { message: "Hello, world!" };
  // the render method now is override to use jsx components
  res.render(Home, data);
});

app.listen(3000, () => {
  console.log("Server is listening on port 3000!");
});

To enable Lite JSX in our Express app, we're using the liteJsx middleware, which overrides the default res.render function to add support for JSX templates.

This way, we can pass a JSX component to res.render and it will be rendered as HTML.

And that's it! With these few lines of code, you can start using Lite JSX with Express to create powerful, dynamic web applications.


Contributing

If you'd like to contribute to Lite JSX, please feel free to submit a pull request or open an issue on GitHub:

https://github.com/lite-jsx/express

License

Lite JSX is licensed under the MIT License.