На что способен React Native? Vol 2.0

Когда-то давно, когда о кроссплатформенных языках ходили легенды, а про React Native и вовсе никто не слышал, наш техлид предложил писать приложения на нем. И оказался прав. Это язык от создателей Facebook, на котором сделаны Instagram, Skype, UberEats, Airnbnb, Tesla, Pinterest и еще десятки других.
Но мы знаем, что одних громких имен тебе мало. И хочется в других кейсах поковыряться, посмотреть что и как реализовано.
Знаем, потому что прошлая наша статья вызвала шквал бурных эмоций. Поэтому подготовили новую.
Встречайте команду разработчиков в лице Ильи и Жени, а также их лида Машу. Далее рассказывать будут они.

Пивточка

Это приложение с программой лояльности для сети пивных магазинов, которая насчитывает больше 140 точек продажи в Санкт-Петербурге. Они обрабатывают до 20000 заказов ежедневно, а в приложении насчитывается порядка 80 000 активных юзеров.

Мари
mobile
Что интересного
можно найти в приложении?
Анимация онбординга
Каталог
Здесь, есть фильтры. В карточке товара можно оставить свой приватный отзыв. Еще указаны магазины, где товар в наличии. Их выводим списком или на карте.
Обращения в поддержку
Возникли проблемы? Можно для каждой создать отдельный чат, чтобы разобраться и не забыть о каких-то недовольствах.
Викторина
У нас возникла ситуация в которой мошенники перебирали номера, чтобы воспользоваться чужой картой и списать с нее бесплатные литры или баллы. Способ обезопасить себя оказался очень простым – викторина. Обратите внимание, выбранный вариант будет закреплен вверху, пока вы не подтвердите его.

Мир24

Женя
mobile
Новостное приложение для «Межгосударственной телерадиокомпании «Мир».
В нем освещаются события государств-участников СНГ.

Фишки приложения,

над которыми работал Женя

1
Лента новостей с возможностью добавлять в избранное интересные темы, фильтровать по стране/разделу
2
Викторины во время прямых эфиров
3
Поиск новостей по запросу
4
Радио и хит-парады по странам
5
Программа передач на ТВ
6
Прямые эфиры телеканалов МИР и МИР24
7
Новости в формате Stories
Радио
Его можно свернуть и слушать на фоне, перемещаясь по приложению.
Интерактивная программа передач
Ее можно смотреть прямо на экране эфира канала.
Хит-парад на радио
Здесь можно не просто слушать треки, но и смотреть клипы участников.

John Dory

Приложение с программой лояльности для сети премиум-магазинов рыбы и морепродуктов. Оно получило рейтинг 4.7 в App Store, долгое время занимало вторую строчку в категории Еда и Напитки. Ежемесячный прирост новых пользователей +8000.

Мари
mobile

Если коротко,

то в приложении есть

1
программа лояльности (здесь отображается процент скидки, кол-во накопленных баллов, которые можно списать в магазине по QR при оплате)
2
витрина товаров, которая в дальнейшем превратится в полноценный каталог
3
раздел с акционными предложениями
4
чат, в котором можно узнавать о наличии товара, оставить отзыв о покупке
5
карта магазинов, где отображается расстояние до всех точек и можно проложить маршрут и открыть его в навигаторе
6
возможность добавить карту лояльности в apple wallet (так, чтобы на заблокированном экране можно было видеть пуш, когда оказываешься вблизи магазина)
7
объединение пользователей в семейную группу, чтобы копить и тратить баллы совместно.
Подробнее читайте в нашем кейсе. А теперь посмотрим, какие прикольные фишки, запилила лид мобайлов – Мари.
Скролл с обновлением на главном экране
Исчезающее уведомление
Кластеризация на картах

YogaApp

Это приложение для студентов и преподавателей йоги, а также недавно сертифицированных тренеров, чтобы помочь изучать позы детальнее. Здесь есть функционал, который позволяет проверять свои знания с помощью flash cards sets или экзаменов.
Помимо техники выполнения асан, пользователи могут прочитать название на санскрите с помощью транскрипций или услышать аудиоозвучку.

Мари
mobile
Приложение есть только в App Store пока, но уже завоевало
высокий рейтинг – 4.7

Вот, какие фишки

были сделаны Машей и Ильей

Добавление поз в стек,
всплывающие уведомления
Фильтры
Можете искать позы по названиям на английском и санскрите. Фильтровать их по целевым (основным) группам мышц и категориям.
Залипающий заголовок и выбор сортировки на экране стека
Горизонтальная навигация с запросами на бэк и кешированием в библиотеке поз
Экзамен/проверка ответов
Проверить свои знания поз можно в заданном стеке с помощью рандомного набора вопросов в разных форматах. На главном экране экзамена устанавливаете количество вопросов, включаете или отключаете функцию “Проверять мои ответы по ходу” и погнали. Если в этом стеке уже проходили тест, результаты будут под кнопкой с отметкой времени и оценкой.
Тиндер
Он же – режим изучения флэш-карты: вам показывают одну сторону карты, а потом проверяют, знаете ли вы ее значение. Если считаете, что ответ на экране показан верно – свайп вправо, неверно – свайп влево.
Удаление стеков
Автоплей в флешкардах
Apple подписка
Можно получить премиум аккаунт через Apple подписку. Он дает полный доступ ко всему функционалу.
Пока мы готовили эту статью, у нас уже наметилась третья часть. Расскажем, как работали на React Native с криптой, сделали еще пару проектов из нашей любимой сферы – фудтеха и, возможно, развеем окончательно ваши сомнения по поводу крутости этого языка.
Читайте также