---
title: Creating and deploying an Angular application on Serverless Containers
description: This page shows how to create and deploy an Angular 18 application on Scaleway Serverless Containers.
tags: serverless angular docker
products:
  - containers
dates:
  validation: 2025-05-26
  posted: 2022-04-26
  validation_frequency: 12
difficulty: beginner
usecase:
  - application-hosting
ecosystem:
  - third-party
---
import image from './assets/scaleway-choose-container.webp'
import image2 from './assets/scaleway-deployed-containers.webp'
import image3 from './assets/scaleway-container-endpoint.webp'

import Requirements from '@macros/iam/requirements.mdx'


Angular 19 is the latest development platform that scales from single-developer projects to enterprise-level applications. The platform provides enhanced performance, better server-side rendering, and a robust component-based framework.

### Prerequisites

<Requirements />

- A Scaleway account logged into the [console](https://console.scaleway.com)
- [Owner](/iam/concepts/#owner) status or [IAM permissions](/iam/concepts/#permission) allowing you to perform actions in the intended Organization
- An [SSH key](/organizations-and-projects/how-to/create-ssh-key/)
- A [Container Registry namespace](/container-registry/how-to/create-namespace/)
- Installed [Angular 18](https://angular.dev/installation) and [Node.js](https://nodejs.org/learn/getting-started/introduction-to-nodejs) on your local machine
- Installed [Docker](/tutorials/install-docker-ubuntu-jammy-jellyfish/) for building and pushing the Docker image

<Message type="important">
Make sure `@angular/cli` version 19 or higher is installed on your local machine. If you have not installed it yet, run `npm install -g @angular/cli@latest`.
</Message>

### Creating a demo application

1. Initialize the Angular application:
   ```bash
   ng new demo-app
   ```
2. Enter into the application directory:
   ```bash
   cd demo-app
   ```
3. Run the development server:
   ```bash
   ng serve
   ```
4. Open `http://localhost:4200` in your browser to verify the application. Press `CTRL+C` to stop the server.

5. Add an NGINX configuration file `nginx-configuration.conf` inside the `demo-app` directory with the following content:
   ```nginx
   map $sent_http_content_type $expires {
       default                    off;
       text/html                  epoch;
       text/css                   max;
       application/json           max;
       application/javascript     max;
       ~image/                    max;
   }

   server {
     listen 80;
     location / {
         root /usr/share/nginx/html;
         index index.html index.htm;
         try_files $uri $uri/ /index.html =404;
       }
     expires $expires;
     gzip  on;
   }
   ```

6. Create a Dockerfile. [Learn more about creating Dockerfiles](https://docs.docker.com/get-started/docker-concepts/building-images/writing-a-dockerfile/)
   ```
   # Build and compile the frontend
   FROM node:18-alpine as build-stage
   WORKDIR /app
   COPY package*.json /app/
   RUN npm install -g @angular/cli
   RUN npm install
   COPY ./ /app/
   RUN ng build --output-path=./dist/out --configuration production

   # Serve with NGINX
   FROM nginx:stable
   COPY --from=build-stage /app/dist/out/ /usr/share/nginx/html
   COPY ./nginx-configuration.conf /etc/nginx/conf.d/default.conf
   ```

---

### Building and Publishing the Docker Image

<Message type="important">
Ensure you have [connected your namespace](/container-registry/how-to/connect-docker-cli/) to the Docker CLI before proceeding.
</Message>

1. Build the Docker image:
   ```bash
   docker build -t demo-app:latest .
   ```
2. Tag the Docker image:
   ```bash
   docker tag demo-app:latest rg.fr-par.scw.cloud/demo-namespace/demo-app:latest
   ```
   Replace `demo-namespace` with your namespace name.

3. Push the image to the Scaleway registry:
   ```bash
   docker push rg.fr-par.scw.cloud/demo-namespace/demo-app:latest
   ```

## Deploying the application on Serverless Containers

1. Click **Containers** in the Serverless section of the side menu of the Scaleway console. A list of your container namespaces displays.
2. Click the name of the namespace in which you want to deploy the application. The list of your containers displays.
    <Message type="tip">
      If you do not have a container namespace yet, click **+ Create a namespace** to create a new one.
    </Message>
3. Click Deploy a Container. The container deployment wizard displays.

    Provide the following information to deploy the container:
      - Choose the pushed image in your registry's namespace and set the port value to 80.
        <Lightbox image={image} alt="" />
      - Choose a name and an optional description for the container
      - Define the container's resources
      - Configure the scaling of your application
      - Leave the other options at their default values
4. Click **Deploy a Container** to deploy your application. Your application displays in the list of containers:
    <Lightbox image={image2} alt="" />
5. Click on the container's name. The container information page displays. Click the **Container Settings** tab. The container endpoint displays in the container information block.
    <Lightbox image={image3} alt="" />

Copy the endpoint URL and open it in a web browser. The Angular application displays. It can now automatically scale based on the application's load and within the ranges set for the deployment.

<Message type="tip">
  Remember that Scaleway enforces a DNS query rate limit of 20 queries per second per container instance. Ensure your application adheres to this limit.
</Message>
