PWA за 30 минут. Будущее веб-разработки

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

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

  • @AidaDrogan
    @AidaDrogan  4 года назад +28

    Я прошу прощения за звук в этом видео. Объективно это худшее видео по звуку на моём канале...
    Прошла всего неделя с момента переезда в новый дом, и я пока не знаю, когда дойдут руки оборудовать что-то похожее на студию =)
    Так что у меня в распоряжении есть пустая комната с чудесным ревербом и пару гирдянд для освещения. И, конечно, желание записывать новые видео. Спасибо за понимание!

    • @shifronim8950
      @shifronim8950 4 года назад

      С новосельем!🎉 Если верно высказывание что "уважают за достоинства, а любят за недостатки", то качество твоего контента такое что ... моё почтение, а такой звук я даже люблю:)

    • @AidaDrogan
      @AidaDrogan  4 года назад +2

      Спасибо! =D У меня случаются переезды довольно часто, всё никак не найду то самое место для жизни. Так что пару раз в год у меня новая "студия". Попробую улучшить её в ближайшее время.

    • @user-zt1hx3ci2v
      @user-zt1hx3ci2v 4 года назад +1

      Качественное видео, выпускай почаще! :)

    • @user-PavL0v_
      @user-PavL0v_ 4 года назад +2

      Так я в вас влюбился))что мне делать?)

    • @kant4967
      @kant4967 4 года назад

      Перфекционизм во всем)

  • @coconut_punker
    @coconut_punker 4 года назад +79

    Храни господь ютюберов, ориентированых не на дебильную аудиторию.. Очень инетерсное видео, спасибо.

    • @AidaDrogan
      @AidaDrogan  4 года назад +4

      Мы существуем, пока вы смотрите нас ;) Спасибо!

    • @AidaDrogan
      @AidaDrogan  4 года назад +5

      @@rarecase3666 Я смотрю, вам так сильно не понравился мой канал, что вы решили посмотреть как можно больше видео и оставить свои ценные комментарии, в надежде, что кто-нибудь сжалится над вашей жирной трольей тушкой и кинет погрызть хоть тухлую косточку?
      Мне глубоко фиолетово мнение ваших собратьев по разуму, но оскорблять комьюнити я вам позволить не могу. Мы программисты-практики, которые делятся своим опытом. И никакие "технические презентации" я не создаю. Не нравится подача материала - добро пожаловать в репозиторий. Или там для вас слишком много непонятных буков?
      Судя по вашим шовинистическим выпадам, у вас огромные комплексы. С этим нужно идти к врачу, а не в комьюнити разработчиков. Здоровый человек не станет называть дебилами 8000 зрителей только потому, что услышал в видео слово "туалет".
      Судя по многократным актам дефикации под моими видео с этим у вас тоже проблемы? И, кажется, ещё с регулярным сексом и женским вниманием. Представьте себе, уверенные в себе люди иногда шутят и про секс (срамота-то такая!)
      К вашему сведению, русскоязычные люди - это совершенно не обязательно русские. Например, для меня русский язык - второй из пяти, которыми я владею. И я выбрала его для своего основного канала, потому что считаю его красивым и вполне подходящим, чтобы говорить о программировании.
      P.S. Комментарий не для вас, а для Родиона и других моих зрителей, которые случайно вступят в испражнения вашего мозга. У меня принципиальная позиция не удалять, а игнорировать подобные шедевры, но иногда оставлять это без внимания нельзя.

  • @fromillia
    @fromillia 4 года назад +10

    Удивлён, что у тебя сейчас так мало подписчиков. Очень качественно подаёшь материал.

  • @guffboss2358
    @guffboss2358 3 года назад +5

    Лучшее видео для понимания PWA. Спасибо за ваш труд))

  • @braggamaffin
    @braggamaffin 4 года назад +24

    Честно говоря, включил видео со скепсисом, ну тип понятно, опять ловят задротов на симпатичную ведущую. В итоге досмотрел до конца и подписался. Короче, метод работает))

  • @dshevchenkoo
    @dshevchenkoo 2 года назад +1

    Это самое лучшее обучающее видео по теме PWA!

  • @user-jp4lw9qm1c
    @user-jp4lw9qm1c Год назад

    Отзываюсь с толчка, видео понравилось , не открывался со стула всё время

  • @thepawday
    @thepawday 4 года назад +8

    Спасибо за очень хорошее и интересное видео. Я пойду попробую испытать это с REACT. SPA & PWA наверное самое классное сочетание Web технологий.

  • @user-vx9ug1nb2t
    @user-vx9ug1nb2t 4 года назад +2

    Значит, вчера прочитал про PWA статью на хабре и подумал: какая крутая штука!!! А сегодня просыпаюсь с утра и выходит видео на канале про эту технологию. Кажется это ещё большая магия, чем сама технология))) Теперь я обязательно это попробую))) Спасибоооо, отличное начало дня сегодня)) Но надо идти мыть посуду...

  • @jondoe1188
    @jondoe1188 2 года назад +1

    лучшее видео по теме.

  • @Sergey-jq5kz
    @Sergey-jq5kz 3 года назад +1

    Крутая подача и полезная информация. Большое тебе спасибо

  • @user-xb5sx9hm4x
    @user-xb5sx9hm4x 3 года назад +1

    ай молодец! и подача классная, и по делу.

  • @daniyarmr9876
    @daniyarmr9876 2 года назад

    Супер! У меня все получилось) Спасибо! Теперь осталось как то прикрутить прелоадер что бы пользователь при клике понимал что страница грузится

  • @e-benz
    @e-benz 4 года назад +3

    Как всегда все ясно и понятно, супер подача информации!!!

  • @AlexeyYaricov
    @AlexeyYaricov 4 года назад +1

    Все разложила по полочкам. Очень полезная инфа для меня.

  • @OrlenokV
    @OrlenokV 4 года назад +3

    Спасибо большое за видео, все отлично! Звук - после апгрейда домашней студии уверен, что будем как и раньше наслаждаться отличным звуком и картинкой. Было интересно, попробую как оно работает с Vue.

  • @VitaliyHAN
    @VitaliyHAN 3 года назад

    Вау! Был скептичен, но подача и глубина поразила! Подписка!

  • @lightxlampax
    @lightxlampax Год назад

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

  • @msdryagin
    @msdryagin 3 года назад +1

    Класное видео. Прям то что я и хотел услышать, когда захотел сделать из сайта pwa. Спасибо большое :)

  • @karodar
    @karodar 4 года назад +1

    Золотце ты просто солнышко, люблю упрощение) Впервые узнал о PWA разбирая Vue фреймворк, частично знаю англ, однако на своем языке куда приятней понимать что-то новое, во всяком случае пока_)

  • @SanchoXDE1337
    @SanchoXDE1337 4 года назад +2

    Очень классное видео! Спасибо вам)

  • @user-xs4mg9nq1m
    @user-xs4mg9nq1m 4 года назад

    Спасибо за полезный видос!) Отдельно хочу поблагодарить за пояснение методов и исчерпывающую инфу для "быстрого старта") Побольше бы таких видео.

  • @user-yk6bf7bm7x
    @user-yk6bf7bm7x 4 года назад +1

    дай Бог вам здоровья!

  • @blazheiko777
    @blazheiko777 3 года назад

    спасибо за интересное видео

  • @user-fz5ym3wv1e
    @user-fz5ym3wv1e 3 года назад

    Смотрю это видео, и осознаю всю магию Web и PWA.

  • @yuriyfse6555
    @yuriyfse6555 10 месяцев назад

    непогане відео по питанню, лайк -)

  • @egerr10
    @egerr10 3 года назад

    спасибо, всё просто и понятно

  • @-anonim-3008
    @-anonim-3008 Год назад

    Хахахахахха, этот цвет ни на что не похож на такое, о чём вы не будете писать в комментариях
    Спасибо большое за ролик, очень информативно!)

  • @StepN4
    @StepN4 4 года назад

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

  • @gohnetroner1533
    @gohnetroner1533 4 года назад +9

    Замечательная девушка, обожаю ее (♡゚▽゚♡)

  • @vkolbert
    @vkolbert 4 года назад +1

    Очень вовремя, как раз надо. :)

  • @janaschelle8377
    @janaschelle8377 3 года назад

    Супер видео! Спасибо! Интересная подача :)

  • @alexsh2045
    @alexsh2045 4 года назад +1

    Респект, продолжай в том же духе) я лайкосы на видо не ставил уже сто лет, но тут он явно уместен))))))

  • @norfolkleb9851
    @norfolkleb9851 4 года назад +1

    Отличная история) Если бы не надо было смотреть на код, под это видео можно было бы хорошо засыпать)
    Вот есть такая проблема у этого жанра: нужно смотреть в код, понимать код, потом повторять код, совершенствовать код... Что это за?))) Но коты, конечно, поднимают настроение;
    Отличная работа, Аида!

  • @user-gr3gh7ml1w
    @user-gr3gh7ml1w 4 года назад

    Прикольная подача контента, со своей изюминкой

  • @alexanderberman9629
    @alexanderberman9629 2 года назад

    Умничка) Шел 2021 год, ни одного понятного гайда. Так то всё понятно, но вот нюансы... Везде копипаста или перевод какой то статьи.

  • @kawaikaino5277
    @kawaikaino5277 4 года назад +1

    Спасибо за видео )

  • @konstantinterletsky9271
    @konstantinterletsky9271 3 года назад

    Молодец!

  • @igor1473
    @igor1473 4 года назад +1

    Ты умничка, спасибо.

  • @d.koshkarev
    @d.koshkarev 2 года назад +1

    Знаю, что не занимаетесь больше wed и ушли в game) Но вдруг есть время и мои вопросы не столь сложные на тему PWA. Просто это лучшее видео, что я видел.
    Все по уроку сделал, однако. Google - не признает, что это PWA, т.к. не находит sw? а он есть. В то же время Yandex - без проблем признает.
    1. В чем может быть проблема? Полагаю на обновление кэш на стороне провайдера.
    2. Самая большая проблема. Если пользователь зашёл на сайт - выскакивает предложение установить. Все супер. Но, если пользователь однажды нажал отменить (невнимательно, не знал нужно ли ему это или нет и т.д.), то при повторном посещении сайта ему больше не предложат установку. Спасает только полная очистка истории, куков и т.д. в мобильном браузере. Как тут быть? Есть ли способ или чтобы сайт, сам очищал нужные куки, или чтобы PWA проверяло. Установлено оно или нет?

  • @arsenmanasuev4934
    @arsenmanasuev4934 2 года назад

    Жаль. а ведь иногда когда не гонятся за просмотрами выходят хорошие и полезные видео о конкретных вещах. спасибо. и жалко что забросили

  • @kant4967
    @kant4967 4 года назад

    Класс

  • @evkr5427
    @evkr5427 4 года назад

    Умничка, все по делу, все живо и интересно, однозначноооо лаааайк;) Так держать, не зря подписан!

  • @MorgunovVitaly
    @MorgunovVitaly 4 года назад

    Умничка! Спасибо большое за видео!
    Немного бесплатных советов:
    Скринкасты смотрятся отлично -им свет не нужен, а вот когда снимаешь себя свет нужен чуть ярче. И попробуй снимать крупным планом с более короткого расстояния тогда и микрофон камеры тоже будет более сфокусирован на твоем голосе и будет меньше реверба от комнаты или используй петличный микрофон.

    • @AidaDrogan
      @AidaDrogan  4 года назад +1

      Спасибо за дельные советы =)
      Со светом у меня всегда беда, но я не так часто снимаю видео, в основном скринкасты. А вот свой МК-220 ни на что не променяю. Служит мне верой и правдой со времён рок-н-ролльной юности. Кстати, он слева от меня, но не попал в кадр. А там, где начинается скринкаст, мы с ним уже пишемся под одеялом =D потому немного меньше реверба.
      Недавно попробовала петличку от Boya. Чуть не расплакалась от качества звука... Переозвучила видео и выкинула её в мусорку.

  • @oleksandrrudychenko9113
    @oleksandrrudychenko9113 2 года назад

    Hi, Aida. All of us, subscribers, miss you! Please come back to this channel. You used to make super useful videos. This is the most one.

  • @user-vq7od5by2y
    @user-vq7od5by2y 4 года назад

    Большое спасибо, вы прекрасная

  • @dyrkow
    @dyrkow 4 года назад +6

    Спасибо за видео) Организовывал кеширование приложения через serviceWorker ранее, чтобы можно было работать с ним offline (сохранял данные пользователя в indexDB, а при появлении соединения синхронизировался с сервером), даже не думал, что это можно назвать PWA. И все же, рас уж PWA это приложение, можно ли получить доступ к устройствам на порту компьютера, например к принтеру, хочу распечатать котят :)

    • @AidaDrogan
      @AidaDrogan  4 года назад

      Не пробовала общаться с принтером =) Надо покурить тему. Интересно.

    • @black-oil
      @black-oil 4 года назад

      @@AidaDrogan не получится, вебвью не даст возможности обращаться к нативному апи. Тут либо через NativeScript/ReactNative/Flutter делать.

  • @neocortexlab
    @neocortexlab 4 года назад +2

    "Магия ПиДаблЮЭй! Это самое настоящее прогрессивное приложение! Оно доступно оффлайн! ))) правда не везде работает".

  • @ianpaddington3187
    @ianpaddington3187 3 года назад

    спасибо за доступное объяснение. жаль, что забросили этот канал :(

  • @user-hp3kl7jp9z
    @user-hp3kl7jp9z 4 года назад +1

    Красотка! )

  • @igroman-toys
    @igroman-toys 4 года назад +2

    Блонди, посмотрел видео - спасибо все чудесно, но у меня возник вопрос: как автоматически менять версию кеша в СВ при изменении контента на сайте? Вариант руками не катит, так как интернет магазин и цены с наличием обновляются ежедневно.

  • @user-genderZi
    @user-genderZi 4 года назад

    Спасибо, очень классно! Котики, киски.

  • @krepkovmeste
    @krepkovmeste Год назад

    Подскажи пожалуйста, какой шрифт используешь в своём редакторе? Выглядит очень хорошо

  • @PhilippeRigovanov
    @PhilippeRigovanov 4 года назад

    *Сделал первое pwa приложение по вашему руководству, всё чётко - спасибо большое (и за исходники отдельное спасибо). Вопрос только возник: атрибут "sizes" в теге 'link rel="apple-touch-icon"' который вы добавили для иконок на огрызках, правда можно опустить безболезненно?*

    • @AidaDrogan
      @AidaDrogan  4 года назад

      Даже не знаю, я добавляла в тех PWA, что мне довелось делать (и, честно говоря, их было немного). C яблоками вечно куча проблем даже там, где их не ожидаешь 🙄

  • @NAZAR_BUK
    @NAZAR_BUK Год назад

    Мені сподобалося 🐱🐱🐱

  • @andrewkhar4615
    @andrewkhar4615 2 года назад

    джейсн . хехе - стетхем! =)

  • @Someoneisdoingsomething
    @Someoneisdoingsomething 4 года назад

    Спасибо большое!)

  • @user-io2kp7jm6z
    @user-io2kp7jm6z 4 года назад

    Она так мило говорит слово "котик" :)

  • @zatochiSiberian
    @zatochiSiberian 4 года назад

    Здорово. Спасибо)

  • @arama9251
    @arama9251 4 года назад

    Очень познавательно

  • @DeanRie
    @DeanRie 4 года назад +2

    Только зашёл в туалет, дай думаю гляну, и тут на тебе)

  • @dzmitrykubarski1462
    @dzmitrykubarski1462 4 года назад

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

  • @JhnBravo84
    @JhnBravo84 4 года назад

    Умничка моя! Подписался ;-*

  • @_slash_-
    @_slash_- 4 года назад

    Круто !!!

  • @lastoflost
    @lastoflost 4 года назад

    Супер

  • @user-qb1uh3tg6h
    @user-qb1uh3tg6h 2 года назад

    Здравствуйте, подскажите каким вы локальным сервером пользуетесь ?

  • @gridgum
    @gridgum 3 года назад

    добрый день, где можно скачать файлы которые вы показывали в видео?

  • @Kovelart
    @Kovelart 4 года назад +1

    Есть один вопрос, к Вам да и в общий чат. У меня CRMка SPA и я получаю список клиентов /clients get запросом из API. Service Worker закэшировал его. Далее я добавил нового клиента с помощью post. Но когда я снова перехожу во вкладку /clients то список клиентов старый. Как сказать SW чтобы он обновил кэш. SPA сделан на react. Пришлось отключить SW, так как он мешает работе.

  • @The_Mavrik
    @The_Mavrik 4 года назад

    Ура, вебка =)))

  • @krepkovmeste
    @krepkovmeste Год назад

    Можно ли из PWA сделать GPS трекер? Чтобы координаты в фоне отправлялись с некой периодичностью

  • @antigravity007
    @antigravity007 4 года назад

    Да хранит Google всех котиков в мире! Блонди у меня вопрос?) Не поможешь ? Как можно по клику без задержки вызвать окно с установкой "добавить на главный экран"?

  • @arama9251
    @arama9251 4 года назад

    годно годно годно

  • @alekseizimin3808
    @alekseizimin3808 3 года назад

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

    • @alekseizimin3808
      @alekseizimin3808 3 года назад

      Да и сразу вопрос - как накодить, чтобы при просмотре сайта такого в браузере на экране всплывало окно с предложением м установить приложение (этом сайт) на главный экран смартфона ? Это очень интересно, буду крайне благодарен, если поможете!

  • @clickabelno
    @clickabelno 4 года назад

    Лайк

  • @user-tt4mg2jq2b
    @user-tt4mg2jq2b 3 года назад

    0:22 как раз оттуда смотрю xD

  • @levelup8963
    @levelup8963 3 года назад

    Невозможно смотреть тебя !

    • @user-mm3sd3uh6y
      @user-mm3sd3uh6y 3 года назад

      ты не смотри а просто слушай)

    • @levelup8963
      @levelup8963 3 года назад

      @@user-mm3sd3uh6y так и слушать тоже самое,по этому видео было выключено на первых же секундах!

  • @Gavriliuk
    @Gavriliuk 4 года назад

    Аида, я так понимаю, что кеш обновляется при смене версии только у тех, кто поставил себе галочку "Update on reload"
    Получается, что у незнакомых мне пользователей приложения кеш обновляться не будет - ведь никто не скажет им включить эту галочку?

    • @AidaDrogan
      @AidaDrogan  4 года назад

      Можно дать пользователю сообщение о новой версии приложения иdeanhume.com/displaying-a-new-version-available-progressive-web-app/

  • @DAROM-TK
    @DAROM-TK 3 года назад

    Сделал все как в примере, все работает. Решил отключить вайфай, бац , из кеш стордж все куда то пропадает.
    То есть, когламгалочку оффлайн ставлю, все работает, кеш на месте. Реально отключаюсь от интернета, и кеша нет.
    Что делать, куда копать?

  • @neocortexlab
    @neocortexlab 4 года назад

    Судя по данным, которые я наблюдаю во время работ с крупными трафикожёрами, сейчас более 80% трафика генерируется смартфонами.

  • @Jake-vorobei
    @Jake-vorobei 4 года назад +1

    Я как раз и смотрел в толчке😂

  • @ITentrepreneur
    @ITentrepreneur 2 года назад

    Второй канал на английском ссылка есть?!

  • @egoros7
    @egoros7 4 года назад

    Сложна! Но все равно, спасибо за видос!

    • @alpha-666
      @alpha-666 3 года назад

      стоит денег скажу больше, просто такие как автор ради просмотров держат людей за дураков ставя имитацию pwa на лединг

  • @strongest8359
    @strongest8359 4 года назад +1

    Как это не смотрим в туалетах? Когда все дома, фапаю на тебя в туалете)

    • @noname-vh6vm
      @noname-vh6vm 4 года назад

      Это мужик.

    • @strongest8359
      @strongest8359 4 года назад

      @@noname-vh6vm Aaeeeeeeeeeeee 8=====( )

    • @strongest8359
      @strongest8359 4 года назад

      @@noname-vh6vm Инфа 100% ??? ))))

  • @kawaikaino5277
    @kawaikaino5277 4 года назад +1

    Зашел в толчек)) смотрю новое видео.... лол

  • @trioniklsr8504
    @trioniklsr8504 4 года назад

    Няха

  • @Maksii668
    @Maksii668 4 года назад

    Здравствуйте, подскажите пожалуйста как сделать чтобы пва открывал не главную страницу сайта а другой сайт?

  • @kyrylopylypenko2349
    @kyrylopylypenko2349 4 года назад

    Очень информативное видео, все доступно, спасибо большое! У меня появилась одна проблема, когда проходит апдейт, я обновляю кеш, на дестопе он перезаписывается и все отлично, а вот на ios и android обновление не происходит, возможно есть решение какое то?

    • @AidaDrogan
      @AidaDrogan  4 года назад

      Можно попробовать оповестить пользователя о новой версии через Service Worker medium.com/progressive-web-apps/pwa-create-a-new-update-available-notification-using-service-workers-18be9168d717

    • @kyrylopylypenko2349
      @kyrylopylypenko2349 4 года назад

      Aida Drogan #BlondieCode спасибо большое!!! :-)

  • @Sto100i
    @Sto100i 2 года назад

    pwa работает только с 9 версией андроид и выше,это правда?

  • @ivankalashnikov6525
    @ivankalashnikov6525 3 года назад

    Будет ли продолжение по данной тематике ?

  • @STORIESPAY
    @STORIESPAY 2 года назад

    Не работает манифест ошибку выдаёт

  • @romanryaboshtan9270
    @romanryaboshtan9270 2 года назад

    Они используются, но не очень широко, не прижились. При такой скорости интернета как сейчас разница почти не заметна

  • @costaserga7724
    @costaserga7724 4 года назад

    Очень интересное и полезное видео. Но на iOS и Safari это не работает)

  • @Isten
    @Isten 4 года назад

    Годная инфа.

  • @WEBSTART-LIVE
    @WEBSTART-LIVE 3 года назад

    кто ищет вкладку audits - её больше нет. Она переехала в раздел lighthouse

  • @dedlive51
    @dedlive51 3 года назад

    Спасибо. А можно ли теперь из этого PWA сделать APK?

  • @vezunov
    @vezunov 4 года назад

    А сделать приложение в пару строк кода которое будет открывать ваш сайт уже сейчас и не ждать будущего, обмазаного жрущим ресурсы пользователя яваскриптом, это слишком просто чтоли?

  • @trioniklsr8504
    @trioniklsr8504 4 года назад

    Я Xamarin.Android осваиваю, получается что зря?

    • @AidaDrogan
      @AidaDrogan  4 года назад +1

      Каждый инструмент хорош для своих целей. Иногда имеет смысл не изобретать велосипед и просто сделать из сайта мобильное приложение PWA, а иногда нужно под каждую платформу нативное писать. Зависит от задачи.

  • @user-wg1mo1ud5b
    @user-wg1mo1ud5b 4 года назад

    А такое приложение можно в плэй маркет публиковать?

    • @AidaDrogan
      @AidaDrogan  4 года назад

      Нет. В этом и есть его фишка. Им можно просто поделиться по ссылке без магазина приложений.

  • @eridiant
    @eridiant 4 года назад

    а рожки офлайн доступны? это pwa рожки?)

    • @AidaDrogan
      @AidaDrogan  4 года назад +1

      Это SPA-рожки (Super Powerful Accessory) =D

  • @nikewhite4471
    @nikewhite4471 2 года назад

    Сколько проблем с этими котиками)