Создавайте, развертывайте и масштабируйте современные веб-проекты с помощью Netlify

Распространенной проблемой является рассмотрение вопроса о том, где опубликовать проект после его создания, что является одной из общих проблем среди веб-разработчиков. На этом этапе появляется Netlify, который, на мой взгляд, играет жизненно важную роль, когда дело доходит до публикации вашего веб-сайта. Конечно, есть много других альтернатив, таких как страницы GitHub, Heroku и т. д., однако я просто попытаюсь упомянуть преимущества использования Netlify. Это одна из лучших альтернатив основам для личных проектов, хобби-сайтов или экспериментов, которая предлагает автоматизированные сборки из личных или общедоступных репозиториев Git. Не говоря уже о том, что это бесплатно для 1 пользователя и для неограниченного количества веб-проектов. Он также предоставляет расширенные функции, параметры безопасности и поддержку для профессиональных пользователей и команд, что стоит не более 19 долларов в месяц для версии Pro и 99 долларов в месяц для варианта Business. Подробности смотрите на официальном сайте.

Предпосылки

Убедитесь, что у вас есть следующее:

Построить проект

Во-первых, вам нужно создать свой проект Vue CLI. Если у вас его нет, вы можете сослаться на мой проект в качестве ссылки. Когда вы будете готовы, вы можете собрать проект, выполнив следующую команду.

npm run build

После выполнения сборки папка dist создается автоматически. Внутри этой папки мы могли видеть минифицированные и готовые к производству файлы. Обычно мы могли бы взять эти файлы и загрузить их по ftp, чтобы приложение работало в браузере. Вместо этого мы развернем проект на Netlify.

Во-вторых, вам нужно создать локальный репозиторий Git. Если он еще не установлен, установите Git перед вашей ОС. Вы можете сослаться на следующую ссылку для установки. Выполните следующие основные команды git, чтобы создать локальный репозиторий.

git init
git add .
git commit -m"Initial commit"

После выполнения локальных команд вам необходимо создать удаленный репозиторий.

Затем вам просто нужно выполнить следующие команды, чтобы отправить ваш локальный проект на GitHub.

git remote add origin https://github.com/BasakKurtLab/Guest-Registration-App.git
git branch -M main
git push -u origin main

Создание учетной записи Netlify

Следующим шагом является создание учетной записи Netlify. Я использую свою учетную запись электронной почты, однако вы можете выбрать один из следующих вариантов для создания учетной записи.

После входа в систему выберите новый сайт из опции GitHub.

И выберите свою систему контроля версий. В моем случае я выберу GitHub.

Вы можете выбрать все свои репозитории или настроить его, просто выбрав репозитории вручную. После выбора репозитория вам необходимо установить Netlify.

Развертывание проекта

Вы можете выбрать ветку для развертывания: промежуточную, релизную или основную. Затем напишите команду сборки и нажмите «Развернуть сайт». Нажав на ссылку «развертывание вашего сайта», вы также можете следить за своими журналами развертывания.

После завершения процесса развертывания ваш веб-сайт публикуется с заданным URL-адресом. Просто нажмите, чтобы увидеть ваш недавно развернутый веб-сайт.

Изменить свое доменное имя

Если вас не устраивает данное доменное имя (в большинстве случаев да 😃), есть возможность изменить его.

В нашем случае я изменил название на guest-reg-app.

Развертывание обновлений

Если вы хотите обновить свой проект, все, что вам нужно сделать, это сделать свои коммиты локально и отправить их в удаленный репозиторий. Netlify немедленно обнаруживает, что репозиторий был изменен, и повторно запускает команду сборки и повторно развертывает папку dist, которая обновляет проект через минуту.

Заключение

Как мы видим, весь процесс очень прост в выполнении, даже если вы новичок. Три основные причины использовать Netlify, с моей точки зрения, следующие: во-первых, очень простая установка, которая, скорее всего, занимает менее 2-3 минут и проста. Вторая причина в том, что это бесплатно для таких разработчиков, как я, которые хотят представлять свои проекты. Последняя причина для меня заключается в том, что Netlify берет на себя ответственность за постоянное развертывание по мере того, как вы вносите новые изменения и продвигаете их.

Вы можете подписаться на меня в Medium, GitHub и связаться со мной в LinkedIn.

Использованная литература: