Если у вас есть простой статический веб-сайт, и вы хотите разместить его на бесплатном хостинге, эта статья будет вам полезна. В ней мы рассказали, как бесплатно разместить статический веб-сайт в Google Firebase, и рассмотрели все возможности и преимущества этого инструмента.
Как понять, что мой сайт статический
Статический сайт — сайт, который состоит только из статичных (неизменяемых) страниц. Это означает, что внешний вид сайта и его наполнение всегда одинаковы для всех посетителей. И это вовсе не значит, что такой ресурс похож на сайты из 90-х — с голой структурой без дизайна и без вёрстки. Как и любой сайт, он может содержать изображения, текст, видео, аудио и другие элементы. Главное отличие лишь в том, что для отображения этих файлов и тегов достаточно HTML-разметки.
Если пользователь хочет перейти на статический сайт, сервер сразу передает браузеру готовый HTML-файл ровно в том виде, в котором тот был создан разработчиком. Для динамических сайтов процесс устроен несколько иначе: когда сервер находит нужный файл, он сначала отправляет его интерпретатору, который применяет языки программирования (Java, PHP, ASP). Только после этого сайт отображается в браузере в том виде, в котором был задуман.
Обычно статическими делают те сайты, которые не нужно регулярно обновлять. Как правило, это небольшие и простые ресурсы: сайты-визитки, сайты-портфолио, каталоги с продуктами или справочной информацией, лендинги и другие одностраничники. Чтобы внести любое изменение в такой сайт, нужно залезть в исходный код его страниц.
Преимущество статического сайта в том, что для него не нужно устанавливать и настраивать веб-сервер (например, Apache или NGINX). К тому же существуют провайдеры, которые предлагают бесплатный хостинг статических страниц для размещения проектов из облачных хранилищ. Один из таких ресурсов — Google Firebase.
Что такое Firebase от Google
Прежде чем говорить о хостинге, узнаем, что такое Firebase и откуда появилась эта платформа.
Компания была основана в 2011 году Джеймсом Тэмплином и Эндрю Ли. Firebase начинали с поставки облачных технологий, в том числе, СУБД (систем управления базами данных) класса NoSQL. Такие базы позволяли не только хранить, но и синхронизировать данные между несколькими клиентами.
Первым продуктом, который запустили Firebase, стала база данных Realtime. Её API (алгоритм по которому одна компьютерная программа взаимодействует с другой) позволяло интегрировать онлайн-чаты на сайты, а также синхронизировать данные приложений на Android, iOS и Web. В 2014 году Firebase выпустила новый продукт — хостинг. В том же году компанию поглотила корпорация Google. А уже в 2015-м интернет-гигант присоединил к проекту ещё и Divshot — платформу веб-хостинга для размещения статических веб-сайтов (HTML5).
Сейчас Firebase от Google — это облачная платформа для создания мобильных приложений, которая отвечает трём основным потребностям разработчика: хранение информации, разработка и хостинг. С её помощью можно быстро набросать предварительную версию сайта и дизайн, развернуть проект на хостинге и сразу показать клиенту.
Преимущества программы:
- скорость: быстрый деплой (развертывание программного обеспечения);
- гибкость: работа на Python и JavaScript;
- синхронизация: вход в систему с помощью учетной записи Google;
- работа без настройки и подключения сервера: не придется создавать базы данных, прописывать API приема и получения данных — за серверную часть отвечает платформа.
Благодаря этому не нужно отвлекаться на настройку и установку — можно сосредоточиться на качестве продукта.
Недостатки платформы:
- неполный функционал в бесплатной версии: Firebase — это не полностью бесплатный продукт. Если вы хотите использовать дополнительный функционал и мощные инструменты, придется выбрать платный тариф. Полный список возможностей на официальном сайте.
Сейчас Firebase входит в список лучших платформ для разработки приложений, которым доверяют разработчики по всему миру. С Firebase работают: The New York Times, Alibaba, Todoist, eBay Motors и другие компании. Если вы тоже хотите стать клиентом Firebase, переходите к размещению своего проекта.
Как бесплатно разместить сайт на Firebase-хостинге
Чтобы разместить статический сайт на хостинге Firebase, выполните три шага:
- Создайте новый проект в консоли Firebase.
- Разверните сайт через командную строку CLI Firebase.
- Привяжите домен к хостингу в консоли.
Шаг 1. Создайте новый проект в Firebase
- Введите название проекта, поставьте галочку напротив «I accept the Firebase terms» и кликните Continue:
- Затем нажмите Continue:
- Выберите нужную страну из списка, поставьте галочку напротив «I accept the Google Analytics terms» и нажмите Create project:
- После загрузки кликните Continue:
Готово, вы создали новый проект:
Шаг 2. Разверните сайт на хостинге Firebase
- Установите на ПК интерфейс командной строки CLI Firebase. Для этого скачайте бинарный файл интерфейса из официальной инструкции:
- После того, как файл скачается, перенесите его в папку с файлами вашего сайта на ПК.
- Запустите командную строку CLI Firebase из папки.
- В пункте «Allow Firebase to collect CLI usage and error reporting information?» введите Yes:
В интерфейсе появится следующее сообщение:
Затем вас автоматически перекинет на страницу входа в Google-аккаунт в браузере. Для перехода в приложение «Firebase CLI» выберите нужный аккаунт:
- Разрешите приложению «Firebase CLI» доступ к вашему Google-аккаунту:
После этого в браузере появится сообщение «Firebase CLI Login Successful» (Вход в Firebase CLI выполнен успешно), а в командной строке вы увидите следующий результат:
- Введите команду firebase init:
- Затем в строке «Are you ready to proceed?» введите Yes:
- Стрелкой вниз пролистайте до строки «Hosting: Configure files for Firebase Hosting and (optionally) set up GitHub Action deploys», нажмите на пробел, а затем кликните Enter:
- Затем стрелкой вниз пролистайте до пункта «Use an existing project» и кликните Enter:
- После того как подгрузится информация о проекте, который вы создали на первом шаге, поэтапно введите команды:
- для «What do you want to use as your public directory?» — public;
- для «Сonfigure as a single-page app (rewrite all urls to /index.html)» — No;
- для «Set up automatic builds and deploys with GitHub?» — No;
Если всё пройдёт успешно, вы увидите сообщение «Firebase initialization complete!»:
- Введите команду firebase deploy и дождитесь результата. Если развертывание проекта пройдет успешно, в строке «Hosting URL» вы увидите адрес, который заканчивается на .web.app:
Готово, вы создали проект и развернули его.
Также вы можете создать ещё один проект сразу через командную строку. Для этого введите в интерфейсе команду firebase logout и удалите бинарный файл из папки с проектом. Затем вновь скачайте файл и поместите в папку с новым проектом. Запустите CLI и выполните с 3 по 8 шаг второго этапа инструкции. На шаге 9 выберите вариант «Create a new project», задайте уникальный id, как показано в примере, и укажите название проекта. После этого выполните шаги 10 и 11.
Теперь посмотрим, как запустить сайт в интернете — без хостинга, к которому привязан домен, он не будет работать.
Шаг 3. Добавьте домен на хостинг Firebase
Если у вас ещё нет домена, его можно купить в REG.RU. Наши инструкции помогут выбрать и зарегистрировать доменное имя.
- Выберите проект, который вы создали на первом этапе:
- В разделе «Build» выберите Hosting:
- Нажмите Add custom domain:
- Введите домен, который хотите привязать к хостингу и кликните Continue:
- Скопируйте TXT-запись и добавьте её в ресурсные записи своего домена. Если ваш домен зарегистрирован в REG.RU, используйте инструкцию Настройка ресурсных записей в Личном кабинете.
Обратите внимание: Дождитесь добавления TXT-записи в зону домена. В зависимости от вашего регистратора, это может занять от 15 минут до 24 часов. Проверить, добавилась ли запись, поможет утилита dig: укажите домен, выберите нужный тип записи и кликните Проверить.
После того, как TXT-запись добавится в зону, нажмите Verify, чтобы подтвердить домен:
- Скопируйте предложенный IP-адрес и добавьте А-запись в ресурсные записи вашего домена. Если ваш домен зарегистрирован в REG.RU, используйте инструкцию Настройка ресурсных записей в Личном кабинете.
Обратите внимание:
- Перед добавлением новой записи удалите все старые А-записи.
- Дождитесь добавления А-записи в зону домена. В зависимости от вашего регистратора, это может занять от 15 минут до 24 часов. Проверить, добавилась ли запись, поможет утилита dig: укажите домен, выберите нужный тип записи и кликните Проверить.
После того, как А-запись добавится в зону, нажмите Finish:
Готово, вы настроили бесплатный хостинг для домена. Дождитесь обновления DNS-серверов в течение 24 часов — после этого ваш сайт будет доступен в интернете.
Если вы захотите модифицировать проект, перейдите в папку с файлами на ПК и внесите изменения прямо в код. Затем запустите СLI и введите команду firebase deploy — изменения появятся на сайте в течение минуты.
⌘⌘⌘
Теперь вы понимаете, в чём преимущество Firebase-платформы, знаете, как разместить свой сайт на Google hosting, и в любой момент сможете приступить к разработке проекта. И не забывайте, что зарегистрировать красивый и лаконичный домен для проекта всегда можно в REG.RU.
Зарегистрировать домен
Оригинал материала и ещё больше полезностей в блоге REG.RU
Понравился материал? Поделись с друзьями, чтобы их тоже защищала огненная стена🔥