Skip to content

This issue was moved to a discussion.

You can continue the conversation there. Go to discussion →

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature: Use NestJS integration as SSR/http server #317

Closed
2 tasks
brandonroberts opened this issue Apr 3, 2023 · 21 comments
Closed
2 tasks

Feature: Use NestJS integration as SSR/http server #317

brandonroberts opened this issue Apr 3, 2023 · 21 comments
Labels
enhancement New feature or request

Comments

@brandonroberts
Copy link
Member

Which scope/s are relevant/related to the feature request?

platform

Information

NestJS is very popular Node.js framework for building APIs and is widely used in the Angular ecosystem. This feature would allow NestJS to be used as the server for the /api routes, and provided integration as the backend for SSR.

Links:

In development, NestJS would be configured under the /api path. During the build it would host the Analog application and provide additional configured API routes.

Describe any alternatives/workarounds you're currently using

No response

I would be willing to submit a PR to fix this issue

  • Yes
  • No
@brandonroberts brandonroberts added the enhancement New feature or request label Apr 3, 2023
@Yberion
Copy link
Contributor

Yberion commented Apr 4, 2023

Hello, which adapter will use the implementation?

It would be great if it could use the Fastify adapter by default. 😄

@brandonroberts
Copy link
Member Author

It will be set up in a way where you can control the implementation. There will be an API "entry point" where you can add additional configuration to the NestJS/Fastify adapter.

@goetzrobin
Copy link
Member

Seems like this could be helpful:
https://github.com/wjq990112/nestjs-ssr

@nhvu95
Copy link

nhvu95 commented Apr 15, 2023

Does anyone currently work on this?

@goetzrobin
Copy link
Member

@brandonroberts how should routing work with nest? Since nest has the concept of controllers which themselves have a path and methods inside of these controllers that can have their own path, I think it might be better to just require an app module inside the server folder and then let people define their own structure inside that folder however they please?

@brandonroberts
Copy link
Member Author

Yea, that's where I'm leaning also. Integrating with Nest would be more manual in some regards, because there's no file based routing, and developers would have more control over the server integration

@brandonroberts
Copy link
Member Author

@nhvu95 no one is working on this yet

@goetzrobin
Copy link
Member

@brandonroberts @nhvu95 I can spend some time on this if you are open to that

@goetzrobin
Copy link
Member

Haven't made too much progress unfortunately. I am running into issues with loadSSRModule trying to use the vite-plugin-node and more.
I did find this project however: https://github.com/cyco130/vavite and it has an example that might be helpful.
Specifically these examples:

@brandonroberts just to confirm my overall understanding of what is going on is correct:
In DEV: vite dev server renders our Angular application (and ideally runs the NestJs Express or Fastify server as a middleware under the /api route)
In PROD: vite builds static assets to the public assets folder of the NestJs Express or Fastify server and our code makes that server aware how to render Angular on the server.

Does that sounds about right?

@brandonroberts
Copy link
Member Author

Yes, that sounds right. Maybe we could start by providing an example repo the two working together as a starting point. No rush on this though as we already have a working server solution in Analog and the trpc integration

@jeremylcarter
Copy link

I am happy to help out on this issue. Who is coordinating the effort?

@Flusinerd
Copy link

Flusinerd commented Jul 5, 2023

Hi @jeremylcarter .
I have done some work but ran into a roadblock. If you want you could take a look at this:
https://github.com/Flusinerd/analog-nestjs-example/tree/ssr

Basically the issue is that import.meta.glob does not exist, when using rollup and therefore the analog router can't be imported. If you remove the import of the router in src/app/app.config.ts, then everything works except for the router ofc.

If you have further questions, I'd be happy to help. I also had a bit of a conversation about this on the analog discord inside the Contributing -> ideas channel.

@jeremylcarter
Copy link

Thanks! I'll have a look

@cskiwi
Copy link
Contributor

cskiwi commented Aug 3, 2023

@jeremylcarter Any update/progress on the nestjs integration?

@brandonroberts
Copy link
Member Author

Made some progress here with efforts from @cskiwi

Able to serve/build the nestjs server along with the Analog app in this repo

https://github.com/brandonroberts/nestjs-analog

SSR support still needs work

@cskiwi
Copy link
Contributor

cskiwi commented Sep 5, 2023

@brandonroberts oh nice. I'll try and find some time to look at the SSR, unless you figured it out by then :)

@cskiwi
Copy link
Contributor

cskiwi commented Nov 21, 2023

@brandonroberts, been a bit busy. Any changes regarding the NestJS "integration".

@brandonroberts
Copy link
Member Author

Same here. No new movement on it as of late

@jeremylcarter
Copy link

jeremylcarter commented Nov 23, 2023

Sorry everyone. I was planning on looking at this integration, but I got distracted by Dapr NestJS integration instead :)

https://github.com/jeremylcarter/nest-dapr/tree/feature/actor

What are the blockers for Analog + NestJS?

@cskiwi
Copy link
Contributor

cskiwi commented Nov 27, 2023

I made some progress that can be relevant, right now this is skipping the analog. So just having a NestJs + SSR and native angular.

I think once I get it up and running it should be possible to port for analog.
Repo: https://github.com/cskiwi/herring-gull-angular
Open issues (one is just nx + vite related)

UPDATE; got it all working without analog. will try to port it soon
UDPATE 2: found new issue, shouldn't be blocking

@cskiwi
Copy link
Contributor

cskiwi commented Dec 21, 2023

@brandonroberts, @jeremylcarter

So I finally got some time to work on it, but i'm on a strange roadblock which I can't figure out.
I've made a new nx repo including 3 projects and more or less the latest package versions:

  • A default analog project
  • A Nestjs + Angular project
  • A Nestjs + Analog project

So I'm currently having 2 issues,

1) Analog is not a function

If the package.json includes "type": "module", none of the analog projects build and they throw:

failed to load config from C:\Users\glenn\Documents\Code\cskiwi\analog-nestjs\apps\nestjs-analog\vite.config.ts

 >  NX   analog is not a function

2) vite_dev_server is not a function

If I remove the module type, then the non-analog project won't build with some ESM error, but the default analog project builds, the nestjs-analog project then gives me:


failed to load config from C:\Users\glenn\Documents\Code\cskiwi\analog-nestjs\apps\nestjs-analog\vite.config.ts

 >  NX   (0 , import_expose_vite_dev_server.default) is not a function

So here is where I'm currtly stuck. If anyone wants to have a look at it, feel free to clone the following repo to get going: https://github.com/cskiwi/analog-nestjs

@analogjs analogjs locked and limited conversation to collaborators Mar 27, 2024
@brandonroberts brandonroberts converted this issue into discussion #972 Mar 27, 2024

This issue was moved to a discussion.

You can continue the conversation there. Go to discussion →

Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

7 participants