Future plans

[blaumeise20]

This issue is to track all plans this package has for the future.

Improved response components

Currently there is only one "response type" that is HtmlPage. It would be cool to have multiple other options:

• JsonResponse - You can already think what it should do. It takes a JavaScript object and responses with the stringified version including correct headers.

  const Users: ElementGenerator = () => {
      // do some calculation
      return <JsonResponse data={result} />;
  };
  
  const api = express.Router();
  api.get("/users", createHandler(Users));
  

• Static - The name says the thing. You specify the local path and it will respond with the correct data.

  const Logo: ElementGenerator = () => {
      // do some calculation
      return <Static path="./static/logo.png" />;
  };
  
  app.get("/logo.png", createHandler(Logo));
  

Actual router creation

You should be able to make express routers using special components:

const News: ElementGenerator = () => {
    return <div></div>;
};
const Routes: ElementGenerator = () => {
    return <Router>
        <Route path="/">
            For static content use children of route.
            <img src="logo.png" />
        </Route>
        <Route path="/logo.png">
            <Static path="./static/logo.png" />
        </Route>
        <Route path="/news" content={News} />
    </Router>;
    // and much more
};
app.use(createRouter(Routes));

Better request handling function

When using a HtmlPage with a response status without declaring a component it won't work. Look at this example:

app.all("*", (req, res) => {
    // won't work
    res.send(render(<HtmlPage status={404}>
        ERROR<br />
        This page doesn't exist.
    </HtmlPage>));
});

Instead there should be a handle function returned by the create function used like this:

app.all("*", (req, res) => {
    // will work
    handle(req, res, <HtmlPage status={404}>
        ERROR<br />
        This page doesn't exist.
    </HtmlPage>);
});

IMPORTANT: HTML entities

Currently, when you set an attribute to a string that contains a quote, it will just output it like that and the HTML will be incorrect.

const testAttr = "hello \"world\"";
render(<div test={testAttr}></div>);
// <div test="hello "world""></div>

We should take care of that.

---

If you have any other idea just comment on this issue.