​
Introduction

Angular is an application-design framework and development platform for creating efficient and sophisticated single-page apps.

​
Prerequisites

  • a UNIX-like system (see WSL if you are using Windows), in order to use the Valyent CLI
  • a Valyent account, with a registered payment method (you can sign up here)
  • NodeJS and NPM installed on your machine

​
Installing the Valyent CLI

curl -L https://cli.valyent.cloud/install.sh | sh

You can inspect the installation script here and the GitHub repository.

​
Authenticating with the Valyent CLI

valyent auth login

​
Installing the Angular CLI

npm install -g @angular/cli

​
Initializing the project

Now, you can use the ng command to create a new Angular project :

ng new <my_angular_app> && cd <my_angular_app>

Now, we can initialize the valyent.toml configuration file, that allows to link the local codebase, to a Valyent application :

valyent init

This command will ask you to select/create a project and an associated application.

​
Adding the Dockerfile

Let’s add a Dockerfile so that Valyent can build a Docker image for your application.

touch Dockerfile

We can fill it with the following :

# Use an official Node runtime as a base image
FROM node:20 as builder

# Set the working directory
WORKDIR /app

# Copy package.json and package-lock.json to the working directory
COPY package*.json ./

# Install Angular CLI globally
RUN npm install -g @angular/cli

# Install project dependencies
RUN npm install

# Copy the application code to the working directory
COPY . .

# Build the Angular application
RUN ng build --configuration=production --output-path=dist

# Use a lightweight base image for the final runtime
FROM nginx:alpine

# Copy the built Angular application from the builder stage to the nginx web root directory
COPY --from=builder /app/dist/* /usr/share/nginx/html/

# Expose port 80 for the nginx server
EXPOSE 80

# Start the nginx server
CMD ["nginx", "-g", "daemon off;"]

​
Setting the PORT environment variable

We can set the PORT environment variable, so that the application listens on the correct port :

valyent env set PORT=80

​
Deploy the project

Then, we can deploy the application :

valyent deploy

Once the deployment is finished, type :

valyent open

to see your Adonis application in your browser.

RemixFastAPI