angular-cli with an express project

Question

I have a project with Express, MongoDB and the REST API. Now I want to add to the project Angular using angular-cli. I have some questions regarding how should I do it.

This is my current project structure:

1) In which folder should I use ng new?

2) Now I use nodemon to start the server at http://localhost:3000/ but Angular starts at http://localhost:4200. How to make so that Angular runs on the same server as express and to start the server with nodemon as before?

3) How to distinguish between express node_modules and angular node_modules when doing npm install?

4) Which are the steps I need to do to access the api from angular page?

Answer 1

1. You can put it anywhere (not identical which express folder)
2. Say we have a server running on http://localhost:3000/api and we want all calls to http://localhost:4200/api to go to that server.

We create a file next to our project's package.json called proxy.conf.json with the content

{
  "/api": {
    "target": "http://localhost:3000",
    "secure": false
  }
}

you can read more in https://github.com/angular/angular-cli/blob/master/docs/documentation/stories/proxy.md

3. Just use 2 folder different

4. After proxy you can call it like a URL path for the proxy

After all of this you just remenber angula is a fondend you can build this will render a html and js you can host this html, js in your express server