React Native — info – Telegram
React Native — info
1.29K subscribers
77 photos
26 videos
9 files
235 links
@react_native_info — канал с качественным контентом об RN.

Все самое интересное о ReactNative, React, JS, TS и мобильной разработке.

По всем вопросам обращатся — @igroza @bobcatus
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
Amazon IVS выпустили оффициальный пакет для react-native amazon-ivs-react-native-player, который является оптимизированным видео плеером для IVS сервиса.

Amazon Interactive Video Service (Amazon IVS) — это управляемая служба потоковой передачи видео в реальном времени.

Основные возможности IVS:
Создание каналов для трансляции видео за считанные минуты;
Создание надежных интерактивных видео-интерфейсов со сверхнизкой задержкой;
Поддержка множества платформ;

На видео реализован пример работы amazon IVS в react-native.

@react_native_info
👍13🔥53👎1
Пользователь GitHub под ником Aashu-Dubey сделал красивый и анимированный UI KIT для react-native.

В репозитории есть GIF с примером работы, помимио этого автор подготовил live примеры, на Expo (web не поддерживается) и собрал APK для андроид.

Исходный код пожно посмотреть на гит

@react_native_info
👍7🔥32🏆2
This media is not supported in your browser
VIEW IN TELEGRAM
Ребята из Software Mansion готовят возможность отладки Reanimated во Flipper для движка Hermes.
Уже доступна эксперементальная версия с этой фичей в версии Reanimated 3.0.0-rc.3.

Документация была доступна по этой ссылке но по какой-то причине ее удалили, но есть кешированная версия страницы, так что кому интерестно можете глянуть тут.

P.S. в комментах приложил небольшой отчет о том на каких платформах и в какой среде работает отладка.


@react_native_info
🔥9👍21🤯1
This media is not supported in your browser
VIEW IN TELEGRAM
Navio - это легковесная библиотека-обертка над React Navigation, которая позволяет легко создавать структуру навигации в одном месте и использовать преимущества typenoscript в приложении. Подсказки для названий экранов при создании структуры приложения и в использовании методов навигации (например, push, jumpTo) приводит к лучшему UX, меньшему количеству ошибок и более быстрому процессу разработки. И да, больше не нужно возиться с <NavigationContainer>, <Tabs.Navigator> и <Stack.Screen>!

Пример работы можно посмотреть в Expo Snack.

@react_native_info
👍6🔥2🤔2🤨1
Please open Telegram to view this post
VIEW IN TELEGRAM
😁14🔥8🤣3👍1
This media is not supported in your browser
VIEW IN TELEGRAM
Есть такой термин Navigation Transition, вот отличный концепт того как это должно выглядеть.

@react_native_info
👍74🔥41
This media is not supported in your browser
VIEW IN TELEGRAM
Библиотека ReactNative live text позволяет сканировать текст или QR с изображения в приложении на iOS устройствах, используя нативные возможности платформы а также имея очень простой API. Но с одной оговоркой, работает только на iOS16.

P.S. Пример кода в коментах.

@react_native_info
👍72🔥2
This media is not supported in your browser
VIEW IN TELEGRAM
Полное руководство по правильному использованию анимаций для лучшего UX – Автор статьи объясняет как нужно делать анимации чтобы добиться лучшего UX. Для наглядности в статье очень много GIF примеров, рекомендую всем к прочтению данную статью.

UPD: в коментах @trin4ik оставил ссылку на подобную статью для новичков.

@react_native_info
🔥135👍4
This media is not supported in your browser
VIEW IN TELEGRAM
iOS 2022: Telegram объявляет о проведении первого тура конкурса

Разработчикам предлагается создать приложение для редактирования мультимедиа на Swift, похожее на встроенный инструмент рисования в iOS. Призовой фонд составляет $50,000.

Демонстрационное приложение должно быть совместимо с iOS 13+. Также использование сторонних реализаций или UI-фреймворков строго запрещено.

Срок подачи: до 31 октября. Полный список требований по ссылке:

https://contest.com/docs/iOS-Oct22-Round1

P.S. Ну что, пилим один экран на react-native + skia и затягиваем им в прилож?

@react_native_info
🌚7🔥4🏆1
Основные правила код-ревью

Автор статьи предлагает ознакомиться с лучшими практиками код-ревью, что нужно и что нельзя делать разработчику при обзоре кода.

@react_native_info
👍93🔥3💩1
This media is not supported in your browser
VIEW IN TELEGRAM
Пользователь GitHub под ником 4TWIGGERS сделал анимацию глубины карточки с помощью reanimated2 и хука useAnimatedSensor.
Выглядит очень эффектно.

Исходный код можно посмотреть на гит

@react_native_info
🔥226🤯5👍2
This media is not supported in your browser
VIEW IN TELEGRAM
Пользователь Twitter (запрещен в РФ) barany6m, показал интерестный пример multi-drag-and-drop анимации, выполненой с помощью reanimated2 и react-native-gesture-handler. Пример был собран на expo.

К сожалению автор не выложил код в открытый доступ. Самое время поразмыслить как добиться такого же эффекта.

@react_native_info
🔥17🤔3🤨3
Какие вопросы вы бы задали разработчикам из Apple?

В октябре Apple организовывает «Ask Apple» — чат в Slack в формате Q&A с экспертами из компании, где разработчики могут задать интересующие их вопросы или просто пообщаться. Основные темы:

Developer Tools,
Graphics & Games,
ML & Vision,
SwiftUI & UI Frameworks и другие.

Также можно оставить заявку на индивидуальную 25-минутную консультацию.

Подробнее по ссылке тык

@react_native_info
👍2🔥2🤔1
This media is not supported in your browser
VIEW IN TELEGRAM
Вы знали что если в репозитории GitHub сменить .com на .dev или нажать на клавиатуре точку, то откроется веб версия VSCode с этим проектом.

@react_native_info #reactnative
🔥20🤯84🌚3
Hello, a question for the English-speaking audience: do you want the posts to be translated into English?

@react_native_info
Anonymous Poll
35%
Yes
23%
No
41%
See results
React Native — info pinned «Hello, a question for the English-speaking audience: do you want the posts to be translated into English?

@react_native_info
»
Очень удобная фишка в Xcode 14, теперь можно смотреть оставшееся время загрузки архива и скорость. Этого очень не хватало.

🇺🇸 English translation in comments.

@react_native_info
🔥12👍2🎉1
This media is not supported in your browser
VIEW IN TELEGRAM
Если вы хотите сделать библиотеку для React Native, но нет желания настраивать каркас проекта с нуля, то create-react-native-library поможет вам, его основные преимущества:

Простые примеры модулей для Android и iOS, на которые вы можете опираться;
Kotlin настроен для сборки модуля на Android;
Поддержка C++ для нативных модулей на Android и iOS;
Поддержка Expo для библиотек без нативного кода и поддержка web;
Пример приложения React Native для отладки вашей библиотеки;
ESLint, Prettier, TypeScript, Lefthook и Release It предварительно настроены;
Предварительно настроенный react-native-builder-bob для компиляции ваших файлов;
Предварительно настроенный CircleCI для запуска CI тестов;

🇺🇸 English translation in comments.

@react_native_info #reactnative
👍7🔥41
This media is not supported in your browser
VIEW IN TELEGRAM
Пользователь Twitter (запрещен в РФ) wa2goose сделал интерестную анимацию перелистывания карточек.
Анимация сделана с помощью reanimated2 и react-native-gesture-handler.
Есть обучающие видео, можно посмотреть тут.

Исходный код проекта можно найти на GitHub

🇺🇸 English translation in comments.

@react_native_info #reactnative
👍14🔥71