Как перенести на TypeScript большую кодовую базу React UI-компонентов

Привет! Меня зовут Иван Греков, я работаю UI-разработчиком в frontend-команде Badoo. Главные задачи нашей команды — создание новых и поддержка существующих пользовательских интерфейсов для сайтов и приложений Badoo и Bumble. 

Когда в конце 2019 года мы начали параллельно работать над несколькими проектами, мы задумались над повышением стабильности кода и возможностью его многократного использования. Для этого мы решили переписать наши 630 React UI-компонентов на TypeScript. Я расскажу о том, как мы работали над ними без перерыва в доставке фич и как организовали поэтапный переход на TypeScript для UI-разработчиков, которым этот язык был в новинку.

Эта статья является заключительной в серии о применении архитектурного шаблона MVI в Kotlin Multiplatform. В предыдущих двух частях (часть 1 и часть 2) мы вспомнили, что такое MVI, создали общий модуль Kittens для загрузки изображений котиков и интегрировали его в iOS- и Android-приложения.

В этой части мы покроем модуль Kittens модульными и интеграционными тестами. Мы узнаем о текущих ограничениях тестирования в Kotlin Multiplatform, разберёмся, как их преодолеть и даже заставить работать в наших интересах.

Обновлённый пример проекта доступен на нашем GitHub.

Меня зовут Данил Мухаметзянов, я работаю бэкенд-разработчиком в Badoo уже семь лет. За это время я успел создать и изменить большое количество кода. Настолько большое, что в один прекрасный день ко мне подошёл руководитель и сказал: «Квота закончилась. Чтобы что-то добавить, нужно что-то удалить».

Ладно, это всего лишь шутка — он такого не говорил. А жаль! В Badoo за всё время существования компании накопилось больше 5,5 млн строк логического бизнес-кода без учёта пустых строк и закрывающих скобок.

Само количество не так страшно: он лежит, есть не просит. Но два-три года назад я начал замечать, что всё чаще читаю и пытаюсь разобраться в коде, который на самом деле не работает в продакшен-окружении. То есть, по сути, мёртв.

Эту тенденцию заметил не только я. В Badoo поняли: наши высокооплачиваемые инженеры постоянно тратят время на мёртвый код.

В Gradle — системе автоматической сборки — подход с buildSrc уже успел стать стандартом для реализации собственных плагинов и задач, а также создания общих конфигураций, например списков зависимостей и версий. Но у него есть существенный недостаток: при изменении buildSrc кеш сборки становится недействительным.

При этом Gradle предоставляет альтернативный подход — композитные сборки, лишённые этого недостатка. В этой статье я расскажу, как использовать композитную сборку вместо buildSrc и с какими сложностями можно столкнуться при миграции.

C адаптацией приложений и сайтов под RTL-языки (right-to-left, справа налево) сталкиваются разработчики многих развивающихся и выходящих на новые рынки продуктов. Мы в Badoo тоже в какой-то момент оказались в этой ситуации: наши приложения переведены на 52 языка и диалекта. В этой статье я расскажу о нескольких интересных нюансах, которые мы обнаружили при адаптации форм на сайте Badoo.сом под иврит и арабский язык.

Предлагаем продолжить добрую традицию Ask me anything на Хабре и поговорить про разработку Android-приложений. Сегодня и завтра Android-команда Badoo будет на связи и ответит на любые вопросы о разработке и тестировании приложений с многомиллионной аудиторией, даст советы начинающим и расскажет про особенности платформы. Если вы столкнулись с какой-то проблемой или у вас есть вопрос по теме, пишите нам!



Обещаем ответить на все комментарии первого уровня, которые появятся здесь до 16:00 17 июля по московскому времени, а по возможности — и на более поздние.

Немного фактов о нас. Badoo и Bumble — одни из самых популярных дейтинг-сервисов в мире: только в Google Play у нас 210 млн скачиваний. В Android-приложениях больше 1,3 млн строк кода. В Android-команде больше 20 разработчиков. Основной язык разработки — Kotlin, архитектурные паттерны — MVI и RIBs, база данных — SQLite.

