HTML Document – Example with semantic elements

orange plastic blocks on white surface

Example of Semantic elements structure of HTML Document
HTML 5 Tags: body, header, nav, main, article, section, aside, footer

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>HTML Document</title>
</head>
<body>
  <header> <!--site header-->
    <a href="/" title="home">
      <img src="logo.png" alt="logo">
    </a>

    <nav aria-label="primary"> <!--main nav-->
    </nav>
    <form action=""></form>
  </header>

  <nav aria-label="secondary"> <!--secondary nav-->
  </nav>

  <main> <!--main content-->
    <article>
      <h1></h1> <!--main heading-->
      <p></p>
      <h2></h2> <!--secondary heading-->
      <p></p>
    </article>
  </main>

  <aside aria-label="sidebar"> <!--sidebar-->
    <section class="section-with-image"> <!--items in the sidebar-->
      <h2></h2>
      <img src="" alt="">
      <p></p>
    </section>

    <style>
      .section-with-image {
        display: flex;
        flex-direction: column;
      }
      .section-with-image img {
        order: -1;
      }
      </style>

    <section>
      <header>
        <h2>Header</h2>
        <img src="" alt="">
        <p>hello :)</p>
      </header>
      <p>content</p>
    </section>
  </aside>

  <footer> <!--site footer-->
  </footer>
</body>
</html>

Install Nextcloud with Docker Compose

white sky photography

Install Nextcloud with Docker compose

docker-compose.yml

version: '2'

services:
  db:
    image: mariadb:10.5
    restart: always
    command: --transaction-isolation=READ-COMMITTED --binlog-format=ROW
    volumes:
      - /home/dock/nextcloud/db:/var/lib/mysql
    environment:
      - MYSQL_ROOT_PASSWORD=nextclouddb
      - MYSQL_PASSWORD=nextclouddb
      - MYSQL_DATABASE=nextcloud
      - MYSQL_USER=nextcloud
    restart: unless-stopped

  app:
    image: nextcloud
    restart: always
    ports:
      - 5001:80
    links:
      - db
    volumes:
      - /home/dock/nextcloud/nextcloud:/var/www/html
    environment:
      - MYSQL_PASSWORD=nextclouddb
      - MYSQL_DATABASE=nextcloud
      - MYSQL_USER=nextcloud
      - MYSQL_HOST=db
    restart: unless-stopped

Run:

docker-compose up -d

Expose your Nextcloud to the internet – Nginx Proxy host config:

        add_header Strict-Transport-Security "max-age=31536000; includeSubDomains" always;

        location / {
                proxy_pass http://localhost:5001;

                proxy_set_header X-Forwarded-Host     $host;
                proxy_set_header X-Forwarded-Server   $host;
                proxy_set_header X-Real-IP            $remote_addr;
                proxy_set_header X-Forwarded-For      $remote_addr;
                proxy_set_header X-Forwarded-Proto    $scheme;
                proxy_set_header X-Forwarded-Protocol $scheme;
                proxy_set_header X-Forwarded-Port     443;
                proxy_set_header Forwarded "for=$remote_addr;proto=$scheme";

                proxy_set_header Host                 $host;

                proxy_redirect  off;
                proxy_buffering off;

                proxy_http_version 1.1;
                proxy_set_header Upgrade    $http_upgrade;
                proxy_set_header Connection "upgrade";

                proxy_pass_header Authorization;
                proxy_request_buffering off;
                client_max_body_size 0;
                proxy_read_timeout  36000s;
                proxy_ssl_session_reuse off;

                fastcgi_param HTTPS on;
                fastcgi_param REQUEST_SCHEME https;
        }

Install Guacamole with Docker

Guacamole is a web-based remote desktop client. Guacamole supports VNC, RDP, and SSH.

The following will run guacamole web client and postgres db:

docker run -d\
  -p 5002:8080 \
  -v /home/dock/guacamole/config:/config \
  --restart unless-stopped \
  oznu/guacamole

The default user/password is: guacadmin/guacadmin

How to fix: Falling back to a fallback locale (“en_US.UTF-8”) on Ubuntu

How to fix the following error with a remote connection to the server:

perl: warning: Setting locale failed.
perl: warning: Please check that your locale settings:
	LANGUAGE = (unset),
	LC_ALL = (unset),
	LC_CTYPE = "UTF-8",
	LANG = "en_US.UTF-8"
    are supported and installed on your system.
perl: warning: Falling back to a fallback locale ("en_US.UTF-8").

Run with root user:

locale-gen en_US.UTF-8
localedef -i en_US -f UTF-8 en_US.UTF-8

Add to /etc/environment

export LANGUAGE=en_US.UTF-8
export LANG=en_US.UTF-8
export LC_ALL=en_US.UTF-8

Nginx Proxy Manager

purple and blue light digital wallpaper

Nginx Proxy Manager – Expose your Home Lab web services easily with Let’s Encrypt SSL certificates

Create a docker-compose.yml file:

version: '3'
services:
  app:
    image: 'jc21/nginx-proxy-manager:latest'
    restart: unless-stopped
    ports:
      - '80:80'
      - '81:81'
      - '443:443'
    environment:
      DB_MYSQL_HOST: "db"
      DB_MYSQL_PORT: 3306
      DB_MYSQL_USER: "npm"
      DB_MYSQL_PASSWORD: "npm"
      DB_MYSQL_NAME: "npm"
    volumes:
      - /home/dock/npm/data:/data
      - /home/dock/npm/letsencrypt:/etc/letsencrypt
  db:
    image: 'jc21/mariadb-aria:latest'
    restart: unless-stopped
    environment:
      MYSQL_ROOT_PASSWORD: 'npm'
      MYSQL_DATABASE: 'npm'
      MYSQL_USER: 'npm'
      MYSQL_PASSWORD: 'npm'
    volumes:
      - /opt/npm/mysql:/var/lib/mysql

Start

docker-compose up -d

Alternative:

docker run -d --name=npm \
-p 80:80 \
-p 81:81 \
-p 443:443 \
-e PUID=1000 \
-e PGID=1000 \
-e TZ=Europe/Sofia \
-v /home/dock/npm/data:/data \
-v /home/dock/npm/letsencrypt:/etc/letsencrypt \
--restart always \
jc21/nginx-proxy-manager