Как бесплатно разместить статический веб-сайт на хостинговой платформе Google Firebase

Если вы хотите бесплатно разместить простой веб-сайт, вы не ограничены бесплатными создателями веб-сайтов, такими как Google Sites или Wix. Многие облачные провайдеры предлагают хостинговые платформы с щедрыми бесплатными уровнями, которые позволяют вам полностью контролировать контент, который вы обслуживаете.

Что такое «статический» сайт?

Вопреки тому, как это звучит, «статический» веб-сайт не означает, что ваш сайт должен выглядеть как страница GeoCities 1999 года. Вы по-прежнему можете обслуживать контент JavaScript, даже полноценные одностраничные веб-приложения, созданные с помощью таких фреймворков, как React.

Статический просто означает, что ваш контент не меняется до того, как его обслужат. Например, WordPress отвечает на запросы и изменяет содержимое страницы с помощью PHP в зависимости от запрошенной вами страницы. Статический веб-сайт, с другой стороны, представляет собой обычный HTML плюс любые изображения, CSS или JavaScript, которые вы отправляете вместе с ним. Вы можете изменить его на стороне клиента с помощью JavaScript после того, как он будет отправлен пользователю, как работает React, но даже в этом случае сам файл JavaScript является статическим.

Преимущество полностью статического веб-сайта заключается в том, что вам на самом деле не нужен модный веб-сервер, такой как NGINX или Apache, для обслуживания вашего контента. Поскольку это просто статические файлы, многие провайдеры, такие как AWS и Google Cloud Platform, предлагают способы размещения таких веб-сайтов из сегментов облачного хранилища.

Google предлагает такую услугу для хостинга из ведра облачного хранилища с использованием балансировщика нагрузки или CDN перед ним. Однако он предназначен для высокопроизводительных корпоративных сайтов и не является полностью бесплатным для использования. Для простых развертываний вы можете использовать платформу Google Firebase, которая предназначена для обеспечения серверной части мобильных приложений, но также включает в себя фантастическую услугу хостинга статического контента, которую вы можете использовать.

Настройка развертывания Firebase

Firebase является частью Google Cloud Platform, поэтому вам понадобится проект GCP для использования с Firebase. Перейдите в консоль GCP и создайте новую из раскрывающегося списка в строке меню:

Вам понадобится интерфейс командной строки Firebase для следующей части. Загрузите двоичный файл для своей операционной системы, затем запустите команду firebase со своего терминала, чтобы войти в систему и подключить интерфейс командной строки Firebase к своей учетной записи Google.

firebase

Затем перейдите в каталог с помощью cd , который вы хотите использовать для кода своего веб-сайта, и запустите firebase init:

Это установит текущий каталог в качестве проекта firebase. Для функций выберите «Хостинг».

Выберите «Добавить Firebase в существующий проект Google Cloud Platform» и выберите созданный вами проект GCP. Здесь вы можете создать совершенно новый проект, но в нашем тестировании он выдал ошибку при настройке, и нам все равно придется создавать его вручную.

Для настройки хостинга вы можете установить общедоступный каталог (по умолчанию «общедоступный»). Если вы используете клиентскую библиотеку, такую как React, для управления маршрутизацией, вы можете настроить проект как одностраничное приложение, которое перепишет все URL-адреса, чтобы они указывали на одну страницу index.html.

Теперь Firebase должен быть настроен. Вы можете развернуть веб-сайт в первый раз, используя firebase deploy. Эта команда синхронизирует ваш локальный каталог с облачным развертыванием. Всякий раз, когда вы хотите обновить сайт, вам просто нужно снова запустить firebase deploy.

Теперь ваш сайт будет виден по адресу projectname.web.app. Однако вы, вероятно, захотите настроить собственный домен, что довольно просто. Вам, конечно, понадобится собственный домен, зарегистрированный у регистратора доменов, например Namecheap или Google Domains.

Перейдите в консоль Firebase, выберите свой проект и выберите «Хостинг» на боковой панели. Нажмите «Добавить собственный домен».

Введите свой домен, и вам будет предоставлена запись TXT. Перейдите к настройкам регистратора вашего домена и установите для имени хоста и значения значения, предоставленные вам в качестве новой записи TXT.

После проверки вам, конечно же, нужно будет указать домен на Firebase. Firebase предоставит вам два IP-адреса для добавления в ваш домен. Замените любые существующие «A Records», которые у вас могут быть.

На вашем сайте некоторое время будет отображаться красное предупреждение HTTPS, а Firebase автоматически предоставит вам бесплатный SSL-сертификат. Вам не нужно ничего делать, так как этот процесс автоматический.

Всякий раз, когда вам нужно развернуть обновления, внесите изменения в код в общедоступной папке и снова запустите firebase deploy с терминала. Вы должны увидеть изменения, развернутые менее чем за минуту.