Под катом — подробнее о нашей команде и о темах, на которые мы можем поговорить.

UPD: Мы завершаем AMA и прощаемся. Спасибо всем за вопросы!

Это вторая из трёх статей о применении архитектурного шаблона MVI в Kotlin Multiplatform. В первой статье мы вспомнили, что такое MVI, и применили его для написания общего для iOS и Android кода. Мы ввели простые абстракции, такие как Store и View, а также некоторые вспомогательные классы и использовали их для создания общего модуля.

Задача этого модуля — загружать ссылки на изображения из Сети и связывать бизнес-логику с пользовательским интерфейсом, представленным в виде Kotlin-интерфейса, который должен быть реализован нативно на каждой платформе. Именно этим мы и займёмся в этой статье.

Мы будем реализовывать специфичные для платформы части общего модуля и интегрировать их в iOS- и Android-приложения. Как и прежде, я предполагаю, что читатель уже имеет базовые знания о Kotlin Multiplatform, поэтому не буду рассказывать о конфигурациях проектов и других вещах, не связанных с MVI в Kotlin Multiplatform.

Обновлённый пример проекта доступен на нашем GitHub.

Всем привет! Меня зовут Михаил Булгаков (нет, не родственник), я работаю релиз-инженером в Badoo. Пять лет назад я занялся автоматизацией релизов iOS-приложений, о чём подробно рассказывал в этой статье. А после взялся и за Android-приложения.

Сегодня я подведу некоторые итоги: расскажу, к чему мы пришли за это время. Long story short: любой причастный к процессу сотрудник может зарелизить хоть все наши приложения на обеих платформах в несколько кликов — без головной боли, больших затрат времени, регистрации и СМС. Так, наш отдел релиз-инженеров за 2019 год сэкономил около 830 часов.

За подробностями — добро пожаловать под кат!

Мы в Badoo постоянно мониторим свежие технологии и оцениваем, стоит ли использовать их в нашей системе. Одним из таких исследований и хотим поделиться с сообществом. Оно посвящено Loki — системе агрегирования логов.

Loki — это решение для хранения и просмотра логов, также этот стек предоставляет гибкую систему для их анализа и отправки данных в Prometheus. В мае вышло очередное обновление, которое активно продвигают создатели. Нас заинтересовало, что умеет Loki, какие возможности предоставляет и в какой степени может выступать в качестве альтернативы ELK — стека, который мы используем сейчас.

Онтико, благодаря поддержке Badoo, опубликовали видеозаписи всех докладов PHP Russia 2020 Online в открытый доступ.

Конференция прошла 13 мая, в ней приняло участие более 5 000 PHP-разработчиков. Каждый из семи докладов и трех включений со специалистами из компаний-партнёров одновременно смотрели сотни человек. К закрытию количество участников не снизилось, и в среднем каждый участник посмотрел хотя бы один доклад. Для нас как для программного комитета конференции это значит, что мы собрали правильную программу.

Причём, поскольку доклады были англоязычные, среди зрителей было достаточно много иностранных коллег. А с другой стороны у нас был синхронный перевод на русский, поэтому получить полезную информацию можно было с любым уровнем владения языком — английским (в знании PHP у участников PHP-конференции мы не сомневаемся).

И вот теперь эти доклады доступны всем желающим, так же как и на конференции с оригинальной дорожкой и с синхронным переводом от Skyeng. Бонусом, полученным от онлайн-формата, ко всем видео прилагается запись Q&A-сессии. Можно сказать, что впервые можно переслушать то, что обсуждали в кулуарах, или вообще узнать, о чем говорили, когда ты убежал на следующий доклад.

Привет! Меня зовут Александр Никишин, я занимаюсь разработкой iOS-приложений в компании Badoo. В статье я расскажу о том, как мы исследовали баг в UIKit, который Apple не хотела исправлять на протяжении полугода.



