Скачать или смотреть Как добавить push-уведомления в приложение Next.js с помощью Firebase Cloud Messaging! (Руководст...

Бесплатный исходный код на GitHub: 👉 https://www.papareact.com/fcm-code

🚨 Присоединяйтесь к ЛУЧШЕМУ в мире курсу и сообществу разработчиков «Zero to Full Stack Hero» ПРЯМО СЕЙЧАС: https://www.papareact.com/course

🔴 ИЩЕТЕ КОД ИЗ ДРУГИХ МОИХ СБОРОК? 🛠️
https://links.papareact.com/github

Присоединяйтесь ко мне, и я покажу, как добавлять и тестировать push-уведомления на iOS, Android и в веб-браузерах, таких как Google Chrome и Safari, с помощью Firebase Cloud Messaging. В этом видео вы узнаете следующее:

👉 Как реализовать push-уведомления в любом приложении Next.js с помощью Firebase Cloud Messaging (эта конфигурация также позволяет отправлять уведомления на устройства iOS и Android)
👉 Что такое Firebase Cloud Messaging и его преимущества
👉 Как работают состояния приложения для уведомлений, таких как уведомления переднего плана (когда вкладка открыта) и фоновые уведомления (когда вкладка/окно закрыто или не в фокусе)
👉 Что такое Service Workers и как их реализовать и отладить
👉 Как объяснить лучшие практики Firebase Cloud Messaging
👉 Как добавить всплывающее уведомление с помощью ShadCn для обработки уведомлений переднего плана

📩 ХОТИТЕ ПОСЛУШАТЬ ЭКСКЛЮЗИВНЫЙ ПЛЕЙЛИСТ PAPAFAM? Подпишитесь на рассылку PAPAFAM здесь 👉 https://links.papareact.com/newsletter

👇🏻СЛЕДИТЕ ЗА МНОЙ ЗДЕСЬ:
Instagram: https://links.papareact.com/instagram
Facebook: https://links.papareact.com/facebook
LinkedIn: https://links.papareact.com/linkedin
Twitter: https://links.papareact.com/twitter
Discord: https://links.papareact.com/discord

💰 ХОТИТЕ ПОДДЕРЖАТЬ КАНАЛ?
Пожертвовать можно здесь: https://links.papareact.com/donate
Приобретите мерч PAPAFAM: https://links.papareact.com/merch

🕐 ТАЙМ-КОДЫ:
00:00 Введение
00:34 Push-уведомления в Firebase Cloud Messaging
01:16 Зачем нужен Firebase Cloud Messaging
01:39 Объяснение Firebase Cloud Messaging (1/2)
02:38 Типы сообщений Firebase Cloud Messaging
03:20 Объяснение Firebase Cloud Messaging (2/2)
03:42 Инициализация сборки
04:32 Настройка проекта Firebase
09:59 Демонстрация Firebase Cloud Messaging
11:04 Настройка кампании по рассылке сообщений
14:56 Объяснение состояний приложения для уведомлений
16:11 Что такое Service Worker?
16:40 Как проверить и отладить Service Worker
18:21 Назначение Service Worker в веб-разработке
20:02 Принцип работы фоновых сообщений
21:44 Принцип работы Service Worker
25:42 Реализация всплывающего уведомления для активного состояния
32:17 Функциональность пользовательского хука useFcmToken
50:17 Демонстрация push-уведомлений для активного и фонового состояния приложения
53:08 Как и почему токены сохраняются в базе данных
55:13 Рекомендации по использованию Firebase Cloud Messaging
56:12 Краткое содержание
57:06 Присоединяйтесь к моему курсу Zero to Full Stack Hero, чтобы узнать больше
57:55 Заключение

Давайте разберёмся, PAPAFAM 🔥.

#nextjs #push-уведомления #firebase #ios #android #google #tailwindcss #typescript #тестирование #reactjs #javascript #nextjs15 #firebasecloudmessaging #fcm