Tutorial/Blog: how to mount LB app as Express/Koa middleware

[dhmlau]

Description / Steps to reproduce / Feature proposal

Per our discussion with @raymondfeng @bajtos and others, users can mix and match using LoopBack and Express, taking the best of both framework.
LB can have a facade application that can continue to use express for hosting capability but can compose different segment of the route.  LB app can be mounted to express / koa as middleware.

See also #1293 Allow app developers to configure custom Express middleware

Acceptance Criteria

• Create a sample app built from the tutorial (see TodoList tutorial for reference)

[bajtos]

See #691 and #1818 for related discussions we have had in the past.

With the current code base and APIs, it's already possible to mount LB4 REST API as an Express middleware.

const mainApp = express();
const apiApp = new MyLb4Application();

mainApp.use('/api', apiApp.requestHandler);
mainApp.use(express.static('./assets'));

mainApp.listen(3000);

[drouillard]

This would be helpful. I know target market is API developers, but when getting started it is nice to be able to plug in views without having to launch a separate React App or similar.

I ended up doing this which I can't imagine is your desired solution :)

// @ts-ignore
  const expressApp = app.restServer._expressApp;

  expressApp.set('view engine', 'ejs');
  expressApp.set('views', path.join(__dirname, 'views'));

I looked into overriding Rest Server and Rest Application but the learning curve was too much for a days worth of trial / error. The above solution of mounting inside of an Express works well and is cleaner. I wanted to try out loopback-authentication though hence the hack I did.

(Overall though, lb4 seems promising. Congrats on GA release)

[jannyHou]

@drouillard Thank you for sharing a solution from a different perspective! I think your approach and the one in the original comment serves different requirements:

launching an express app

Developers can take this approach when they only want to mount loopback app's APIs as a whole without interfering with its implementation details.

build routes on top of express app in rest server

As you explained, it's good for adding plugin like views on top of an existing loopback app.

We could investigate and document both.

[drouillard]

@jannyHou good clarification. I was able to interfere with some of the LB4 implementation details even when mounting it as above by setting a view engine on the express app at large. However, setting the base views directory did not work, hence the hack above. It makes sense though, as that is not intended use, nor should it be. I was thinking originally that I would be able to create an inherited version of the Rest Server or someone how along configs to it. However, I am guessing that is a poor solution in general given the evolution of LB3 to LB4. Seems like the current implementation is locked down due to issues with people hacking at express and then it causing 'loopback' issues.

[raymondfeng]

An example - https://medium.com/beadlist/tutorial-using-loopback-4-together-with-next-js-on-one-heroku-instance-306dd76d02a6

See https://github.com/welldan97/frogfish