We deploy the site to the cloud for a ruble per month

What is a static site

There are two types of websites: dynamic and static. Static text web pages were the first to appear. Gradually, as technology developed, they transformed into interactive and flexible sites.

Static site is a site that consists of unchangeable content. As a rule, it is an HTML document stored on the server. Most often, the static site type is used to create a business card site, product catalog and documentation.

Static sites are easier to create and administer, and they also load quickly in the browser. The main disadvantage is the difficulty of making changes. For example, the contents of a dynamic site are rendered by scripts, and if you need to add a card to the site, then it will be enough to add information about it to an array of objects. For a static site, you will have to make changes to the HTML document and draw a new component yourself using code. The history of the dynamic type of site began with this drawback.

Dynamic site is a site made up of static pages and dozens of scripts. Such sites include online stores, social networks and forums.

The main feature of such sites is scalability. However, this feature also turns into a disadvantage: more system resources are required for development and implementation, the speed of loading the site in the browser is reduced, and such a site is more difficult to create and subsequently administer.

Despite the primitiveness of technology, static sites are still in demand. They are easier to develop, and they allow you to obtain predominantly high-quality results at a minimal cost.

Why is it worth hosting static sites in object storage?

Typically, developers host websites on a server using additional software: Apache, Nginx and other programs. Hosting a site in this way requires administration skills, and you will also encounter errors that will require additional time to resolve. When using object storage, it is enough to load an HTML document through the graphical interface. This process takes less time and requires a minimum of skills.

Here are some more benefits of object storage when using it as a tool for hosting static sites:

• specifying the index file for the absolute path “/”;
• specifying an error page for redirecting from non-existent pages;
• specifying a CSS style file for the index file;
• viewing statistics on requests;
• managing caching headers;
• attaching second-level domains;
• low cost of use – from 1₽ per month.

We place the site in storage

Let's take a practical look at how to publish a website to object storage.

For work we will need:

• public container in object storage (we’ll explain how to create a container in the instructions below);
• index page, error page and style files;
• access to any API platform.

After preparing the necessary components, we will begin work.

Create a container

Log in to the control panel

my.selectel.ru

and go to the section

Object storage

. An object storage service is usually associated with a cloud project, in our case MySite.

To create a container in which we will place our site, click on the button Create container.

Specify the container parameters – project name.

If authorization is successful, the service will return a 201 response, and in the X-Subject-Token header response you can find the Keystone token in the format: x-subject-token: .

Setting container settings

Using a PUT request with the path /v2/containers/{container_name}/options, you can make special settings to the container parameters:

{
        "general": { #Настройки кеширования
                "cache_control": "max-age=604800", #Установка значения заголовка для управления кешем
                "default_delete_after": 3600, #Время удаления объекта в формате Unix Timestamp
                "type": "private" #Поддерживает значения:
                       #public — ответ может быть закеширован в любом кеше
                       #private — ответ предназначен для одного пользователя и не должен помещаться в разделяемый кеш
        },
        "quota": {
                "max_bytes_used": 1024, #Установка максимального количества используемых контейнером квот в байтах
                "max_object_count": 10 #Установка квоты на максимальное количество объектов в контейнере
        },
        "web": {
                "error": "error.html", #Путь к файлу ошибки
                "index": "index.html", #Путь к индексному файлу
                "listing_css": "style.css", #Путь до файла со стилями, который будет использован при отдаче страницы
        }
}

It is not necessary to specify all the parameters, so in our case we will only specify: error, index and listing_css. To set the parameters, use the curl utility again:

curl -XPUT -H'X-Auth-Token: <токен Keystone>' \ 'https://api.ru-1.storage.selcloud.ru/v2/containers/`<наименование контейнера>`/options' \ -d'{"web": {"error": "/error.html","index": "index.html", "listing_css": "style.css"}}'

Checking the settings made

After specifying the parameters for the container, the index file will be served on the public domain of the container.

If you specify a path that does not exist, an error page will appear.

With this we have completed the main work of hosting a static site. But despite the intended purpose of creating a website, the domain should be memorable and therefore simple. For this reason, we will next consider how to change a chaotic set of numbers and letters into a unique custom domain.

Adding a custom domain

Anyone who is thinking about creating their own Internet resource will definitely need a domain – without it, users will not be able to find the page in search results.

Site domain is the unique name of a site within the World Wide Web. It can consist of symbols, letters or numbers.

For further work, we will need a domain, which can be purchased from any domain name registrar. Please note that only a third-level domain can be added to a container. This is a domain consisting of three words separated by a dot. In this context, a “word” means an alphanumeric combination that can contain all characters except a period. An example of such a domain: my.selectel.ru.