Всё началось в августе 2019 года с первых бета-версий iOS 13. Тогда мы впервые столкнулись с проблемой. В приложениях Badoo и Bumble мы постоянно работаем над улучшением интерфейсов и, например, стараемся максимально оптимизировать нудный и не любимый пользователями процесс регистрации. Системные предиктивные подсказки над клавиатурой — отличный способ сокращения количества кликов пользователя при вводе данных. Однако в новой версии iOS мы с удивлением обнаружили, что подсказки при вводе номера телефона пропали.

Я ловлю в далёком отголоске,
Что случится на моём веку.
(«Гамлет», Борис Пастернак)

Признаться, пишу на чистом C я не так уж и часто и за развитием языка уже давно не слежу. Но тут произошло два неожиданных события: С вернул себе звание популярнейшего языка программирования по версии TIOBE и случился анонс первой за долгие годы действительно интересной книги, посвящённой этому языку. Поэтому я провёл несколько вечеров за изучением материалов о C2x — следующей версии C.

Самыми, на мой взгляд, интересными нововведениями я и хочу поделиться с читателями Хабра.

Около года назад я заинтересовался новой технологией Kotlin Multiplatform. Она позволяет писать общий код и компилировать его под разные платформы, имея при этом доступ к их API. С тех пор я активно экспериментирую в этой области и продвигаю этот инструмент в нашей компании. Одним из результатов, например, является наша библиотека Reaktive — Reactive Extensions для Kotlin Multiplatform.

В приложениях Badoo и Bumble для разработки под Android мы используем архитектурный шаблон MVI (подробнее о нашей архитектуре читайте в статье Zsolt Kocsi: «Современная MVI-архитектура на базе Kotlin»). Работая над различными проектами, я стал большим поклонником этого подхода. Конечно, я не мог упустить возможность попробовать MVI и в Kotlin Multiplatform. Тем более случай был подходящий: нам нужно было написать примеры для библиотеки Reaktive. После этих моих экспериментов я был вдохновлён MVI ещё больше.

Я всегда обращаю внимание на то, как разработчики используют Kotlin Multiplatform и как они выстраивают архитектуру подобных проектов. По моим наблюдениям, среднестатистический разработчик Kotlin Multiplatform — это на самом деле Android-разработчик, который в своей работе использует шаблон MVVM просто потому, что так привык. Некоторые дополнительно применяют «чистую архитектуру». Однако, на мой взгляд, для Kotlin Multiplatform лучше всего подходит именно MVI, а «чистая архитектура» является ненужным усложнением.

Поэтому я решил написать эту серию из трёх статей на следующие темы:

1. Краткое описание шаблона MVI, постановка задачи и создание общего модуля с использованием Kotlin Multiplatform.
2. Интеграция общего модуля в iOS- и Android-приложения.
3. Модульное и интеграционное тестирование.

Ниже — первая статья серии. Она будет интересна всем, кто уже использует или только планирует использовать Kotlin Multiplatform.

Для видеозвонков в Badoo мы используем стандарт WebRTC и кодек H.264. Если верить документации, этот кодек должен без проблем работать на любых устройствах Android начиная с Android 5.0. Но на практике всё оказалось не совсем так. В этой статье я расскажу про особенности реализации аппаратного кодирования для кодека H.264 в WebRTC и о том, как заставить его работать на большем количестве устройств.

Неделю назад прошел Live! Badoo Localization Meetup. Для нас это первая встреча на такую тему, да еще и в онлайн-формате. Отдельные секции по локализации редко встречаются на конференциях, поэтому собрать вместе четырех спикеров и больше 100 заинтересованных слушателей было приятно и неожиданно.

Митап был задуман как руководство к действию: спикеры из Badoo, Яндекс.Директ, SmartCat и Alconost делились опытом и инструментами, которые подойдут проектам разного размера и на разных этапах развития.

После всех докладов мы еще 2 часа обсуждали и разбирали проблемы. А кто-то из гостей даже получил документ со схемой решения именно его вопроса.

В этой статье я собрал обзор выступлений и ссылки на материалы.

