Простейший способ бесплатно захостить статику на Heroku

в 12:01, , рубрики: heroku, html, javascript, node.js, static, метки: , , , ,

image
Около полутора лет назад возникла необходимость захостить небольшой статический сайт в три страницы и пару десятков. В тот момент была активна подписка MSDN и самым простым решением оказалось создать WebRole прямо в студии, положить туда статику и делать деплоймент, используя стандартные возможности Visual Studio. Прошел год, подписка кончилась, прогноз платежа за использование ресурсов Azure составил 5000 рублей в месяц. Мне показалось, что это перебор за трехстраничный сайт и начался поиск альтернативы. Критерии: бесплатность, простота конфигурирования и возможность просто перенести сайт, как он есть без доделок.

Самым очевидным вариантом казался Amazon S3. Камнем преткновения стал процесс регистрации бесплатной подписки в AWS. Почти месяц я безуспешно вводил код подтверждения с телефона. В части случаев звонка просто не было, но чаще всего код не принимался. На глаза попался сервис Heroku, очень подкупила простота регистрации (после месяца попытки регистрации на AWS).

Так как сервис популярный, то уже существовали проекты для статического хостинга. Почти все они были реализованы на Ruby. Пример: github.com/jamiew/heroku-static-site и devcenter.heroku.com/articles/static-sites-ruby. С использованием этих решений возникли проблемы: я слабо знаю Ruby и чтобы все заработало требовалось существенно поправить уже имеющуюся структуру сайта.

Следующим шагом была попытка использования Django. Структуру сайта теперь можно было не менять, но сразу появились минусы — много файлов, которые никак непосредственно не связаны с сайтом. Плюс появились проблемы с запуском в релизе. В целом конфигурирование Django нельзя назвать простым, для человека, который мало работал с Django и понимает только в Python.

Конфигурация Django заняла примерно день, по непонятным причинам не работал redirect с / на index.html, но читая мануалы, все постепенно устаканивалось. Потом один человек после вопроса о том, как настроить редирект, спросил — «А зачем тебе Django? Все можно сделать проще с помощью Node.js.

До этого я только слышал про этот сервер, но никогда не использовал. Реализация статического сайта с помощью @d_bud заняла всего 20 минут(с деплойментом). Весь код реализации:
Web.js

var express = require('express');
var app = express();
var path = require('path');
app.use(express.static(path.join(process.cwd(), 'source')));
console.log(process.env.PORT || 5000);
app.listen(process.env.PORT || 5000);

package.json

{
  "name": "node-example",
  "version": "0.0.1",
  "dependencies": {
    "express": "3.1.x"
  },
  "engines": {
    "node": "0.10.x",
    "npm": "1.2.x"
  }
}

Все что требовалось положить мой статический сайт в папку source и поправить некоторые старые битые ссылки на картинки. Поискав такое простое решение в google, ничего похожего по простоте не выдавалось, поэтому я и решил написать эту статью + оформить репозиторий на github. Надеюсь, что это будет полезно тому, кому также как и мне понадобится быстро и бесплатно выложить статику.

P.S: В целом использование node.js для статики позволит быстро ее переносить. Для того чтобы поднять сайт на машине, достаточно установить node.js и выполнить две команды в корневой папке:

npm install
node web.js

Автор: Zrok

Источник


* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js