Adding a CNAME record

In the control panel for DNS records of the hosting in which our domain is registered, we add a CNAME record with the following parameters:

• record type – CNAME;
• record name – custom domain;
• value – access.ru-1.storage.selcloud.ru.

In our case, we configured a third-level domain

www.dinosaur-mood.ru

.

After changing the DNS record of a domain, you need to wait some time for it to be updated to the current one.

Adding a custom domain to the container

In the container card, go to the tab

Domains

the prepared third-level domain is entered into the window

Custom domain

and add it to the container at the click of a button

Attach

.

The domain will appear in the list

Attached domains

on the same tab.

Checking the settings made

We go in the browser to the domain that you attached to the storage and admire the work done!

We issue an SSL certificate

If you now try to open a page on an attached domain, the browser may display the message “Your connection is not private.”

You have done everything correctly, all that remains is to issue an SSL certificate for the domain. This is a digital certificate that confirms the authenticity of a website and allows you to use an encrypted and therefore secure connection.

We issue an SSL certificate from Let's Encrypt

Let's Encrypt

is a certificate authority that provides free SSL/TLS certificates. The issuance of certificates is fully automated and easy to implement.

Find out more about Let's Encrypt on the official site.

Preparation

To issue the certificate, we need a Linux system. When using Windows, you need to install the WSL subsystem; it allows you to run a Linux environment on a Windows computer.

To install WSL with the Ubuntu distribution for Linux, open a command prompt (cmd.exe) and enter the command:

wsl --install

After installation is complete, launch the WSL program through the GUI.

Installing Certbot

Certbot

is an ACME (Automatic Certificate Management Environment) protocol client that is used to manage SSL certificates from Let's Encrypt. When installing the Certbot client, snap packages are required, which require the snapd utility to manage. In Ubuntu it is already installed by default, so we only need to check that the snapd kernel is updated to the latest version with the following command:

sudo snap install core; sudo snap refresh core

Next, install the certbot package:

sudo snap install --classic certbot

After installation, create a symbolic link to the certbot command from the snap installation directory:

sudo ln -s /snap/bin/certbot /usr/bin/certbot

We issue an SSL certificate

You can issue a certificate through the Certbot client using various methods. We will look at a method that involves adding a TXT record to a domain.

We initialize the certificate issuance process with the command:

sudo certbot certonly --authenticator manual --preferred-challenges dns

After executing the command, the line appears:

Saving debug log to /var/log/letsencrypt/letsencrypt.log Please enter the domain name(s) you would like on your certificate (comma and/or space separated) (Enter 'c' to cancel):

We enter the first level domain, in our case

dinosaur-mood.ru

and press Enter.

Thus, we sent a request to issue a certificate for our domain. The process of executing the request is accompanied by the output of the line:

Requesting a certificate for dinosaur-mood.ru.

If the request is successful, the TXT record and its value will appear in the window.

Go to the domain DNS records control panel and add the resulting TXT record, as we did earlier.

Displaying an entry in the recorder control panel:

After creating an entry, you need to wait some time for it to be updated on the domain. To track the result, you can use third-party Internet resources, for example

MxToolBox

you can also check in a new console window using the dig utility:

dig _acme-challenge.dinosaur-mood.ru TXT

The response to the request should display the following entry:

;; ANSWER SECTION: 
_acme-challenge.dinosaur-mood.ru. 0 IN TXT "iLlPWHBLVdthtmcWvgsB8VwpWQXOdeShIK_3OlcM6Xc”

If the entry is displayed correctly, go to the window in which we are running the certificate issuance process and press Enter. If the certificate was issued successfully, you will see the following response:

Successfully received certificate. #подверждение успешного выпуска сертификата
Certificate is saved at: /etc/letsencrypt/live/dinosaur-mood.ru/fullchain.pem #путь до сертификата на локальном хосте
Key is saved at: /etc/letsencrypt/live/dinosaur-mood.ru/privkey.pem # путь до приватного ключа сертификата на локальном хосте
This certificate expires on 2024-05-22. #дата истечения сертификата
These files will be updated when the certificate renews.

Please note that if you use this method, you will need to renew the certificate after 90 days. This can be done in an identical way through Certbot.

Checking the settings made

Open our website in the browser and enjoy the result!

That's it – the site is ready to go!

Perhaps these texts will also interest you:

→ Is it possible to hack a hacker? Unraveling cyber attacks from a CTF tournament. Part 3
→ Real magic: the capabilities of an unusual PC with an external PCIe socket and something else
→ Diving into Kubernetes: useful materials from Selectel employees