How to import app files in server file?

[jansedlon]

Hi 👋

Following up on [this discussion](epicweb-dev/epic-stack#713 (comment). Since a custom server lives in a different file or is a separate build, is there a way to import app file in a server code? Let's say in app file I declare a redis instance or db instance and I need to access it in a server file. The best example is using socket.io which is attached to express server and I need to use prisma in that file. I can't really use appLoadContext because I also need it outside of request response scope (background jobs).

I saw that Kent is using monorepo but I'm notnsure this works good with things that need connections and/or must be configurable via env variables.

Is there an example or a suggestion?

Why am I posting it here? To reach bigger audience 🙏

[kiliman]

I'm finishing up a package that lets you create your Express app inside entry.server.tsx.

This way, it's bundled with your Remix app, and you can import app modules. It also supports HMR and simplified dev/build. You just use remix vite:dev and remix vite:build. No more having to start multiple processes or custom servers.

You can configure the Express app to add additional Express middleware and customize the request handler (for example, if you're using Sentry, you need to wrap the request handler).

It also enables custom servers so that you can use HTTPS and HTTP/2.

All of these settings are optional.

Just call createExpressApp and export the app. The export name can be configured in the Vite plugin.

// entry.server.ts
export const app = createExpressApp({
  configure: app => {
    // customize your express app with additional middleware
    app.use(morgan('tiny'))
  },
  getLoadContext: () => {
    // return the AppLoadContext    
    return { hello: () => 'hello world' }
  },
  customRequestHandler: defaultCreateRequestHandler => {
    // enables you to wrap the default request handler
    return process.env.NODE_ENV === 'production'
      ? wrapExpressCreateRequestHandler(defaultCreateRequestHandler)
      : defaultCreateRequestHandler // use default in dev
  },
  getExpress: () => {
    // create a custom express app, needed for HTTP/2
    return http2Express(express)
  },
  createServer: app => {
    // create a custom server for production
    // use Vite config `server` to customize the dev server
    return http2.createSecureServer(
      {
        key: fs.readFileSync(process.cwd() + '/server/localhost-key.pem'),
        cert: fs.readFileSync(process.cwd() + '/server/localhost-cert.pem'),
      },
      app,
    )
  },
})

[jansedlon]

This looks really good. Is there an ETA? I'd need it like right now 😅 Otherwise I can't continue developing business critical feature. Or is there a temporary workaround? I guess temp. Workaround is to copy paste prisma/redis connection to express server file?

Is it gonna be full featured replacement for server file?

[kiliman]

Yes, everything you can do in your Express server file, you can do with this. And because it's typescript, you don't have to run a separate build process.

I'm hoping to have it out later today.

[jansedlon]

That's literally God's given timing 👍 If it's out today, I'll try it out tomorrow and let you know, thank you!