Your AI powered learning assistant

Разместите свой веб-сайт бесплатно с помощью Cloudflare Pages и GitHub!

Настройка веб-сервера

Чтобы сделать ваш веб-сайт доступным в Интернете, вам нужен веб-сервер. В этом видео вы пошагово и бесплатно научитесь настраивать веб-сервер.

Как работают веб-серверы

Веб-серверы - это компьютеры, на которых файлы веб-сайта могут храниться онлайн, что позволяет получать доступ к веб-сайту с любого компьютера, имеющего доступ в Интернет. Плата за хостинг веб-серверов является обычной, но статические веб-сайты теперь можно размещать на таких платформах, как Cloudflare Pages.

Развертывание файлов веб-сайта в репозитории GitHub

Чтобы развернуть front of Mentor Challenge, вам необходимо разместить файлы вашего веб-сайта в репозитории GitHub. Спикер уже создал панель управления социальными сетями с переключателем dark/light и загрузил ее локально для демонстрации.

Настройка страниц Cloudflare

Чтобы создать бесплатную учетную запись Cloudflare Pages, подключите свою учетную запись GitHub и зарегистрируйтесь, указав адрес электронной почты и пароль. После входа в систему создайте новый проект, развернув код из репозитория GitHub. Авторизуйте страницы Cloudflare для доступа ко всем репозиториям с разрешениями на чтение и запись.

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

Настройте сборку и развертывание, назвав проект, выбрав основную ветку и запустив gulp на сервере Cloudflare Pages. Разверните обычные файлы вместо скомпилированных или сгенерированных файлов, чтобы избежать конфликтов слияния при работе с другими разработчиками. Журналы показывают, что пакеты npm были установлены из файла package.json, сценарий сборки gulp был успешно выполнен, и сайт был развернут.

Тест скорости веб-сайта

Веб-сайт тестируется на скорость с использованием протокола quick transport protocol. Страница загружается менее чем за секунду, последовательно, а время первого байта составляет 39 миллисекунд, что указывает на высокую скорость веб-сервера.

Использование веб-аналитики в Cloudflare Dashboard

Веб-аналитику в Cloudflare dashboard можно включить в настройках проекта. Она бесплатно предоставляет информацию о просмотрах страниц, местоположении посетителей, ссылающихся доменах и другие данные о посетителях.

Функции совместной работы

Cloudflare Pages предлагает функции совместной работы для командных проектов, позволяя легко приглашать участников и неограниченно добавлять новых участников. Он также создает ссылку предварительного просмотра для промежуточных сред для внутреннего просмотра сайта перед запуском в производство. Доступ к ссылке предварительного просмотра можно контролировать, ограничивая его только участниками проекта.

Создание ссылки предварительного просмотра для внутреннего просмотра

Создание ссылки предварительного просмотра для внутреннего просмотра Чтобы создать ссылку предварительного просмотра для внутреннего просмотра, мы вносим изменения в код в VS Code, изменяя файл index.html, а затем фиксируем его на GitHub. Это запускает страницы Cloudflare, которые автоматически обнаруживают изменение кода, создают новую среду и предоставляют нам ссылку предварительного просмотра из этого коммита.

Объединение ветви объектов в основную ветвь После внесения изменений в функциональную ветку мы создаем запрос на загрузку на GitHub для проверки командой. После утверждения или объединения в основную ветку Cloudflare Pages автоматически обнаруживает это слияние и развертывает его как часть производственного сайта.