Деплой Frontend приложения. Настройка nginx. Подключаем домен, настраиваем HTTPS, gzip, docker
В этой статье мы рассмотрим процесс деплоя Frontend приложения с использованием nginx, настройку HTTPS, gzip и использование docker для упрощения процесса управления приложением.
Шаг 1: Деплой Frontend приложения
Для начала деплоя Frontend приложения, мы должны иметь скомпилированный код нашего приложения. Этот код можно получить из репозитория приложения или скомпилировать его локально. После этого мы можем загрузить код на наш сервер с помощью FTP или другого метода передачи файлов.
Шаг 2: Настройка nginx
После загрузки кода Frontend приложения на сервер, мы должны настроить nginx для обработки запросов к нашему приложению. Мы создаем конфигурационный файл для nginx, определяем путь к нашему приложению и настраиваем проксирование запросов к нему.
Шаг 3: Подключаем домен, настраиваем HTTPS
Чтобы наше приложение было доступно по доменному имени, мы регистрируем домен и привязываем его к IP-адресу нашего сервера. Далее, мы можем использовать Let’s Encrypt, чтобы получить бесплатный SSL-сертификат и настроить HTTPS для нашего приложения.
Шаг 4: Настройка gzip
Для улучшения производительности нашего приложения, мы можем настроить сжатие gzip для передачи сжатых файлов клиенту. Это позволяет уменьшить объем передаваемых данных и ускорить загрузку страницы.
Шаг 5: Использование docker
Для упрощения процесса управления нашим приложением, мы можем использовать docker для контейнеризации и развертывания приложения. Docker позволяет упаковать наше приложение и его зависимости в контейнер, который легко можно передавать между различными средами разработки, тестирования и продакшна.
vim отстой!!! nano ванЛав (ctrl+o=save; ctrl+x=exit)
Вот это хорошая база девопса что мне нужна была
Всем познавателям привет!! мужик кто подскажет есть фротенд с ssl который по обращается к серверу через приставку /api с настройкой в конфигурациях location /api { proxy_pass http://localhost:5000; и тд }. никак не получается нормально запросы отрабатывать … на локальной машине где фронт и бек крутятся запросы прилетают и обрабатываются но с внешнего клиента работает только фронтенд операции связанный с задействованием location /api не работают !!!! подскажите как корректно настроить …. очень надо ))
каеф, спасибо
Низкий поклон за такую инструкцию!!! Бесценная информация.
Сделал все как на видео, но при переходе на https получаю This site can’t be reached…
Крутой ролик! Только теперь не понятно как быть если несколько проектов на сервере и нужно их на разные домены. Задавать в записях домена разные порты?
Честно, как человек, с пару месяцев назад познакомившийся с реактом, тайпскриптом, монгодб и scss, я почти ничего не понял, и стало очень страшно. Вот все эти операции с командной строкой в начале нужно именно жёстко понимать или, наоборот, выучить порядок и жить спокойно? Просто выглядит жёстко…
На 15.58 там наверно уже должен быть путь var/www/dist, так как мы делали изменения в параметре root раннее
Спасибо большое 🙏 то, что нужно было! 👍
спасибо – еще бы jenkins прикрутить чтоб пересобрка автоматом была и круть )
Ок , а если ещё есть бэк с базой на postgreы , это как всё настроить ?
Для nextjs плиииз
а как быть если нет файла index.html?
Отличное видео по deploy
Просто лучший, очень сильно такого видоса не хватало
В два слова объяснить для чего нужен Nginx – "что бы отдать статику", а то придурки на ютубе наделают миллион ролликов по 10-20 минут и хрен пойми для чего нужен nginx. Большое спасибо, ролик полезный.
Тимур, огромное спасибо!!!
Молодец!!!
Ulbi TV
Тимур, я так понимаю, что ошибаюсь, думая, что написав сайт на react, запустив build, просто скопировать содержимое папки buid в директорию хостинга (как я ранее делал с html+js) – так неверно? то есть надо все вот эти действия делать, то есть не иначе как, а разве не возможно сделать билд уже готовый для залития на хост и все? Просто ты объясняешь все для ubuntu, я простой незаурядный начинающий, у меня винда, гит есть но я не вижу необходимости его участия в размещении сайта на платном хосте, по крайней мере ранее мне это не было нужно (сделал сборку html+сss+js перенес файлы посредством faizille и сайт работает). Просто, я на хост зашел посредством PoweShell и дальнейшие команды допустим как ты указал: apt install npm командная строка выдает -bash: apt: command not found и ты не объясняешь любые варианты, я думаю, что мне надо обращаться к bash ? в общем у меня тупик )))))