🔄 Update "A simple installation guide for Nginx Proxy Manager" (#923)

Fix #861

tutorials/installing-nginx-proxy-manager/01.en.md

@@ -2,7 +2,7 @@
 SPDX-License-Identifier: MIT
 path: "/tutorials/installing-nginx-proxy-manager"
 slug: "installing-nginx-proxy-manager"
-date: "2022-03-22" 
+date: "2024-08-27" 
 title: "A simple installation guide for Nginx Proxy Manager"
 short_description: "Nginx Proxy Manager - Expose your services easily and securely."
 tags: ["Development", "Lang:JS", "Lang:HTML", "Lang:CSS", "Nginx", "Web", "Reverse Proxy", "Docker Tools"]
@@ -18,179 +18,202 @@ cta: "cloud"
 
 # Introduction
 
-We will be installing [Nginx Proxy Manager](https://nginxproxymanager.com) which is an open-source software made for using the Nginx webserver easily via a user interface. With Nginx Proxy Manager, you'll be able to create proxy hosts, redirection hosts, streams which are a relatively new feature in Nginx, and 404 hosts.
+We will be installing [Nginx Proxy Manager](https://nginxproxymanager.com) which is an open-source software made for using the Nginx webserver easily via a user interface. With Nginx Proxy Manager, you'll be able to create proxy hosts, redirection hosts, streams, and 404 hosts.
 
-## Prerequisites
+**Prerequisites**
 
-- A Hetzner account with your preferred payment method added.
-- A cloud server with a dedicated IPv4 address.
+- A server with a dedicated IPv4 address
 - Basic knowledge of Linux & the terminal
 - Ports 80, 81, 443 available
 
-What you should know before we start:
+<br>
 
-- Username: `root` (Your SSH user, this is the default user)
-- Hostname: `<your_hostname>` (e.g. sub.domain.tld)
-- Domain: `<domain.tld>` (e.g. example.com)
-- Subdomain: `<sub.domain.tld>` (e.g. sub.example.com)
-- IPv4 Address: `192.0.2.1` (Standard IP Address)
+**Example terminology**
 
-## Step 1 - Renting your server from Hetzner
+- Server
+  - Username: `holu` (user with sudo permissions)
+  - Publis IPv4 address: `203.0.113.1`
+- Domain: `example.com`
 
-### Choosing a project
+## Step 1 - Create a new server
 
-First off, log into Hetzner's [Cloud console](https://console.hetzner.cloud) and choose the project you want to deploy the VPS in.
+Create a new server, e.g. with [Hetzner](https://docs.hetzner.com/cloud/servers/getting-started/creating-a-server).
 
-![Project_choose](images/Qy1q988Y.png)
+When you create your server, make sure you select an operating system that is supported by [Docker](https://docs.docker.com/engine/install/). This tutorial will use Ubuntu 24.04. Also, a standard plan should be enough for a reverse proxy with not that much traffic. 
 
-### Creating the server
+It is also recomended to add an SSH key.
 
-Now you'll need to create the server, click on "Add Server" in the top-right corner.
-
-![Server_Create](images/C7x29dxJ.png)
-
-### Choosing the server location
-
-Choose the location you'd like your VPS to be in, this doesn't have any affect on performance at all. Keep in mind that some locations don't have all plans available due to limitations there may be in that location.
-
-### Choosing the server's operating system
-
-Image is basically the operating system that will be installed on your server. In this tutorial, we'll be going for Ubuntu 20.04, however, you may choose whatever operating system you'd like that is supported by [Docker](https://docker.com).
-
-### Selecting the type of the server
-
-If you are a Hetzner user, you probably know what the difference is, if not, it is well explained under the title of the option. I will be setting up a VPS with the Standard plan, just because that is more than enough for a reverse proxy with not that much traffic. You also need to choose how much resources your server will have, for the reverse proxy, the lowest plan should be plenty of resources. If you ever use more than the resources allocated to the server, you can simply just upgrade your server through the [Hetzner Cloud Console](https://console.hetzner.cloud).
-
-![Choosing_plan](images/W2wiKC9C.png)
-
-### Other settings
-
-These last options are usually fine left on the default options, however, if you for example want to add an SSH key, your options will obviously look different. If you're not sure what some options are, hover over the "?" button and you should see a short description about what it is for.
-
-![Other_Settings](images/xYtAyi13.png)
+For security reasons, is not recommended to use the root user. Instead, you should create a new user and add this user to the sudo group (see [Initial Server Setup with Ubuntu](https://community.hetzner.com/tutorials/howto-initial-setup-ubuntu)).
 
 ## Step 2 - Installing Docker and Nginx Proxy Manager
 
-### Connecting to your server
-
-First off, you can start by connecting to your new VPS. If you're not sure how to do that, you can open the terminal on your device and run the following command after modifying the details.
-
-`ssh root@<IP Address>`
-
-* Replace `<IP Address>` with your server's IPv4 address.
-
-You should be able to find your server's IPv4 address in the server's initial page.
-
-![server_ip](images/cxXQZrZR.png)
-
-### Installing Nginx Proxy Manager
-
-Run the following commands mentioned below.
-
-```
-# Create new directory for nginx proxy manager
-mkdir -p npm
-cd npm
-# Uninstall old versions
-sudo apt-get remove docker docker-engine docker.io containerd runc
-# Setup the repository 
-apt-get update
-sudo apt-get install \
-    ca-certificates \
-    curl \
-    gnupg \
-    lsb-release
-# Add Docker’s official GPG key
-curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo gpg --dearmor -o /usr/share/keyrings/docker-archive-keyring.gpg
-# Set up stable repository
-echo \
-  "deb [arch=$(dpkg --print-architecture) signed-by=/usr/share/keyrings/docker-archive-keyring.gpg] https://download.docker.com/linux/ubuntu \
-  $(lsb_release -cs) stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null
-# Install Docker Engine
-sudo apt-get update
-sudo apt-get install docker-ce docker-ce-cli containerd.io
-# Install Docker Compose
-sudo curl -L "https://github.com/docker/compose/releases/download/1.29.2/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose
-sudo chmod +x /usr/local/bin/docker-compose
-sudo ln -s /usr/local/bin/docker-compose /usr/bin/docker-compose
-# Test the installation
-docker-compose --version
-```
-
-We've now successfully installed docker and docker-compose, we'll now need to install Nginx Proxy Manager itself.
-
-Run the following commands mentioned below.
-
-```
-# Make sure you're in the Nginx Proxy Manager directory
-cd npm
-# Create a docker-compose configuration file
-touch docker-compose.yml
-# Editing the file
-nano docker-compose.yml
-```
-
-Paste the following contents in the file which are mentioned below.
-
-```
-version: '3'
-services:
-  app:
-    image: 'jc21/nginx-proxy-manager:latest'
-    restart: unless-stopped
-    ports:
-      - '80:80'
-      - '81:81'
-      - '443:443'
-    volumes:
-      - ./data:/data
-      - ./letsencrypt:/etc/letsencrypt
-```
-
-Now, we'll need to bring the stack up by running the following command.
-
-```
-docker-compose up -d
-```
+* **Connecting to your server**
+
+  First off, you can start by connecting to your new server via SSH.
+
+  > Replace `<server_ip>` with your server's IPv4 address.
+  
+  ```bash
+  ssh holu@<server_ip>
+  ```
+
+<br>
+
+* **Installing Docker**
+
+  Run the following commands to install Docker on Ubuntu. If your server has a different OS, make sure you look up the correct commands (see [Docker installation - Supported platforms](https://docs.docker.com/engine/install/)).
+
+  Add the GPG key and the Docker repository:
+
+  ```bash
+  # Uninstall old versions
+  sudo apt-get purge docker-ce docker-ce-cli containerd.io docker-buildx-plugin docker-compose-plugin docker-ce-rootless-extras
+  
+  # Install prerequisites
+  sudo apt-get update
+  sudo apt-get install ca-certificates curl gnupg
+  sudo install -m 0755 -d /etc/apt/keyrings
+  
+  # Add Docker’s official GPG key
+  sudo curl -fsSL https://download.docker.com/linux/ubuntu/gpg -o /etc/apt/keyrings/docker.asc
+  sudo chmod a+r /etc/apt/keyrings/docker.asc
+  
+  # Set up stable repository
+  echo \
+    "deb [arch=$(dpkg --print-architecture) signed-by=/etc/apt/keyrings/docker.asc] https://download.docker.com/linux/ubuntu \
+    $(. /etc/os-release && echo "$VERSION_CODENAME") stable" | \
+    sudo tee /etc/apt/sources.list.d/docker.list > /dev/null
+  ```
+
+  Install Docker Engine and Docker Compose:
+
+  ```bash
+  sudo apt-get update
+  sudo apt-get install docker-ce docker-ce-cli containerd.io docker-compose-plugin
+
+  # Test the installation
+  docker --version
+  docker compose version
+  ```
+
+  We've successfully installed Docker and Docker Compose.
+
+  Add your user to the Docker group:
+  ```bash
+  sudo usermod -aG docker <user>
+  ```
+  Log out and back in to update the groups of your user.
+  
+  Now we'll need to install Nginx Proxy Manager itself.
+
+<br>
+
+* **Installing Nginx Proxy Manager**
+
+  Create a new directory for nginx proxy manager:
+
+  ```bash 
+  mkdir -p npm
+  cd npm
+  ```
+
+  Run the following commands mentioned below.
+
+  ```bash
+  # Create a docker-compose configuration file
+  touch docker-compose.yml
+  # Editing the file
+  nano docker-compose.yml
+  ```
+
+  Paste the following contents in the file which are mentioned below.
+
+  ```yml
+  version: '3.8'
+  services:
+    app:
+      image: 'jc21/nginx-proxy-manager:latest'
+      restart: unless-stopped
+      ports:
+        - '80:80'
+        - '81:81'
+        - '443:443'
+      volumes:
+        - ./data:/data
+        - ./letsencrypt:/etc/letsencrypt
+  #    network_mode: 'host'
+  ```
+
+  > Note about `network_mode`:
+  > * If you plan to proxy to external servers with public IPs, you don't need `network_mode`.
+  > * If you plan to proxy to local Docker containers and you want to point to `127.0.0.1:<container-port>`, you DO need `network_mode` and you should remove the hash symbol at the beginning of the line.
+  
+  <br>
+
+  Now, we'll need to bring the stack up by running the following command.
+
+  ```bash
+  docker compose up -d
+  ```
 
 We should now be able to access the admin UI with the following details.
 
-Admin UI: http://127.0.0.1:81
+> Replace 203.0.113.1 with your public IPv4 address
 
-* Replace 127.0.0.1 with your public IPv4 address
+Admin UI: http://203.0.113.1:81
 
 Default admin user:
 
-```
+```plaintext
 Email: admin@example.com
 Password: changeme
 ```
 
 ## Step 3 - Accessing the admin UI
 
-Immediately after logging in with this default user, you will be required to modify your details and change your password.
+Immediately after logging in with the default user, you will be required to modify your details and change your password.
 
 The admin login screen should look similar to the screenshot below.
 
-![NPM_Login](images/cjHPpsMz.png)
+![NPM_Login](images/nginx-proxy-manager_admin-ui.png)
 
-Once you login and modify all the default details, you should see a screen similar to the screenshot attached below.
+Once you login and modify all the default details, you can view the "Dashboard".
 
-![NPM_Initial](images/3VF66kCe.png)
+![NPM_Initial](images/nginx-proxy-manager_dashboard.png)
 
-Creating your first proxy host is fairly simple, below there is a screenshot attached of a basic configuration to access the admin UI from a domain (Make sure the domain is pointing towards the server's public IPv4 address).
+Creating your first proxy host is fairly simple. In the "Dashboard", click on "0 Proxy Hosts" » "Add Proxy Host". Below is a screenshot of a basic configuration to access the admin UI from a domain (`proxy.example.com`). Make sure the domain has a DNS record that points the domain to the server's public IPv4 address.
 
-![NPM_Create](images/CTkaKrfH.png)
+![NPM_Create](images/nginx-proxy-manager_new-proxy-host.png)
 
-After that, you'll most likely need an SSL certificate so everything is secure. Below is a screenshot attached to a basic configuration on how the SSL options should look like.
+After that, you'll most likely need an SSL certificate so that everything is secure. Below is a screenshot of a basic configuration on how the SSL options could look like.
 
-![NPM_SSL](images/BkNe2vI9.png)
+![NPM_SSL](images/nginx-proxy-manager_ssl.png)
 
 You can tick further options such as "Force SSL", etc as you wish. They are not ticked in the picture just so readers reading this tutorial do not get confused and think they are required to tick them.
 
+After you saved the new entry, you can access the admin UI from the domain you set (in this example `proxy.example.com`).
+
+The Nginx Proxy Manager is now ready and you can add your own proxy hosts.
+
+If you added `network_mode` in the Docker Compose file above, you should be able to set "Forward Hostname / IP" to `127.0.0.1` for all local containers. For example, a local WordPress Docker container:
+
+```shellsession
+holu@tutorial:~/npm$ docker run -p 8080:80 -d wordpress
+holu@tutorial:~/npm$ docker ps
+CONTAINER ID   IMAGE                      COMMAND                  CREATED          STATUS          PORTS                                  NAMES
+23bcbfe55c53   jc21/nginx-proxy-manager   "/init"                  31 minutes ago   Up 31 minutes                                          npm-app-1
+e9853acea394   wordpress                  "docker-entrypoint.s…"   22 minutes ago   Up 22 minutes   0.0.0.0:8080->80/tcp, :::8080->80/tcp  thirsty_greider
+```
+
+You can set the destination to `http://127.0.0.1:8080`:
+
+![NPM_WordPress](images/nginx-proxy-manager_wordpress.png)
+
+If you don't have `network_mode: 'host'` in your Docker Compose file, you have to set the destination to the public IP address, in this example `203.0.113.1:8080`.
+
 ## Conclusion
 
-Thank you for following my tutorial. While reading this, you should already be satisfied with your Nginx Proxy Manager installation.
+Thank you for following my tutorial. You should now have a working Nginx Proxy Manager installation.
 
 ##### License: MIT