Angular Local Server: Use ng serve Without Mistaking It for Production

The Angular local server is a development tool: it rebuilds quickly, reloads the browser, and optimises for feedback—not public traffic.

Use Angular CLI to serve the project on your machine, configure a proxy when the API runs elsewhere, and create a production build for deployment.

Table of contents

• Start the development server
• Change host and port carefully
• Proxy API requests
• Fix failures and deploy correctly
• How this fits the rest of the stack
• FAQ

Start the development server

npm install
npx ng serve
# open http://localhost:4200/

Run the command from the workspace containing angular.json. The CLI compiles the selected project, watches source files, and refreshes the page as code changes. Use npx to respect the project-local CLI version.

Change host and port carefully

npx ng serve --port 4300
npx ng serve --host 0.0.0.0

Changing the port resolves local conflicts. Binding to 0.0.0.0 can expose the dev server to your network; use it only on a trusted network and do not treat it as internet-ready hosting.

Proxy API requests

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

Point the serve target at the proxy configuration in angular.json or pass the supported CLI option for your Angular version. The browser then calls /api while the dev server forwards requests, avoiding a duplicate local origin setup.

Fix failures and deploy correctly

• Command not found: install dependencies and use npx ng.
• Port in use: stop the process or select another port.
• API 404: verify proxy path matching and restart the server after config changes.
• Blank deep link in production: configure the web server to fall back to index.html.
• Works locally only: check environment values, base href, CORS, and production build output.

For production, run the configured Angular build and serve the static output through a static hosting service or web server with caching, compression, HTTPS, and route fallback.

How this fits the rest of the stack

Keep ng serve on the development side of the line and deploy its production output as a static site. Estimate the footprint with the RunxBuild calculator and connect the repository in the RunxBuild dashboard.

Useful related references:

• Deploy an Angular App for Free on RunxBuild
• The CLI in Angular: The Commands That Matter Day to Day
• Angular, Meaning: What the Framework Actually Is and When It Fits
• Services on RunxBuild

FAQ

What is the default Angular local server URL?

Angular CLI commonly serves the app at http://localhost:4200/ unless configuration or options change it.

How do I use another port?

Run ng serve with the port option, such as npx ng serve —port 4300.

Can I use ng serve in production?

No. Build the application for production and serve the generated static files through production hosting.

Why does my API work directly but not from Angular?

Check the proxy path, target, CORS policy, environment URL, and whether the dev server was restarted after configuration changes.