Внезапно!
📟 Push-уведомления и нотификации в RN и работа с ними
Начнем с того, в чем же отличия одного от другого.Честно говоря, до погружения в эту тему, я был уверен, что это одно и тоже)
Итак. Ключевая разница пушей и нотификаций в том, что пуши отправляются на устройство пользователя с внешнего сервера, а нотификации генерятся самим приложением на устройстве (какое-либо событие, напоминание, обновление данных и тд)
Реализация push-уведомлений
Для реализации пушей, я нашел только 2 инструмента на текущий момент:
1. Firebase Cloud Messaging (FCM)
Наверное одно из самых популярных решений на текущий момент для работы с пушами.
Основные плюсы FCM:
Ставиться просто, в доке все необходимое описано
2. OneSignal
У сервиса есть несколько вариантов платной подписки, но в бесплатном пакете есть то что нам нужно - Unlimited Mobile Push Sends 🤪
Интеграция OneSignal в React Native осуществляется с помощью библиотеки react-native-onesignal.
Реализация нотификаций
Для работы с локальными нотификациями по сути есть только один инструмент - Notifee, т.к React Native Push Notification уже года 3 не обновлялся
В Notifee есть возможность создавать уведомления по событию и выполнять, когда срабатывают какие-то триггеры
Для своего приложения я как раз использую Notifee, потому что нет отдельного сервера для отправки пушей, а нужно локально на событие генерировать увед и отправлять его.
Пока не понял, почему на эмуляторе ок работает, а на устройстве нет. Буду разбираться дальше)
Есть хотите какой-то из этих инструментов разобрать подробнее, пишите в комменты, сделаю отдельный проектик, соберу и выложу на GH 🖖
⚡️ReactNative и что-то остальное
📟 Push-уведомления и нотификации в RN и работа с ними
Начнем с того, в чем же отличия одного от другого.
Итак. Ключевая разница пушей и нотификаций в том, что пуши отправляются на устройство пользователя с внешнего сервера, а нотификации генерятся самим приложением на устройстве (какое-либо событие, напоминание, обновление данных и тд)
Реализация push-уведомлений
Для реализации пушей, я нашел только 2 инструмента на текущий момент:
1. Firebase Cloud Messaging (FCM)
Наверное одно из самых популярных решений на текущий момент для работы с пушами.
Основные плюсы FCM:
Легкая интеграция с приложениями React Native.
Поддержка отправки сообщений с сервера через HTTP и XMPP протоколы.
Возможность сегментации пользователей для точечных уведомлений.
Ставиться просто, в доке все необходимое описано
npm install --save @react-native-firebase/app @react-native-firebase/messaging
2. OneSignal
У сервиса есть несколько вариантов платной подписки, но в бесплатном пакете есть то что нам нужно - Unlimited Mobile Push Sends 🤪
Я его еще не тестил, но вроде как там чуть лучше работает сегментирование, а еще есть поддержка Live Activities (Max 10,000 total push subscribers)
Интеграция OneSignal в React Native осуществляется с помощью библиотеки react-native-onesignal.
npm install react-native-onesignal
Реализация нотификаций
Для работы с локальными нотификациями по сути есть только один инструмент - Notifee, т.к React Native Push Notification уже года 3 не обновлялся
This repository is not actively maintained.
В Notifee есть возможность создавать уведомления по событию и выполнять, когда срабатывают какие-то триггеры
Для своего приложения я как раз использую Notifee, потому что нет отдельного сервера для отправки пушей, а нужно локально на событие генерировать увед и отправлять его.
Пока не понял, почему на эмуляторе ок работает, а на устройстве нет. Буду разбираться дальше)
Есть хотите какой-то из этих инструментов разобрать подробнее, пишите в комменты, сделаю отдельный проектик, соберу и выложу на GH 🖖
⚡️ReactNative и что-то остальное
React Native Firebase
React Native Firebase | React Native Firebase
Welcome to React Native Firebase! To get started, you must first setup a Firebase project and install the "app" module.
🔥13👍2 1
Дратути!
Отпуск закончился, уже работу работаю и надо бы чет полезное на канал принести, а пока что
#пятничный_мем
⚡️ReactNative и что-то остальное
Отпуск закончился, уже работу работаю и надо бы чет полезное на канал принести, а пока что
#пятничный_мем
⚡️ReactNative и что-то остальное
😁7👍1🔥1😱1
Время опроса⚡
Что будем ковырять дальше?
Что будем ковырять дальше?
Final Results
26%
Интеграция OneSignal для работы с нотификациями
54%
Настройка DeepLink в приложении
37%
Погружаемся в тестирование (JEST)
🔥1 1
Всем удачного завершения рабочей недели, идите пить пиво, я разрешил🍻
#пятничный_мем
⚡️ReactNative и что-то остальное
#пятничный_мем
⚡️ReactNative и что-то остальное
😁7❤1
ReactNative и что-то остальное
Время опроса⚡
Что будем ковырять дальше?
Что будем ковырять дальше?
Всем привет!
Случайно снес результаты голосования🌟
Большее количество голосов было за Deep Linking, так что разбор в процессе, постараюсь до конца недели выкатить с примерами и кодом на GH
Случайно снес результаты голосования
Большее количество голосов было за Deep Linking, так что разбор в процессе, постараюсь до конца недели выкатить с примерами и кодом на GH
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥2
ReactNative и что-то остальное
Всем привет! Случайно снес результаты голосования 🌟 Большее количество голосов было за Deep Linking, так что разбор в процессе, постараюсь до конца недели выкатить с примерами и кодом на GH
А нет, не снес, пруфы есть 💻
Please open Telegram to view this post
VIEW IN TELEGRAM
👀1
Будет два поста, один про работу с Deep Linking в рамках Expo (изи левел) и второй пост в настройкой в чистом проекте (нот изи левел)
Deep Linking — это инструмент, который позволяет юзеру переходить к определённому контенту внутри приложения напрямую, минуя остальные экраны. Мы каждый день встречаемся с этим механизмом в приложениях.
Например, когда нам пришел пуш с сообщением в телеге, при тапе на него мы попадем в сам чат, а не просто запустим приложение со списком.
Deep Linking в Expo
1. Тут по классике, сначала
npx create-expo-app@latest
если у вас уже есть проект, то идем к слудующему шагу
2. Открываем файл конфигурации app.json и добавляем в него
"scheme": "react-pain"
вместо "react-pain" можете указать все что угодно, но логичнее наверное название приложения или типа того, дальше будет видно где это используется.
А так как у нас проект на экспо использует expo-router, по сути нам кроме этого для старта больше ничего не нужно.
Но, если вы используете на текущем проекте React Navigation, то смотрим сюда, что еще необходимо сделать
Запускаем!
В нашем пустом проекте есть 2 страницы index и explore.
Для проверки работы нам достаточно будет использовать утилиту командной строки — uri-scheme
Переходим в консоль и вбиваем
npx uri-scheme open [your deep link] --[ios|android]
#для iOS при использовании клиента Expo
npx uri-scheme open "exp://127.0.0.1:19000/--/explore" --ios
#для собранного приложения на iOS
npx uri-scheme open "react-pain://explore" --ios
После выполнения команды, мы попадем на второй экран приложения!
Идем дальше. Добавляю для примера на страницу Explore список их 10 записей + отдельную страницу для отображения детальной информации (смотрите доку по expo-router). Возвращаемся в консоль:
npx uri-scheme open "react-pain://explore/7" --ios
После вызова команды, мы попадем в приложение на детальную страницу с ID 7. Profit!
Можете сами проверить и поковырять проект, выложил его на GitHub
Следующий пост будет про чистый проект + тестирование ссылок с использованием xcrun для iOS и adb для Android
Всем хорошего завершения рабочей недели
⚡️ReactNative и что-то остальное
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥6👍3❤2
Если бы в сутках было больше часов, точно бы залетел на курс)
🔥4💯1
Forwarded from Открытый React Native курс
Я в мобилизацию перестала продавать свой полный курс (с созвонами, подробными ответами на вопросы, обратной связью, дополнительными заданиями). Потому что казалось, что как-то это не в тему сейчас, все на ушах стоят
А недавно мне сказали: «в смысле? ты учила профессии, которой можно зарабатывать в любой точке мира, что и надо было уезжающим, и думала, что это не уместно?»
И я подумала - а действительно, чего это я прекратила, у меня же это лучше всего получается и мне это очень нравилось. Именно вот эти живые созвоны, на которых можно поотрабатывать навыки, позадавать вопросы
А самое кайфовое было когда ребята после курса делали совместный проект. И это мне кажется был самый полезный навык
Вообщем. Запускаю опять курс. Два месяца учебы с еженедельными созвонами, в поддерживающей обстановке, с ревью кода. Работу после двух месяцев не обещаю, но проекты уже делать будете
Третий месяц - совместный проект. Либо отдельный с ребятами с курса, либо на стажировке
Отдельно можно докупить индивидуальную поддержку при поиске работы (подготовка к собеседованиям, ревью резюме, ответы на вопросы по тестовым, варианты поиска первых заказов)
Два месяца учебы в такой группе: 60т
Поддержка при поиске работы после курса: 30т
Для записи пишите, что готовы, сюда - @maria_IT
Share, like и вопросы в комментариях приветствуются
А недавно мне сказали: «в смысле? ты учила профессии, которой можно зарабатывать в любой точке мира, что и надо было уезжающим, и думала, что это не уместно?»
И я подумала - а действительно, чего это я прекратила, у меня же это лучше всего получается и мне это очень нравилось. Именно вот эти живые созвоны, на которых можно поотрабатывать навыки, позадавать вопросы
А самое кайфовое было когда ребята после курса делали совместный проект. И это мне кажется был самый полезный навык
Вообщем. Запускаю опять курс. Два месяца учебы с еженедельными созвонами, в поддерживающей обстановке, с ревью кода. Работу после двух месяцев не обещаю, но проекты уже делать будете
Третий месяц - совместный проект. Либо отдельный с ребятами с курса, либо на стажировке
Отдельно можно докупить индивидуальную поддержку при поиске работы (подготовка к собеседованиям, ревью резюме, ответы на вопросы по тестовым, варианты поиска первых заказов)
Два месяца учебы в такой группе: 60т
Поддержка при поиске работы после курса: 30т
Для записи пишите, что готовы, сюда - @maria_IT
Share, like и вопросы в комментариях приветствуются
🔥6💩1
Привет падпищеки ✋
Сегодня выкатили RN версии 0.75
Ключевые изменения можно посмотреть тут
Ну и так же версия 0.75 доступнка с Expo SDK 51
⚡️ReactNative и что-то остальное
Сегодня выкатили RN версии 0.75
Ключевые изменения можно посмотреть тут
Ну и так же версия 0.75 доступнка с Expo SDK 51
⚡️ReactNative и что-то остальное
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥8
Голосуем подпищеки 💃
Что разбираем дальше?
Что разбираем дальше?
Final Results
37%
Вторая часть поста про Deep Linking
17%
Локализация приложения (на примере текущей аппки по F1)
66%
Turbo модули в новой архитектуре. Пробуем создать и подключить
ReactNative и что-то остальное
Голосуем подпищеки 💃
Что разбираем дальше?
Что разбираем дальше?
Ну что, кажется у нас лидируют турбо модули и вряд ли ситуация изменится 💻
В конце дня закрою голосование (есть еще шанс повлиять на результат) и пойду готовить тему
Не теряйте, всем удачной рабочей недели!
В конце дня закрою голосование (есть еще шанс повлиять на результат) и пойду готовить тему
Не теряйте, всем удачной рабочей недели!
Please open Telegram to view this post
VIEW IN TELEGRAM
👍5
Так, дорогие падпищеки, накидайте реакций под этим постом, что бы понять, ждете инфу по турбо модулями или нет 💞
Разбор в процессе, но все очень туго идет, честно говоря. Все не стабильно работает, дока и гайды не слишком помогают..
Разбор в процессе, но все очень туго идет, честно говоря. Все не стабильно работает, дока и гайды не слишком помогают..
Please open Telegram to view this post
VIEW IN TELEGRAM
👍19🔥6🤔2🗿2❤1👎1
Всем привет! 😮
История с турбо модулями в RN на данный момент следующая.
Я в целом разобрался, как создать, собрать и запустить.
Понятно какие у них преимущества над нативными модулями, но проблема в том, что для демонстрации работы нужна какая-то задача. А идей пока ноль. Не писать же калькулятор или типа того..
Так что вдруг у вас есть предложения или какая-то либа, которой нет на RN, но хотелось бы получить, велком ту комментс👇
Ну или могу просто рассказать про первоначальные шаги, если не нужно закапываться
История с турбо модулями в RN на данный момент следующая.
Я в целом разобрался, как создать, собрать и запустить.
Понятно какие у них преимущества над нативными модулями, но проблема в том, что для демонстрации работы нужна какая-то задача. А идей пока ноль. Не писать же калькулятор или типа того..
Так что вдруг у вас есть предложения или какая-то либа, которой нет на RN, но хотелось бы получить, велком ту комментс
Ну или могу просто рассказать про первоначальные шаги, если не нужно закапываться
Please open Telegram to view this post
VIEW IN TELEGRAM
🤔3👍1
давно тут мемов не было, исправляюсь 💀
всех с пятницей и хороших выходных!
#пятничный_мем
⚡️ReactNative и что-то остальное
всех с пятницей и хороших выходных!
#пятничный_мем
⚡️ReactNative и что-то остальное
Please open Telegram to view this post
VIEW IN TELEGRAM
😁7