# Deploy an Application with a Dockerfile on Clouddley

Deploying applications with a **Dockerfile** on **Clouddley** allows you to containerize and manage your application efficiently. This guide provides step-by-step instructions on deploying an Express.js application using a Dockerfile, ensuring a seamless and reliable deployment process.

## Prerequisites

* A [GitHub](https://github.com/) or [Bitbucket](https://bitbucket.org/product) Account.
* A [Clouddley](https://clouddley.com/) account.
* Basic understanding of [Docker](https://www.docker.com/). 
* An [Express.js](https://expressjs.com/) application.
* A virtual machine on a Cloud platform or bare metal server.

## Creating a Dockerfile

In the application root directory, create a Dockerfile  `triggr.dockerfile`  that defines how the app should be containerized.

{% hint style="info" %}
**Best Practice:** When creating a Dockerfile, use a lightweight base image (e.g., `node:alpine` for Node.js apps) to reduce image size. Always specify exact versions for dependencies to ensure consistency.
{% endhint %}

{% code title="triggr.dockerfile" %}

```docker
# Use an official Node.js runtime as a parent image
FROM node:18-alpine

# Set the working directory in the container
WORKDIR /app

# Copy package.json and package-lock.json first for dependency installation
COPY package*.json ./

# Install dependencies
RUN npm install --omit=dev  # Use --omit=dev for production builds

# Copy the rest of the application code
COPY . .

# Expose the application port (ensure it matches the port your app listens on)
EXPOSE 3011

# Define the command to run the application
CMD ["node", "./bin/www"]
```

{% endcode %}

### Building and Running the Container Locally

Before deploying to **Apps**, verify that the container works locally.

1. **Build the Docker image**:

   ```
   docker build -t my-express-app -f triggr.dockerfile .
   ```
2. **Run the container**:

   ```
   docker run -d -p 3011:3011 --name express-container my-express-app
   ```
3. **Verify the app is running** by visiting `http://localhost:3011`.

### Deploying the Application

#### **Accessing Apps**

* Open your web browser, log in to your Clouddley account
* Navigate to [Apps](https://app.clouddley.com/apps) and click on **Deploy** **App.**

<figure><img src="https://3695617198-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F1yp2SdNQtlQTJArGRUVU%2Fuploads%2FZ9UIaou7OsXgWrGxdGrz%2FApps-dashboard.png?alt=media&#x26;token=2879b599-28d6-4dce-ab03-022be8451432" alt="Image of Apps dashboard on Clouddley."><figcaption><p>Accessing Apps </p></figcaption></figure>

#### **Step 1: Configure Service**

* Choose your Git hosting service; either **GitHub** or **Bitbucket**. For this tutorial, we will be using GitHub.
* Click on **Continue with GitHub**

<figure><img src="https://3695617198-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F1yp2SdNQtlQTJArGRUVU%2Fuploads%2FbcWQIDhWUOzWq5rdL6Tj%2FApps-configure-service.png?alt=media&#x26;token=af423ea1-36de-4614-8838-63b283e0768a" alt="Configuring Git hosting service during app deployment on Clouddley."><figcaption><p>Choose your Git hosting service</p></figcaption></figure>

#### **Step 2: Configure Git**

* To connect your GitHub user or organization account, click the **Select username/organization** dropdown and **Add GitHub account.**
* Select your **repository** and the **branch** from the dropdown list or quickly search.
* Click on **Next**

<figure><img src="https://3695617198-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F1yp2SdNQtlQTJArGRUVU%2Fuploads%2F3nnIjU5S70RcO9YhTcnj%2FApps-configure-git.png?alt=media&#x26;token=a42cb06e-0b64-480c-8ead-8e0315673f87" alt="Configuring the Git repository during app deployment on Clouddley."><figcaption><p>Setup the Express.js application repository on Clouddley</p></figcaption></figure>

#### **Step 3: Configure your Virtual Machine**

In the Choose or add server dropdown, select your virtual machine (VM) if it’s already listed. If not, select **+ Add Virtual Machine**.

Enter the following details to configure your VM:

* Hostname or IP address
* Username
* SSH port

After adding the details, use the **Clouddley CLI** (recommended) or connect via **SSH** to verify the connection.

{% tabs %}
{% tab title="Clouddley CLI" %}
The Clouddley CLI is a command-line tool that allows you to interact with the Clouddley Platform from your terminal.

* Open the command line of the remote VM you want to configure to Clouddley and install Clouddley CLI by running the command:

```bash
curl -L https://raw.githubusercontent.com/clouddley/cli/main/install.sh | sh
```

* To add the SSH public key, run the command:

```bash
clouddley add key
```

Using the CLI, you can deploy resources, manage configurations, and automate tasks efficiently.
{% endtab %}

{% tab title="SSH" %}

* Download the public key to your local machine.
* Ru**n** the provided command on your local machine, allowing Clouddley to connect to your virtual machine.

```
ssh-copy-id -f -i ~/path/to/downloaded/Publickey username@ipaddress
```

{% hint style="info" %}
Replace `~/path/to/downloaded/Publickey` ,`username` and `ipaddress`  with your actual values.
{% endhint %}
{% endtab %}
{% endtabs %}

* Click on **Verify**. This verifies the connection.
* Click on **Next**

<figure><img src="https://3695617198-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F1yp2SdNQtlQTJArGRUVU%2Fuploads%2FXBv3Sr2YqW1wPzRP9db9%2FApps-configure-VM.png?alt=media&#x26;token=52a58031-ed82-49c2-bf3e-5a117d201687" alt="Configuring the virtual machine during app deployment on Clouddley."><figcaption><p>Configuration of virtual machine on Clouddley</p></figcaption></figure>

#### **Step 4: Configure app settings**

* Insert the **name** of the application and its **port.**
* Click on **Next**

<figure><img src="https://3695617198-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F1yp2SdNQtlQTJArGRUVU%2Fuploads%2F03KuK138WDsibUGISTMg%2FApps-expressjs-name.png?alt=media&#x26;token=86b8974c-9814-4f18-bdb7-93fa9325ee9d" alt="Configuring App settings (name and port) during app deployment on Clouddley."><figcaption><p>Configure the App name and port</p></figcaption></figure>

{% hint style="info" %}
The firewall of the virtual machine should allow access to the application port.
{% endhint %}

#### **Step 5: Configure Environment Variables**&#x20;

* To add environment variables, click on  :heavy\_plus\_sign: <mark style="color:blue;">**Add Variable**</mark>&#x20;
* Choose an **ENV mode**, which can be either single or **import variables.** Learn more [here](https://docs.clouddley.com/apps/extras/environment-variables).

{% tabs %}
{% tab title="Single Variable" %}

<figure><img src="https://3695617198-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F1yp2SdNQtlQTJArGRUVU%2Fuploads%2FltsodwqaWm7fIvzp3V0H%2FTA-singleVar.png?alt=media&#x26;token=341b06bb-cb42-4ef4-a4bd-5a03ba8ea503" alt="Image showing the single variable ENV mode on Clouddley." width="563"><figcaption><p>Single variable ENV mode</p></figcaption></figure>
{% endtab %}

{% tab title="Import Variables" %}

<figure><img src="https://3695617198-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F1yp2SdNQtlQTJArGRUVU%2Fuploads%2F47GAv9MeC0vjtNZfvXSG%2FTA-importVar.png?alt=media&#x26;token=2e757a76-177e-40ae-b6d5-212b26ee0544" alt="Image showing the Import Variables ENV mode on Clouddley." width="563"><figcaption><p>Import variables ENV mode</p></figcaption></figure>
{% endtab %}
{% endtabs %}

* Add the key-value pairs and click on **Save**
* Click on **Next**

<figure><img src="https://3695617198-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F1yp2SdNQtlQTJArGRUVU%2Fuploads%2FBVwpx0Pqxlti4WL1xey1%2FApps-expressjs-env.png?alt=media&#x26;token=522fd59f-b699-458b-a018-7e1b976d158c" alt="Image showing environment variables added during app deployment on Clouddley."><figcaption><p>Adding environment variables</p></figcaption></figure>

#### **Step 6: Set up Notifications (optional)**

* To configure the **notification settings** of the application, click on :heavy\_plus\_sign: <mark style="color:blue;">**Add Alert**</mark>
* Select the **Alert type.** For this tutorial, we will set up Email alerts.
* Toggle on the buttons of the deployment event (failed, timed out, or success)  you want to be notified of.
* Enter the **Email address** where you want to receive alerts. (You can add multiple email addresses)
* Click on **Save**
* Click on **Deploy**

<figure><img src="https://3695617198-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F1yp2SdNQtlQTJArGRUVU%2Fuploads%2F6N1TWzXEGkaj4vLbtX03%2FApps-notif.gif?alt=media&#x26;token=f5ba3c3e-c8cf-43bd-8071-97c10ca466d9" alt="A gif showing how to set up notifications on Clouddley."><figcaption><p>Notifications set up and creation of Express.js application on Clouddley</p></figcaption></figure>

#### **Step 7: Test and Verify the app**

* Click on **Go to Dashboard. Y**our app will be visible on the apps dashboard.
* After the app deployment is complete, the app status changes from `Deploying` to `Online`&#x20;

<figure><img src="https://3695617198-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F1yp2SdNQtlQTJArGRUVU%2Fuploads%2FkrX5idj5IwN2ExpWOOCV%2FApps-expressjs-dashboard.png?alt=media&#x26;token=d533621f-b2c0-4d00-8ca9-9f3e0e4ddaeb" alt="An image of the overview of a successfully deployed Express.js application on Clouddley."><figcaption><p>Express.js application dashboard overview</p></figcaption></figure>

* Click on :globe\_with\_meridians: **Website** at the top right corner of the page, which opens the URL of the deployed application in your browser.
* You can test the application functionalities.

<figure><img src="https://3695617198-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F1yp2SdNQtlQTJArGRUVU%2Fuploads%2FubHnniQI53L6tZ0zPrJb%2FTA-expressjs.png?alt=media&#x26;token=16240eb9-370c-4f72-a30f-3faa80ce2db9" alt="An image of the Express.js application running from Clouddley on the web."><figcaption><p>Express.js application running from Clouddley on a cloud virtual machine</p></figcaption></figure>

The Express.js application has been successfully deployed on Clouddley with a Dockerfile. You can manage it from the application dashboard by selecting the three-dot menu (**…**) in the top-right corner, where you will find options to **Edit, Instant Rollback, Scale, Pause, or Delete** the deployment.

Additionally, you can navigate through the dashboard tabs to:

* View deployment history
* Access and download logs
* Add a custom domain
* View and manage environment variables

## Conclusion

Following these steps, you have successfully deployed an Express.js application with a **Dockerfile** on Clouddley. This method ensures a consistent, scalable, and efficient deployment workflow.  Check out the source code for this application [here](https://github.com/clouddley/examples/tree/main/nodejs/express).