​VibeOSMobile, експеримент із локальним AI-середовищем розробки на Android

💡 Усі статті, обговорення, новини про Front-end — в одному місці. Приєднуйтесь до Front-end спільноти!

Заради експерименту я вирішив перевірити чи можливо зібрати безпосередньо на звичайному Android-смартфоні повноцінне середовище для розробки та Vibe кодінгу, яке може працювати як в offline та і online режимах., хотілось отримати автономне локальне середовище, у якому можна пройти повний цикл:

• описати ідею застосунку;
• згенерувати код;
• запустити його й перевірити результат;
• ​автоматично знайти та виправити помилки;
• зберегти готовий компонент і повторно відкривати його як окрему утиліту.

​Так з’явився прототип, який я, умовно, назвав VibeOSMobile. Основою став Termux — середовище, яке дозволяє запускати на Android Python, Java, JavaScript, локальні сервери та інші інструменти.

​

Як це все влаштовано

Першим кроком був локальний Python backend, який запускається всередині Termux і надає API для роботи з кодом. Поверх нього браузерний інтерфейс на HTML, CSS і JavaScript. Chrome на Android фактично виконує роль оболонки для VibeOSMobile.

У результаті вийшов аналог Agentic інтерфейсу, де користувач описує, що потрібно створити, вибирає тип застосунку та запускає приблизно такий цикл:

detect → generate → run → validate → fix

Система визначає тип завдання, генерує код, запускає його відповідним способом, перевіряє результат і, за потреби, передає помилки назад моделі для виправлення. Також є можливість поправити і запустити код вручну.

У VibeOSMobile можна генерувати невеликі браузерні компоненти:

• калькулятори;
• форми;
• картки;
• інтерактивні кнопки;
• canvas-ігри;
• файлові переглядачі;
• прості утиліти.

Згенерований HTML одразу відкривається у preview через iframe, тому результат можна побачити без окремого процесу збірки або деплою.

JavaScript-код можна виконувати як частину HTML-віджета або через окремий JS runner.

Для Python scripts і Python web apps я реалізував два сценарії.

Перший — запуск звичайних Python-скриптів. Код передається локальному backend, зберігається у тимчасовий файл і запускається через Python, встановлений у Termux.

Другий — генерація Python web apps. У цьому випадку система створює застосунок, запускає локальний HTTP-сервер на телефоні та відкриває його у VibeOSMobile через локальну адресу. Тобто Python web app повністю працює на Android-пристрої: від виконання backend-коду до відображення інтерфейсу у браузері.

Запуск Java

Окремо додав Java runner. Java-код зберігається у файл, компілюється через javac, після чого запускається через java. Це дозволяє використовувати телефон для невеликих Java-експериментів, навчальних прикладів, прототипів або перевірки окремих фрагментів коду.

Збережені застосунки та віджети

Наступним кроком було перетворення згенерованого коду на щось, що можна використовувати повторно. Готовий компонент можна зберегти як окремий локальний застосунок із назвою та іконкою. Після цього він відображається у списку Saved Apps і відкривається не в агентному вікні, а в окремому App Viewer. Тобто AI потрібен для створення або редагування компонента, але не для кожного наступного запуску. Якщо потрібно внести зміни, застосунок можна відкрити через функцію Edit in Agent, допрацювати та зберегти нову версію.

Робота з AI-моделями

VibeOSMobile підтримує два основні режими роботи з моделями. Перший — локальна модель через Ollama.

Я перебрав доволі немало «маленьких» можелей, зрештою зупинився на qwen2.5-coder:1.5b. Це невелика модель, яку можна запустити безпосередньо на Android-телефоні. Вона, на диво, непогано справляється з простими фрагментами коду, HTML-компонентами і не складними виправленнями.

Другий режим — робота через зовнішні API. Я додав підтримку Claude API та OpenAI API як альтернативних провайдерів для більш складніших задач

.

Отже, що «під капотом»

Технічно VibeOSMobile складається з таких частин:

1. Termux — середовище виконання на Android;
2. Python backend — локальний сервер та API;
3. HTML, CSS і JavaScript frontend — інтерфейс;
4. Chrome — браузерна оболонка;
5. Python runtime — запуск скриптів і web apps;
6. Java JDK — компіляція та запуск Java;
7. JavaScript runtime — виконання JS;
8. Ollama — запуск локальної LLM;
9. Qwen Coder — локальна генерація коду;
10. Claude та OpenAI API — зовнішні AI-провайдери;
11. localStorage — збереження конфігурації та маленьких застосунків;
12. iframe — preview HTML-компонентів;
13. локальні backend endpoints — генерація, запуск, валідація, виправлення та керування застосунками.

Трошки більше про VibeOSMobile описав на своїй LinkedIn сторінці.