Как развернуть базовый статический HTML-сайт в Heroku?

Опубликовано: 2 Июня, 2021

Heroku - это простое и универсальное решение для размещения любого веб-сайта или сервера. Эта статья посвящена тому, как вы можете разместить свою собственную веб-страницу в статическом HTML на Heroku. Чтобы продемонстрировать это, мы собираемся создать простую веб-страницу и разместить ее.

Предпосылки

Git
Аккаунт Heroku
Heroku CLI

Давайте создадим каталог с именем «портфолио» для нашего проекта. Мы подключим этот каталог к нашему приложению Heroku, чтобы каждый раз, когда мы обновляем локальный HTML-файл, изменения отражались на размещенном веб-сайте.

Шаг 1:

Создайте каталог с именем «портфолио» и измените на него рабочий каталог.

 $ mkdir портфель
$ CD-портфель

Шаг 2:

Создайте свой собственный статический HTML-сайт и назовите его « home.html» (мы собираемся создать простой файл с текстом «Мое портфолио»)

$ echo "<h1> Мое портфолио </h1>"> home.html

Шаг 3:

Heroku по умолчанию не позволяет развертывать приложение, не имеющее серверной части. Итак, нам нужно создать фиктивный бэкэнд или динамический файл PHP. Нам нужно использовать уловку и сказать Heroku, что наш веб-сайт является приложением PHP. Для этого просто скопируйте и вставьте следующие команды в свой терминал. composer.json был включен для поддержки приложения PHP на Heroku. Если приложение не имеет зависимостей от композитора, мы должны включить пустой composer.json, чтобы распознать приложение PHP.

 $ echo '<? php include_once ("home.html"); ?> '> index.php
$ echo '{}'> composer.json

Шаг 4:

Инициализируйте репозиторий как репозиторий git.

 $ git init

Шаг 5:

Создайте свое приложение Heroku, используя новую кнопку в верхней правой части панели инструментов Heroku. Мы собираемся назвать это приложение « your-app-name-123 ″.

Шаг 6:

Войдите в свою учетную запись Heroku с помощью интерфейса командной строки Heroku.

 $ heroku войти

Шаг 7:

Теперь, когда мы создали наше приложение, нам просто нужно подключить локальный репозиторий git к приложению Heroku. Для этого мы добавляем пульт от приложения Heroku в репозиторий git. (Не забудьте заменить «your-app-name-123» своим именем приложения)

 $ heroku git: удаленный -a ваше-имя-приложения-123

Шаг 8:

Отправьте изменения в ваше приложение Heroku.

 $ git push герой мастер

Шаг 9:

Ваше приложение теперь доступно на Heroku. Чтобы просмотреть свое приложение, щелкните ссылку, появившуюся в конце предыдущего шага, которая выглядит как https://your-app-name-123.herokuapp.com/ . Чтобы зафиксировать и сохранить все изменения в файле home.html , выполните следующие команды из каталога «портфолио».

 $ git add. 
$ git commit -m "ваше сообщение о фиксации" 
$ git push герой мастер

Git HTML