The post has been translated automatically. Original language: Russian
When I started making my Mindes app, a cross—platform task manager, I was faced with the classic choice of every indie developer: write three times or write once.
Native development would mean three codebases: Swift for iOS, Kotlin for Android, and something separate for the web. For a solo developer or a small team, this is simply unrealistic — you spend time synchronizing three versions instead of sawing through features.
I chose React+ Capacitor. And that's why, in my opinion, this stack is underestimated in our community.
What is a Capacitor and how does it differ from the old approach?
Many who have heard about hybrid development recall Cordova/PhoneGap. The Capacitor is a reinterpretation of the same idea from the Ionic team, but made in the 2020s.
The bottom line is simple: your React application is just a regular web project. The Capacitor wraps it in a native container (WKWebView on iOS, WebView on Android) and provides a bridge to the native API — camera, file system, push notifications, geolocation. The same build that runs in the browser runs as a full-fledged app in the App Store and Google Play.
The key difference from Cordova is that it treats native projects as first—class. The ios/ and android/ folders are real Xcode and Android Studio projects that you commit to the repository and can edit with your hands when needed.
How it looks in practice
My work cycle:
- I write and test in the browser. 95% of the development goes like a regular React project - hot reboot, DevTools, the whole familiar ecosystem. I see the result instantly.
- npx cap sync — and the web build is copied to native projects.
- I open it in Xcode / Android Studio and build it for the device.
To synchronize data between devices, I connected Firebase — the user opens Mindes on the phone, then on the laptop in the browser, and sees the same tasks. Capacitor + Firebase provides a great advantage here in the speed of deployment on different platforms and account synchronization between them.
The pitfalls
- Heavy graphics and animations. If you're making a game or application with intense 60fps animation, WebView may not be able to pull it off. This will be enough for business logic, forms, lists, dashboards.
- Native plugins. Most of what you need is already available in the official plugins and community, but if you need something very specific, you'll have to write the native bridge yourself.
Why is this relevant?
In modern realities, the speed of product launch is crucial. React + The Capacitor allows one person to hold a product on three platforms at once without breaking apart. Plus, it allows you to send projects faster, speeding up all stages of development.
My application is currently running on the web, Android and iOS with the same code and under my full control, and this stack seems to me the most logical development for developing applications for different platforms.
Когда я начинал делать своё приложение Mindes — кросс-платформенный таск-менеджер — передо мной встал классический выбор каждого инди-разработчика: писать три раза или писать один раз.
Нативная разработка означала бы три кодовые базы: Swift для iOS, Kotlin для Android и что-то отдельное для веба. Для соло-разработчика или маленькой команды это просто нереально — ты тратишь время на синхронизацию трёх версий вместо того, чтобы пилить фичи.
Я выбрал React + Capacitor. И вот почему этот стек, на мой взгляд, недооценён в нашем коммьюнити.
Что такое Capacitor и чем он отличается от старого подхода
Многие, кто слышал про гибридную разработку, вспоминают Cordova/PhoneGap. Capacitor — это переосмысление той же идеи от команды Ionic, но сделанное в 2020-х.
Суть простая: твоё React-приложение — это обычный веб-проект. Capacitor оборачивает его в нативный контейнер (WKWebView на iOS, WebView на Android) и даёт мост к нативным API — камере, файловой системе, пушам, геолокации. Тот же билд, который работает в браузере, запускается как полноценное приложение в App Store и Google Play.
Ключевое отличие от Cordova — Capacitor относится к нативным проектам как к первоклассным. Папки ios/ и android/ — это настоящие Xcode и Android Studio проекты, которые ты коммитишь в репозиторий и можешь править руками когда нужно.
Как это выглядит на практике
Мой рабочий цикл:
- Пишу и тестирую в браузере. 95% разработки идёт как обычный React-проект — горячая перезагрузка, DevTools, вся привычная экосистема. Я вижу результат мгновенно.
- npx cap sync — и веб-билд копируется в нативные проекты.
- Открываю в Xcode / Android Studio и собираю под устройство.
Для синхронизации данных между устройствами я подключил Firebase — пользователь открывает Mindes на телефоне, потом на ноуте в браузере, и видит те же задачи. Capacitor + Firebase даёт здесь большое преимущество в скорости развертывания на разных платформах и синхронизации аккаунта между ними.
Подводные камни
- Тяжёлая графика и анимации. Если вы делаете игру или приложение с интенсивной анимацией 60fps — WebView может не вытянуть. Для бизнес-логики, форм, списков, дашбордов этого будет достаточно.
- Нативные плагины. Большинство нужного уже есть в официальных плагинах и комьюнити, но если понадобится что-то совсем специфичное — придётся написать нативный мост самому.
Почему это актуально
В современных реалиях скорость вывода продукта на рынок решает. React + Capacitor позволяет одному человеку держать продукт сразу на трёх платформах, не разрываясь. Плюс позволяет быстрее отдавать проекты, ускоряя все этапы разработки.
Моё приложение сейчас живёт на web, Android и iOS при одном коде и под моим полным контролем и этот стек кажется мне наиболее логичным развитием разработки приложений для разных платформ.
