Простой сайт на HTML

Чтобы сделать сайт доступным из любой точки мира, самым простым вариантом будет запустить его HTML-страницу на VPS-сервере с XAMPP. Весь процесс можно разбить на несколько простых шагов.

Размещение HTML-файла

По умолчанию XAMPP использует папку htdocs в качестве корневой директории сайта. Это значит, что все файлы для веб-доступа должны лежать именно там.

На Ubuntu полный путь к этой папке обычно выглядит так:

/opt/lampp/htdocs/

Что нужно сделать:

Подключиться к VPS по SSH.
Поместить HTML-файл (например, index.html) в эту директорию.
Если есть целая папка с сайтом (например, мой-сайт), можно загрузить её целиком, и путь к файлам будет таким:

/opt/lampp/htdocs/мой-сайт/index.html

Запуск веб-сервера

Самый простой способ управлять сервисами XAMPP — использовать его графическую панель управления. Однако для VPS, где графического интерфейса обычно нет, удобнее всего работать из командной строки.

Основные команды для управления XAMPP:

Запустить все сервисы (Apache и MySQL):

sudo /opt/lampp/lampp start

Остановить все сервисы:

sudo /opt/lampp/lampp stop

Запустить только Apache (веб-сервер):

sudo /opt/lampp/lampp startapache

Перезапустить все сервисы (например, после изменения настроек):

sudo /opt/lampp/lampp restart

Клонирование репозитория

CSS-настройки для блога выделены в отдельный репозиторий, что позволяет использовать их повторно в разных проектах и избавляет от необходимости вносить одни и те же изменения в каждый проект.

Поэтому при клонировании репозитория использовать флаг --recursive

git clone --recursive https://github.com/AlexandrAnatoliev/project-euler-blog.git

Иначе при обычном клонировании папка src/styles будет пустой:

git clone https://github.com/AlexandrAnatoliev/project-euler-blog.git
cd project-euler-blog
ls src/styles/  # пусто или не существует

В этом случае нужно инициализировать и обновить подмодули:

git submodule init    
git submodule update

Обновление CSS-подмодуля до последней версии

Перейти в папку подмодуля:

cd src/styles

Обновиться до последнего коммита в ветке main:

git checkout main
git pull

Вернуться в основной репозиторий:

cd ../..

Зафиксировать изменение (новую ссылку на коммит):

git add src/styles
git commit -m "Update css to latest version"

Для контрибьютеров

В случае, если вы заметили какие то неточности в статье или хотите предложить какие-либо изменения в верстке этого сайта, вы всегда можете сделать pull request в этот проект ( Project-Euler-Blog).

Инструкции по Установке

1. Сделайте "форк" этого репозитория нажатием кнопки "Fork" в правом верхнем углу страницы. Это создаст копию репозитория на Вашем GitHub аккаунте.

2. Клонируйте Ваш "форкнутый" репозиторий нажатием кнопки "Code".
Откроется маленькое окно. Скопируйте из него URL и выполните на своем компьютере команду:

git clone https://github.com/<your-username>/project-euler-blog.git

3. Перейдите в папку с проектом:

cd project-euler-blog

4. Добавьте ссылку на оригинальный репозиторий для будущих обновлений:

git remote add upstream https://github.com/AlexandrAnatoliev/project-euler-blog.git

Примечание: Здесь должен быть URL оригинального репозитория, а не "форкнутого" вами, так что username в нем должно быть AlexandrAnatoliev, а не ваш собственный username.

5. Проверьте ремоуты для своего репозитория:

git remote -v

Вы должны увидеть origin (создается автоматически при клонировании) и upstream-ремоуты:

origin  https://github.com/<your-username>/project-euler-blog.git (fetch)
origin  https://github.com/<your-username>/project-euler-blog.git (push)
upstream        https://github.com/AlexandrAnatoliev/project-euler-blog.git (fetch)
upstream        https://github.com/AlexandrAnatoliev/project-euler-blog.git (push)

6.Выполните pull из upstream репозитория в вашу master ветку, чтобы синхронизировать ее с основным проектом:

git pull upstream master

7. Создайте новую ветку командой:

git switch -c fix-issue

Сейчас вы готовы начать работать с issue.
Помните: каждый раз сначала делать pull из upstream репозитория, чтобы держать содержимое вашего локального репозитория в соответствии с главным проектом.

Примечание: Рекомендую всегда создавать новую ветку для каждого issue, который вы выполняете! Иначе pull request будут слишком большими и возможно возникнут конфликты слияния.

Отправка ваших изменений

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

1.Добавьте ваши изменения в отслеживание:

git add файлы-которые-вы-изменили

2. Сделайте коммит:

git commit -m "Fixed issue"

3. Отправьте изменения в ваш "форкнутый" репозиторий:

git push origin fix-issue

После того как вы отправили Ваши изменения на GitHub, вы готовы создать pull request. Перейдите на Ваш "форк" репозитория на GitHub.

Вы увидите надпись "fix-issue had recent pushes" (или как ваша ветка называется) и кнопку "Compare & pull request" на ней.
Нажмите кнопку "Compare & pull request" и перейдете на страницу pull request оригинального репозитория проекта project-euler-blog.
Заполните поля title и description подробностями о задаче и Вашем ее решении. Вы можете также добавить иную информацию, такую как скриншоты, если хотите.
В конце нажмите кнопку "Create pull request", чтобы закончить создание pull request.

Поздравляю, вы сделали свой вклад в open source на GitHub!
Можете расслабиться и подождать пока не сделают ревью вашего кода. Если все хорошо, ваш pull request вольют в основную ветку. Если нет, вам будет

Примечание: Помните, что нужно подождать ревью вашего pull request, не закрывайте его сами. Если вас просят сделать изменения, вы можете коммитить их в ту же самую ветку, не нужно закрывать текущий pull request и открывать новый.