ReactNative и что-то остальное – Telegram
ReactNative и что-то остальное
160 subscribers
80 photos
6 videos
2 files
104 links
если тебе не больно, значит ты что-то делаешь не правильно

что-то о React Native и в целом о разработке

буду рад подпискам и донатам
https://boosty.to/mbhusty
https://www.patreon.com/mbhusty

Лс: @mbhusty
Download Telegram
ReactNative и что-то остальное
React Native developer be like 🔥
Кстати, если что на скрине приложение Minisim.

Удобно использовать для переключения симуляторов устройств + доп фишки есть.

Подробности тут
https://www.minisim.app
3
Всем привет! Принес вам #пятничный_мем

Ближайшие пару недель я пропаду, так что не теряйте ☺️

Всем хороших выходных!
🔥6
Всем привет 🖖

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

Буквально недавно наткнулся на канал, у которого сэйм вайб с моим. Даже путь в разработке, очень похож на мой.

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

Помимо этого на канале есть крутая рубрика, где Денис проводит ресерч разных интересных вопросов.

Мне кажется важно расширять кругозор в нашей профессии.

Залетайте и к нему.
Всем удачи 🍀
👍4🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
когда сделал очередной todo лист и показываешь его всем ☺️

ps/ отчитываюсь за пятницу
😁51
Если кому интересно, залетайте на стажировку! 👇
Ищем на стажировку ребят и девчат с хорошим знанием React Native и JavaScript. Пишите в личку @maria_IT
2
Ну что, пора возвращаться к делам и сейчас самая сложная задача - вспомнить все.

По приложению решил отложить историю с доработкой Live Activity, пока не найду подходящую апиху с данными.

Сейчас планирую заняться всякими фантиками, вроде сплэш скрина, онбординга и тд. Подрубить реанимэйтед и начать наводить красоту)

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

Всем хороших выходных 🖖
3👍3
Ребят, сорян, но пока ничего кроме работы не вывожу(

Напишите плиз в комменты, о чем написать или что разобрать, постараюсь в выходные добраться.

🍀
3🌚2
Всем привет 🖖

Начинаю раскачиваться и пора бы возвращаться к всевозможным ковыряниям)

Чуть позже закину голосование, пост по выбранной теме будет в вс-пн.
🔥2
This media is not supported in your browser
VIEW IN TELEGRAM
Всех с пятницей и хороших выходных 👾

#пятничный_мем
3🤣2👍1
Ребят, привет!

При подготовке выбранной вами темы (Reanimated) понял, что наверное сначала будет пост с общей вводной частью про эту либу, а потом еще несколько постов с примерами того, что можно сделать

Так что не скучайте, скоро запушу.

И всем хорошей недели 🍀
6
React Native Reanimated

Изначально эта библиотека была написана коммьюнити RN, но сейчас ее в основном поддерживают инженеры из Software mansion.

Это мощная библиотека, с помощью которой можно легко создавать плавные анимации и взаимодействия с элементами. Мы же хотим сделать наше приложение красивым и плавным, верно?

Основным отличием Reanimated от, например Animated API который идет с RN из коробки, это то, что в нем все анимации вынесены из основного JS-потока в отдельный поток, который связан с UI-потоком синхронно.

Получается, главный поток не мешает работе анимаций, а анимации не мешают исполняться бизнес-логике — win win! Так что, если нам нужно реализовать какую-то сложную анимацию, с большим количеством нод, то лучше использовать Reanimated, в других случаях, скорее всего подойдет и Animated из коробки.

Ну что, погнали ставить!

Если создаем новый проект на Expo, то достаточно выполнить:

npx create-expo-app my-app -e with-reanimated //expo

yarn create expo-app my-app -e with-reanimated //yarn


Если у нас уже есть проект и нужно подключить Reanimated, действуем так:

npx expo install react-native-reanimated // for expo
npm install react-native-reanimated //npm
yarn add react-native-reanimated //yarn


Обязательно в babel.config.js проекта нужно подключить плагин react-native-reanimated/plugin

module.exports = {
presets: [
// ... // don't add it here 🙂
],
plugins: [
// ...
'react-native-reanimated/plugin',
],
};


И тут важно не забыть, что react-native-reanimated/plugin должен быть указан последним!
Это необходимо сделать, чтобы плагин Reanimated babel автоматически преобразовывал специальные JavaScript-функции (worklet’ы) таким образом, чтобы они могли быть переданы и запущены в потоке UI.

Затем чистим кэш

npx expo start -c // expo
npm start -- --reset-cache //npm
yarn start --reset-cache //yarn


После всех этих действий, для работы на Android больше ничего не требуется, а для iOS нужно переустановить поды

cd ios && pod install && cd ..


На этом пока все, пошел готовить примеры.
Для удобства постараюсь все выложить с ссылками на snack, что бы вы сами смогли посмотреть и поковырять)
🔥6
Начинаем утро с нового релиза React Native версии 0.74 🎉

Важное из обновления:

Yoga версии 3.0: Улучшена предсказуемость поведения стилей и совместимость с веб-компонентами. Например, добавили поддержку align-content: 'space-evenly'

Bridgeless архитектура по умолчанию: Тут про скорость и производительность

Batched обновления `onLayout`: Обновления состояния в обратных вызовах onLayout теперь объединяются, что снижает количество перерисовок. Раньше, каждый вызов onLayout приводил к ререндеру.

Yarn 3 теперь является менеджером пакетов по умолчанию для новых проектов

Так же, с 0.74, минимальная версия Android SDK — 23 (Android 6.0). Раньше это был Android 5.0 (API 21)

Подробности тут
🔥3
Ребята, налетаем!
Forwarded from React Native — info
🎉 Software Mansion представляет React Native IDE — уникальное решение для улучшения разработки на React Native.

🔗 Integrated Experience: Предварительный просмотр вашего приложения непосредственно в вашем проекте Visual Studio Code, включая поддержку iOS Simulator и Android emulator.

🕵️‍♂️ Click to Inspect: Переходите напрямую к файлам компонентов с помощью встроенного инспектора.

🛠️ Breakpoints in VSCode: Добавляйте точки останова в Visual Studio Code для отладки вашего приложения без дополнительных настроек.

🧩 Component Development in Isolation: Предварительный просмотр и разработка компонентов индивидуально.

🌗 Device Settings Adjustment: Настройте размер текста и светлую/темную тему прямо из IDE.

🔍 Convenient Log Search: Фильтрация и поиск по логам с автоматическими ссылками на исходный код.

Подробнее ознакомиться с функциями и возможностями можно на сайте проекта: React Native IDE.

@react_native_info
😁2👍1🔥1
Всем хорошего завершения этой длинной рабочей недели 🤳

#пятничный_мем

⚡️ReactNative и что-то остальное
🔥6😁2
Пацаны не спят, пацаны сейчас будут новый инструмент тестить 👀

⚡️ReactNative и что-то остальное
🔥8👀2
ReactNative и что-то остальное
Пацаны не спят, пацаны сейчас будут новый инструмент тестить 👀 ⚡️ReactNative и что-то остальное
Привет! Из-за длинных выходных не успел добраться до примеров с реанимэйтед, после выходных обязательно подобью)

Пока только успел настроить и поковырять RNIDE. 
Могу сказать, что продукт для разработки классный и судя по гитхабу, комьюнити активно участвует в развитии.

Понятно, что еще далеко до полноценного релиза, много непонятных багов с настройками и работой, слабая производительность.

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

⚡️ReactNative и что-то остальное
5🙏1