Деплой веб-приложения на практическом примере. Проще, чем кажется

Поделиться
HTML-код
  • Опубликовано: 2 дек 2024

Комментарии • 253

  • @artemshumeiko
    @artemshumeiko  4 месяца назад +9

    Прокачайся в прохождении собеседований на Солвит: clck.ru/3C4EiT
    Приглашаю на мой Практический курс по Backend разработке по всем актуальным технологиям: artemshumeiko.ru
    Вторая часть видео доступна только на Boosty: boosty.to/artemshumeiko/posts/e4fca0c7-d6ed-4c23-a13a-157cba05dfed
    Внутри:
    - Регистрация домена и поддомена
    - Получение SSL сертификатов
    - Настройка Nginx и поддомена

    • @michaelsopunov
      @michaelsopunov 2 месяца назад

      Уже месяц прошёл, планируете ли выложить вторую часть сюда на ЮТ? 🤞🤞
      Ждём по CI/CD !! 👍👍

    • @artemshumeiko
      @artemshumeiko  2 месяца назад

      @@michaelsopunov нет, только на boosty

  • @brazenoptimist
    @brazenoptimist 4 месяца назад +97

    Ждем больше видео по CI/Cd 😊

    • @СтасниславНиколаевич
      @СтасниславНиколаевич 4 месяца назад +1

      Гитхаб экшн и все такое) батник себе сделал который автоматом льет на гит и не сервер через ссх. Потому что гитхаб экшн не смог настроить. Не хочет подключаться и все тут.

    • @lorg0n
      @lorg0n 2 месяца назад +1

      @@СтасниславНиколаевич ну это костыль немного)

    • @СтасниславНиколаевич
      @СтасниславНиколаевич 2 месяца назад

      @@lorg0n но в добавок к этому, купив другой серв, впн настроил быстро и без проблем

    • @char0dey98
      @char0dey98 Месяц назад

      @@СтасниславНиколаевич себе делал гитхаб экшенс интересным способом - с меина код заливает на сервер, собирает докер - компоуз, отправляет на докер-хаб, проверяет соответствие с хабом, удаляет старый, поднимает новый конт. Так как сделал все на службах systemd - при замене конта просто стоплю на время.
      Насколько эта схема верная и имеет смысл на жизнь? (буквально все что необходимо для жизни сайта висит на службах, и в принципе при сбоях, сервер просто встает без моего участия)

  • @dxmln
    @dxmln 3 месяца назад +4

    Спасибо за разбор и объяснение. Полезное видео для понимания. Ждём CI/CD!

  • @KoryRuno
    @KoryRuno 4 месяца назад +5

    Артём, мое почтение. Спасибо!

  • @ЕвгенийЕрмак-м9м
    @ЕвгенийЕрмак-м9м 3 месяца назад +3

    Очень интересно, грамотная подача, нет слов паразитов. Благодарю!

  • @AssakurA1
    @AssakurA1 4 месяца назад +5

    Ждем видео про работу с ci/cd, очень интересно увидеть и внедрить правильно автоматическую доставку кода на сервер и его сборку 🔥

  • @sergsergey4251
    @sergsergey4251 4 месяца назад +8

    Спасибо, отличное видео. Успехов в развитии!

  • @АлексейБондаренко-т8т
    @АлексейБондаренко-т8т 3 месяца назад +1

    Круто круто круто. Ничего лишнего. Быстро, без воды.

  • @zizzxiii2714
    @zizzxiii2714 4 месяца назад +5

    СУПЕР!!!!!!! Спасибо! Жду еще видео!

  • @РусланОсманов-с7й
    @РусланОсманов-с7й 3 месяца назад +1

    мне нравиться как Вы преподносите, темп,подход ,голос мне прям подходит! Очень интересно,приятно и спокойно,спасибо большое

  • @v.lavrinovics1970
    @v.lavrinovics1970 4 месяца назад +3

    Благодарю за видео. Я сам использую node/nuxt и vue, но ваше видео довольно полезно было посмотреть.

  • @jevgenij2929
    @jevgenij2929 4 месяца назад +2

    🔥 спасибо за полезный туториал

  • @MichaelOsipov
    @MichaelOsipov 4 месяца назад +7

    Спасибо, очень познавательно!

  • @fila7yt
    @fila7yt 4 месяца назад +7

    лайк поставил, теперь ждем видео про CI CD

  • @ИванШишкин-щ1у
    @ИванШишкин-щ1у 3 месяца назад +1

    Спасибо тебе, Артём,за все твои старания для нас. Ты очень крут!

  • @puhuilo8801
    @puhuilo8801 2 месяца назад +10

    CORS и не нужны были для работы этого приложения. Если запросы идут на тот же origin (а в данном случае это так - /api), то запросы не будут считаться кроссориджинами. Ошибка CORS, которая у тебя появилась при открытии приложения, была вызвана тем, что изначально запрос уходил на localhost.

  • @kirillzhukov1675
    @kirillzhukov1675 4 месяца назад +1

    Спасибо большое! Как всегда очень полезное видео. Хочется больший хронометраж с большим объяснением возможных проблем, предупрежден - значит вооружен

  • @ast4k441
    @ast4k441 4 месяца назад +2

    Спасибо, за видео и ссылку на гитхаб😊, контент очень поучительный и полезный. Спасибо за проделанную работу.

  • @whoami866
    @whoami866 4 месяца назад +41

    БРО, я только смотрю видео по деплою django приложения. Вроде разобрался а вроде и нет, выхожу в реки и вижу это чудо..

  • @kottofey1
    @kottofey1 21 день назад

    Шикарный видос! Всё по делу и довольно кратко, а с другой стороны подробно! Спасибище!!!!!

  • @localhost5000Leo
    @localhost5000Leo 4 месяца назад +1

    Спасибо за урок, научился копировать.

  • @nobodylll48
    @nobodylll48 4 месяца назад +1

    Спасибо, сам ломал голову как бэк и фронт соединить.
    А ранее деплоил написанный на Джанго сайт джинджой2, вот теперь попробую фронт на реакте раскатать.

  • @backsty-
    @backsty- 3 месяца назад

    Самый понятный обзор который я когда-либо видел!!! Спасибо тебе, продолжай в том же духе)

  • @дмитрийщуцкий-с3б
    @дмитрийщуцкий-с3б 4 месяца назад +2

    Супер! То что было нужно.

  • @Yaonkey
    @Yaonkey 3 месяца назад

    Очень редко пишу комментарии, но какой же у тебя полезный контент на канале, хоть я и не Python-разработчик. Спасибо)

  • @svetlanamazhaykina6918
    @svetlanamazhaykina6918 3 месяца назад

    Спасибо за Ваш труд! Коммент в поддержку канала.

  • @kastet-it
    @kastet-it 4 месяца назад +1

    Спасибо. Видео отличное. Как база самое то.

  • @programmistka_v_amerike
    @programmistka_v_amerike 3 месяца назад

    Очень приятный и интуитивный мини-мастеркласс вышел :)

  • @arukeulen7387
    @arukeulen7387 2 месяца назад

    спасибо большое, реально чудо контент 😇🙏

  • @iJaVolo
    @iJaVolo 4 месяца назад +1

    Вчера я выяснил, что мне нужен, SSL и nginx, и вот сразу же видео от моего любимого Артёма! ❤🎉🎉

  • @TSUNAMIBEATSONE
    @TSUNAMIBEATSONE 4 месяца назад +1

    Лайк в поддержку! Смотрел с интересом) Единственное, я бы наверно зависимости ставил с npm ci. Чтобы внезапно не отпало ничего в один день)

  • @ulukbekisakov5469
    @ulukbekisakov5469 2 месяца назад

    Красавчик братан, продолжай в том же духе - очень помогает 💪🏻👍🏻

  • @samuray8128
    @samuray8128 4 месяца назад +4

    бро, ты лучший!

  • @_test_test
    @_test_test 4 месяца назад +1

    очень хорошо рассказываешь. как раз в голове не укладывалось что с этим делать. есть еще апач, походу это +- то же скмое

    • @artemshumeiko
      @artemshumeiko  4 месяца назад +1

      Апач раньше использовали вместо nginx, но последние лет 5 очень многие перешли на nginx

  • @l1acdy
    @l1acdy 3 месяца назад

    12:24 Кстати, что бы быстро копировать кусок кода, можно выделить несколько строк, и нажать: Shift + Alt + Стрелочка вниз или вверх

  • @ВалентинТ-х6ц
    @ВалентинТ-х6ц 2 месяца назад

    Прикольно, спасибо. Сделал похожим образом, только для .net core + react. Плюс закинул фронт сразу на тот же образ, что и апи проксирует.

  • @ДиасМуратов-в2ы
    @ДиасМуратов-в2ы 2 месяца назад

    спасибо за информацию, ждем про ci/cd

  • @Dik131WZD
    @Dik131WZD 4 месяца назад +1

    Хоть и не python разработчик, подпишусь

  • @artemivanov5013
    @artemivanov5013 2 месяца назад

    Супер видео! Ждем cicd!

  • @andreyyanchuk986
    @andreyyanchuk986 3 месяца назад

    Полезный видос, спасибо.

  • @Leonidn1972
    @Leonidn1972 3 месяца назад +1

    Thank a lot.Very usefull content.Good luck.

  • @Russia-Infinity
    @Russia-Infinity 4 месяца назад +9

    Артем, помимо того что ты талантливый молодой человек в программировании , так еще и прекрасная дикция и поставленная речь-это тоже дорогого стоит!!)) Удачи и процветания тебе, соратника я точно в твоем лице нашел!!!

  • @biovawan
    @biovawan 2 месяца назад

    круто! Спасибо! Мега полезно!

  • @erzhana8708
    @erzhana8708 4 месяца назад +1

    Классная подача 👍

  • @SoullessStudent
    @SoullessStudent 4 месяца назад +1

    хорошее видео. Всё что нужно в одном месте!

  • @zion4d
    @zion4d 4 месяца назад +3

    Отличное видео, но опаздал на год😅 самому пришлось всё это расгрести и запустить

  • @cibofff
    @cibofff 4 месяца назад +1

    Отлично объяснил Спасибо

  • @digitalberd
    @digitalberd 4 месяца назад +1

    Отличное видео!
    Я тоже больше люблю через поддомен деплоиться.

  • @set1qs
    @set1qs 4 месяца назад +2

    Видос супер! И вовремя ) Как раз мне нужно делать деплой ТГ бота ) и я эту тему не очень люблю потому что не сильно понимаю ) Оформил ВМ машину на убунту, и хз к чему подступиться, а тут прям хоба и видос ) теперь знаю что буду делать ))
    Придется наверно и бусти подрубить, очень нужно https )

    • @artemshumeiko
      @artemshumeiko  4 месяца назад

      жду на бусти)

    • @dkushka
      @dkushka 3 месяца назад

      ChatGPT и пару вопросов решит твою проблему воин

    • @set1qs
      @set1qs 3 месяца назад +1

      @@dkushka Я знаю, но с его видосов норм заходит понимаете) а если в теме не совсем шаришь, то жпт испепелит твой комп

  • @a3development960
    @a3development960 4 месяца назад +34

    это все для реального продакшена с большими нагрузками не подходит. На проде юзают docker swarm + portainer для управления + свой или чужой docker registry, а такое поднять уже не так просто и быстро :(
    То что показано в видео - это прям база, подходящая на время разработки проекта и для небольших проектов
    Артем в любом случае красаучег, пишу просто чтобы новички в курсе были)

    • @a3development960
      @a3development960 4 месяца назад

      @@cyberianoidkubernetes это уже другой уровень)) и по времени ещё больше чем swarm

    • @raidmaxboy
      @raidmaxboy 3 месяца назад

      После долгой работы с терминалом и чистым докер композ не могу никак начать работать с портейнер) бесит он меня))) люблю просто nano docker-compose.yml и погнали)

    • @ЮрийЮрьев-х2т
      @ЮрийЮрьев-х2т Месяц назад

      если вы юзаете докер сворм, то мои соболезнования. вы отстали лет на 10

    • @a3development960
      @a3development960 Месяц назад

      @@ЮрийЮрьев-х2т чувак, не переживай, мы уже на кубер перешли, так что не ты один тут такой умный

  • @ivanshalaginov548
    @ivanshalaginov548 4 месяца назад +1

    Невероятно, супер полезно!

  • @tolyachernov7849
    @tolyachernov7849 4 месяца назад +1

    Классно видео! Объяснил все и простыми словами плюс рабочий пример. Я новичок в разработке, но, можно ли видео про работу с ssh?

  • @vlad-bruce
    @vlad-bruce 3 месяца назад

    Спасибо, очень полезно

  • @Gregorysharkov
    @Gregorysharkov 2 месяца назад

    Отличное видео, спасибо

  • @testikarus
    @testikarus 13 дней назад

    Спасибо за Ваш труд! Коммент в поддержку канала.

  • @0tbeptka
    @0tbeptka 3 месяца назад

    Приятная подача материала

  • @orthodox-chanel
    @orthodox-chanel 3 месяца назад +1

    обязательно ли использовать докер? может будет версия видео с деплоем без докера?для лучшего понимания nginx. уже поднимал пару проектов на nginx пл инструкции, все вроде работает, но я не понимаю как, хотелось бы пробелы заполнить

  • @СергейЮров-б6е
    @СергейЮров-б6е 4 месяца назад +1

    Бодро! Круто

  • @firstmain52
    @firstmain52 4 месяца назад +3

    Очень качественное видео, спасибо!!

  • @vvspl
    @vvspl 3 месяца назад +1

    Это на самом деле легче чем кажется... Цитирую аффтора: "Мы не будем вдаваться в подробности что здесь происходит, что здесь написано")))

  • @МикиКляйн
    @МикиКляйн 3 месяца назад

    Приятно слышать конструктивную приятную речь и видеть примеры, а то, что не видео чужие открываешь, там то картавый, что уши режет, либо воды столько что захлебываешься к середине. Тут мне все понравилось🎉

  • @jevgenij2929
    @jevgenij2929 4 месяца назад +5

    А как быть с БД? Её тоже нужно в докер запихивать? Если да, то как обеспечить целостность информации? И как рассчитать размер диска на хостинге, чтобы база внезапно не заполнила всё свободное пространство?
    Спасибо.

    • @ember209
      @ember209 3 месяца назад

      Там же volume минтишь. Если не нравится докер, можешь просто установить тот же psql прямиком на машину.

  • @FirstNameLastName-fz8pg
    @FirstNameLastName-fz8pg 4 месяца назад +1

    Ждем видео по CI/CD 😀

  • @enter0prise
    @enter0prise 4 месяца назад +4

    CORS не должен быть проблемой (и не требует настройки), если фронт и бэк висят на одном домене.

  • @-mishana-
    @-mishana- 3 месяца назад +1

    Здравствуйте, возможно вам будет интересно сделать курс по Postgresql. Очень хотелось бы

  • @medreab
    @medreab 4 месяца назад +6

    Я: собираю свое первое react-приложение, привожу код в порядок не спеша перед деплоем, думаю выложить на хостинг за 1 час.
    Деплой: привет, как дела?
    как вовремя ты выложил этот ролик, спасибо большое!

    • @uglevod184
      @uglevod184 4 месяца назад

      фтафте фсвесточки )

    • @silentage6310
      @silentage6310 4 месяца назад +2

      если бэкенда нет, то и услояжнять всё так нет смысла. еще и дешевле на порядок будет

    • @medreab
      @medreab 4 месяца назад

      Все оказалось гораздо проще, даже не пришлось так заморачиваться, просто забилдил приложение и выложил его в папку public_HTML на хостинге. Действительно, без бэка проще 😅

  • @tuku_mann
    @tuku_mann 4 месяца назад +1

    Хотелось бы узнать об оптимизации такой nginx сборки

  • @anzy99829
    @anzy99829 4 месяца назад +2

    В целом изучил docker, сам и методом тыка, но если когда то у меня был этот видос, то процесс был бы без тех костылей которые я стукался. Го видос про k8s

  • @shyngysbek6907
    @shyngysbek6907 2 месяца назад

    Еще немного знаний в копилку :D

  • @TheSemenFarada
    @TheSemenFarada 3 месяца назад +1

    О прикольно - єто то что я искал спасибо. я задеплоил приложение на vps хостинг без nginx и https - и без какой либо защиты от - его ломанули и увели базу.
    А кстати хорошая идея собирать сначала образы для прода - деплоить их в репозиторий а на проде только скачивать релизную версию (с релизным тегом) и ничего не пересобирать на проде?

  • @andreiigurkovskii7346
    @andreiigurkovskii7346 2 месяца назад

    Ответил себе на несколько вопросов этим видео, спасибо. А что поменяется в подходе если на бекенде теперь будет docker-compose с базой. Как тогда будут выглядеть все?

  • @POEOneLove
    @POEOneLove 2 месяца назад

    Фигасе наворотили абстракций на "залить по фтп" 😁

  • @biLLie_wiLLie
    @biLLie_wiLLie 4 месяца назад +1

    спасибо за видео! А что во 2й части на бусти? Чем отличается от этого видео? Там показан ci/cd и автоматизирована заливка на сервер изменений из гита?

    • @artemshumeiko
      @artemshumeiko  4 месяца назад +1

      Во второй части на Boosty рассмотрены
      - Регистрация домена и поддомена
      - Получение SSL сертификатов
      - Настройка Nginx и поддомена

  • @ДаниилСоколов-о8р
    @ДаниилСоколов-о8р Месяц назад

    Спасибо большое, помог

  • @intensy1605
    @intensy1605 4 месяца назад +2

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

  • @СергейК-б6н
    @СергейК-б6н 3 месяца назад

    30-40 строчек кода это 3-4 покрашенных кнопки на фронтенде :D

  • @alexmakarov1468
    @alexmakarov1468 2 месяца назад

    топ!

  • @DIMAZRU
    @DIMAZRU 2 месяца назад

    Круто, полезно

  • @MikalaiCeppnik
    @MikalaiCeppnik 4 месяца назад

    🔥🔥🔥

  • @Denis-xo9jx
    @Denis-xo9jx 4 месяца назад +1

    Привет! Спасибо за видео! Интересна тема SEO оптимизации реакта. Было бы интересно посмотреть видео от тебя. Я только разбираюсь -и как я понимаю - страницы рендерятся на стороне клиента использую js. И если поисковый бот не поддерживает js - то и читать ему нечего. Есть библиотеки для пререндеринга на стороне сервера, но в основном их используют для подготовки пререндеринга для поисковых ботов. Можно ли создавать готовые html страницы и хранить их в отдельной папке и обновлятт их при необходимости? Вообще есть ли такая практика или этот путь вникуда? Я имею ввиду сайт до 1000 страниц. У тебя есть видео про твой проект по подготовке к собеседованию и там затрагивается тема кеширования, но она не развернута. Естт ли смысл создавать готовые html страницы и хранить их в отдельной папке и отдавать клиенту готовый кешированный html прямо из статического файла? В этом естт определенные плюсы - заголовок last-modified будет корректен, файл кеширован, не нужен js для отображения контента. Сделай видео - какие варианты могут бытт для необходимости seo оптимизации. Спасибо

    • @artemshumeiko
      @artemshumeiko  4 месяца назад +2

      не, никто так html не хранит в сыром виде
      для этого используются ssr фреймворки типа Next (react), Nuxt (vue). Они отлично справляются с кэшированием, генерацией и отдачей HTML

  • @eduardmart1237
    @eduardmart1237 2 месяца назад

    А какой плагин для VSCode чтоб подсказывал docker compose?

  • @ivanovchin
    @ivanovchin 4 месяца назад +9

    где же ты был пару дней назад, мы ебались целый день с этим деплоем, видео безусловно очень полезное 👍

    • @osad4enko
      @osad4enko 4 месяца назад +15

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

  • @sega-r9w
    @sega-r9w 3 месяца назад +11

    Пол часа банальщины, а вторая часть на бусти 😂 замануха

    • @andar12345
      @andar12345 27 дней назад

      Согласен, самый основные моменты депроймента на продакшен не были рассказаны, так что видео разочаровало

  • @ibrahimoglu
    @ibrahimoglu 4 месяца назад +1

    👍

  • @purkhanov
    @purkhanov 4 месяца назад +1

    Почему первый nginx направляет запрос на вторую? Нельзя чтобы первый сразу отдал статические файлы?

    • @artemshumeiko
      @artemshumeiko  4 месяца назад

      Можно, но в условиях деплоя через докер так легче

  • @rustamergashev7278
    @rustamergashev7278 3 месяца назад

    👍

  • @sergeyzaycev3733
    @sergeyzaycev3733 2 месяца назад

    vercel и heroku в этот момент 🗿

  • @proxickful
    @proxickful 4 месяца назад +1

    Отличное, качественное видео! Все разжованно. Но вот мучает вопрос. В видео показан процесс деплоя исключительно при помощи docker и git. Вопрос, которому можно присудить "11/10 шапочек из фольги", адресован к докеру. А что если оно перестанет существовать? Во всякому случае docker hub. Как быть?

    • @proxickful
      @proxickful 4 месяца назад

      Вопрос специально холеварный, ибо например я любитель деплоить руками/скриптами на хост. А также блокировку по гео-положению никто не отменял ;)

    • @hgfyos
      @hgfyos 4 месяца назад

      Так вместо Docker Hub можно использовать любой другой registry, например, с GitHub/GitLab или вообще свой развернуть на своём сервере. Тоже самое и с git, тот же GitLab можно поставить на свой сервер

    • @hgfyos
      @hgfyos 4 месяца назад

      А Docker сам по себе не исчезнет, он в open source. И даже если они удалят репозиторий, есть куча зеркал и форков. На крайняк есть podman со схожим CLI от Docker. А если серьёзно, то Docker уже настолько стал enterprise-решением и так проник во многие компании, что в ближайшее время точно не исчезнет

  • @Timofei-yy5nm
    @Timofei-yy5nm 4 месяца назад +1

    CI/CD оч актуально, особенно через Гитлаб

    • @artemshumeiko
      @artemshumeiko  4 месяца назад

      услышал, сделаю видео)

  • @Danya-y5g
    @Danya-y5g 4 месяца назад +2

    ждем видео по ci cd

  • @andreyshishkin4958
    @andreyshishkin4958 Месяц назад

    Все отлично! Но правильнее все же говорить не сервера, а эндпоинта.

  • @itgreezly6873
    @itgreezly6873 2 месяца назад

    Расскажи про ci/di

  • @kvn47
    @kvn47 4 месяца назад +1

    Так ведь reverse proxy будет в обоих случаях. Это же не зависит от способа обращения к api.

  • @voronovmaksim88
    @voronovmaksim88 2 месяца назад

    Спасибо за видео. В описании нет ссылки на github. Ссылка на habr открывается с ошибкой.

    • @artemshumeiko
      @artemshumeiko  2 месяца назад

      github.com/artemonsh/deploy-frontend-backend
      P.S. вроде без ошибки открывается

  • @EldarOzo
    @EldarOzo 3 месяца назад

    Респект.
    Вопрос, правильно ли я понимаю что в докер файле фронта ты поднимаешь два контейнера, один с нодой, второй с нджинксом, а потом в докер композе ты поднимаешь ЕЩЕ один контейнер с нджинксом. Получается у тебя внешний запрос нджинкс из композа проксирует в сервис фронтенд, там его перехватывает ВТОРОЙ нджинкс и уже второй нджинкс отвечает файлами которые он получил из контейнера с нодой??

    • @artemshumeiko
      @artemshumeiko  3 месяца назад

      нода не поднимается, она используется только для сборки статики
      ответ на ваш вопрос - да

    • @EldarOzo
      @EldarOzo 3 месяца назад

      @@artemshumeiko спасибо 👌

  • @LeaderDriveAUTO
    @LeaderDriveAUTO Месяц назад

    Запишите ролик как развернуть nginx через cicd gitalab

    • @artemshumeiko
      @artemshumeiko  Месяц назад

      приходите на курс, там подробно изучаем CI/CD: artemshumeiko.ru

  • @rudinandrey
    @rudinandrey 3 месяца назад

    ну да, по CI/CD было бы интересно, без перерыва.

  • @VZava
    @VZava 2 месяца назад +1

    а зачем нам 2 nginx файла? и для фронта и для общей системы

    • @m1kel973
      @m1kel973 2 месяца назад

      На самом деле можно было и в общем это сделать, но такой вариант более симпатичен, представь что будет если пихать все в один файл)

  • @k3rber0s
    @k3rber0s 2 месяца назад

    Пароль от рута засвечен 😮

  • @Davlet
    @Davlet 2 месяца назад

    Подача великолепная. Без воды и по сути.