На единственной конференции по PHP в России должно было быть 22 доклада от разработчиков инструментов, которыми мы все пользуемся, и множество камерных событий. Больше половины наших спикеров должны были прилететь из разных стран, поэтому угроза переноса или отмены нависла над нами еще до официальных российских постановлений. А после всё пошло не так…

Но мы не отчаиваемся и планируем провести большую оффлайн-конференцию 14 сентября в Москве, а чтобы PHP-сообщество не скучало до осени, 13 мая пройдет онлайн-конференция PHP Russia Online и, благодаря поддержке компании Badoo, она стала бесплатной.



Мы решили поэкспериментировать с форматом: в программе конференции только зарубежные спикеры, а общение на конференции будет двуязычным (UPD: для всех докладов будет доступен поток с синхронным переводом на русский от Skyeng).

Для опытных разработчиков PHP Russia Online даст возможность услышать выступления и задать вопросы лидерам PHP-сообщества — всегда же лучше получать информацию из первых рук. А для тех, кто уже добился первых успехов в PHP-разработке, но еще не дорос до уровня middle, — заряд вдохновения и ориентиры, на что обращать внимание, куда развиваться.

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

Мы в Badoo не доверяем ощущениям, зато верим цифрам. Суммарно у наших сервисов больше 500 миллионов пользователей, и свой фреймворк для тестирования мы написали довольно давно. За шесть лет через него прошло 2962 теста, и A/B-тестирование доказало свою важность, надёжность и результативность.



Но в этой статье я расскажу не о том, как работает наша система. На это не хватит одной статьи. Кроме того, многие вещи специфичны для нашей компании и не подойдут другим. Сегодня я расскажу об эволюции наших представлений об A/B-тестах: на какие грабли мы наступали в процессе и как проверяли корректность работы тестов. Это статья для тех, кто ещё не начал тестировать, но думает об этом, а также для тех, кто не уверен в своей системе тестов.

На конференциях и в неформальных беседах на работе нет-нет да и возникает разговор о важности работы QA-инженера и его роли в проекте. Это может быть и робкий вопрос коллеги-программиста «А, может, выпустим без QA?», и объёмный доклад.

Проблема, как мне кажется, связана с тем, что эффективность труда сотрудников отдела QA обратно пропорциональна количеству «срочных, внезапно возникающих» сложных задач. Назовём это «парадоксом немецкого сантехника», который получает зарплату, когда у него нет вызовов: чем меньше протечек и аварий на его участке, тем качественнее и эффективнее его работа. Но чем меньше у него вызовов, тем больше кажется со стороны, что он ничего не делает.

Всем привет!

Я Алексей Тимин, отвечаю за техническую часть системы локализации в Badoo. У нас 150 000 фраз и текстов, переведённых на 52 языка для нескольких приложений. У каждого приложения свои особенности аудитории, определенный стиль общения с пользователем, версии для веба и мобильных платформ. 

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

Тема животрепещущая, так что мы предложили спикерам из Яндекса и Alconost поделиться своим опытом на первом Badoo Localization Meetup, который мы проведём в онлайн-формате. 

21 апреля в 19:30 по московскому времени приглашаем пообщаться разработчиков, тестировщиков и всех, кто выстраивает процессы локализации продукта. 

Мероприятие бесплатное, но регистрация обязательна. 

Недавно я наткнулся на статью о проблеме c Java-сериализацией объектов в Kotlin. Автор предложил решать её добавлением метода readResolve к каждому объекту, который наследуется от java.io.Serializable.

Этот способ выглядит абсолютно правильным, однако его поддержка может оказаться слишком проблематичной. С учетом того, что в нашем проекте эта проблема возникала только при использовании объектов внутри Bundle, мы решили использовать проверку через is для каждой ветки when-выражений в случае sealed классов.

Тем не менее, размышляя об этом, я никак не мог понять, почему Kotlin не генерирует readResolve в компиляторе, поддерживая singleton-свойства объектов. Мне казалось, что это работа для инструментов, а не для человека. Но раз Kotlin не добавляет эту функцию сам, мы можем ему помочь! Этим мы сейчас и займёмся.