preboot/angular-webpack

How to handle nodejs api backend

Closed this issue · 4 comments

Nice starter! Many thanks.
The following is not an issue per se but more a request for advice (perhaps an issue with the docs since they could contain more information on production and API serving):

I'm running my backend with a nodejs server which also manages sessions and login states.
How would I include this with your starter?

  • Keep server completely outside and start as a separate process during development? How would I exchange cookies which contain session data? How to serve index.html on production.

  • Use nodejs to serve index html and have angular take over from there? How to handle development toolchain in that case? Can webpack-dev-server use custom node server?

  • Use a different starter like the universal starter by angular But they currently have no testing included and it all seems mightily complicated. I like the clear structure of your starter.

Thanks for pointing me in a direction. I know the backend is not really the focus of this repo.

I vote you to keep everything separated. One project for backend, one project for the frontend.

You can either deploy them separated (using CORS) or you can deploy it to the same server and redirect via nginx all the requests from /api to the backend and the rest to the frontend.

If you decide to go separate completely, then just create a project and use CORS.

If you decide to develop the project in a separate way but deploy it in the same place, I normally create an extra node project that will proxy /api requests to the backend and the rest of request proxied to the frontend (that is running dev-server). Basically simulate what nginx does in production but locally with node.

That is my way to go.

That being said, you can opt for option two, you can create a backend and have it serve the index.html for angular to take over.

For option three, that is a good option as well if you want to go universal, but honestly, I think universal is not production ready, but I could be wrong.

I agree that in the end you should have a separate api service from your angular app service. That being said, I find it easier to develop the source under the same roof. I do this because all my services from the node api server to angular app are typescript'd. Whats nice is that the api uses the same node_modules and interface/class models as my angular app. Makes it super easy to know my datasets going from the client to the api server and back are type'd the same on both sides.

I do run and compile each service separately, my api compiles to api/ while my angular app compiles to dist/ .. During development I'll have two command prompt windows open, one running the api and one running the webpack'd angular app.

Wow, lots of food for thoughts. It is still all very unclear in my mind. My current angular 1 project was using grunt to manage everything but all was going through node. I think I will:

  • stay with the preboot project
  • manage my server code in the same repo than the frontend code
  • during development: run webpack to serve the client to port X and give it an api url to port Y which is where node will serve the api in a separate process. Maybe use nodemon to watch api code
  • on client: have nginx (or node) serve index html which now has an api url to the same port

Does this sound correct?
Only problem: my angular 1 port uses cookies to manage sessions. How would I do that in my new environment?
During dev : ???
During prod: have the node server load session data from db and give cookie with index html?
Do you guys use a different tools ti have user session data saved between page reliads and browser restarts?
P.s. I thing universal-starter has good points but feels not polished enough yet. I'll recheck when there is a 2.0 non beta release.
Thanks for your thoughts.

As OP, for me the issue is solved. Thanks again for the easy and nice starter. I'm sold ;-)