🎯 О чём этот конспект: Пошаговое руководство по использованию платформы Roor AI (Roor.app) для генерации кроссплатформенных мобильных приложений с помощью текстовых промптов. В видео разбирается процесс создания AI-повара, который распознает ингредиенты по фото и предлагает рецепты.

👤 Кому будет полезно: Вайбкодерам, предпринимателям и non-technical специалистам, которым нужно быстро собрать MVP мобильного приложения с бэкендом, базой данных и публикацией в сторы.

✨ Что получите: Вы научитесь создавать полноценные приложения для iOS/Android, подключать внешние API (OpenAI), настраивать базу данных и тестировать результат на реальном смартфоне через Expo Go.

1. Генерация структуры и UI приложения

Контекст: Процесс начинается с описания идеи на естественном языке. Roor AI использует мощные LLM (Claude 3.5 Sonnet, GPT-4o) для написания кода на React Native/Expo. Платформа сразу создает файловую структуру (index.tsx, layout.tsx) и визуальный интерфейс, который можно редактировать в реальном времени.

Выгода: Экономия недель разработки. Вы получаете работающий прототип с навигацией и дизайном за 2-5 минут.

Как применить:

• Шаг 1: Формулировка промпта — [Roor.ai] — Введите описание приложения в центральное поле. Укажите основные функции и логику.
• Шаг 2: Выбор модели — [Roor.ai] — В выпадающем меню выберите модель (рекомендуется Claude 3.5 Sonnet для лучшего написания кода).
• Шаг 3: Запуск генерации — Нажмите "Send". AI начнет создавать файлы и отобразит Live Preview в правой части экрана.

Пример промпта для приложения из видео:

Build a mobile app that allows users to capture a photo of items in their fridge or upload an image of ingredients. The app should use AI to analyze the ingredients in the photo and then suggest recipes they can cook. Add a database to store these items so users can check them back anytime. Use a clean, modern UI with a "Fridge Chef" theme.

Результат: Готовый UI с кнопками загрузки фото, списком ингредиентов и карточками рецептов.

2. Отладка и подключение внешних API

Контекст: При генерации могут возникать ошибки (Syntax Error) или требоваться специфические интеграции (например, использование собственного ключа OpenAI для анализа фото). Roor позволяет исправлять ошибки одной кнопкой и настраивать переменные окружения.

Выгода: Не нужно искать баги в коде вручную. Использование своего API ключа дает контроль над расходами и лимитами AI-функций.

Как применить:

• Шаг 1: Исправление ошибок — [Roor.ai] — Если в превью появилась ошибка, нажмите кнопку "Details", а затем "Try to fix all". AI перепишет проблемный участок кода.
• Шаг 2: Настройка API ключа — [OpenAI Platform] — Скопируйте свой API Key и отправьте его в чат с AI в Roor с инструкцией.
• Шаг 3: Добавление Env Variables — [Roor Settings] — Перейдите во вкладку "Settings" или "Back-end" для управления секретными ключами.

Промпт для подключения ключа:

Please use my OpenAI API key for image analysis. Here is the key: [ВАШ_КЛЮЧ]. Update the image processing logic to use this key and the gpt-4o model for ingredient detection.

Результат: Стабильно работающее приложение, использующее актуальные AI-модели для бизнес-логики.

3. Тестирование на реальном устройстве через Expo Go

Контекст: Важнейший этап для мобильной разработки — проверка "в руках". Roor генерирует QR-код, который позволяет мгновенно запустить приложение на физическом iPhone или Android без сборки .apk или .ipa файлов.

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

Как применить:

• Шаг 1: Установка клиента — [App Store / Google Play] — Скачайте приложение "Expo Go".
• Шаг 2: Сканирование — [Roor Preview] — Наведите камеру смартфона на QR-код в веб-интерфейсе Roor.
• Шаг 3: Тестирование функций — Нажмите "Open in Expo Go". Проверьте доступ к камере (разрешите permissions) и загрузку данных.

Результат: Приложение работает на вашем смартфоне как нативное.

4. Настройка бэкенда и базы данных

Контекст: Чтобы данные (например, сохраненные рецепты) не пропадали после закрытия приложения, нужен бэкенд. В Roor это делается через вкладку "Integrations". AI сам устанавливает нужные зависимости и создает эндпоинты.

Выгода: Полноценная архитектура (Full-stack) без настройки серверов и написания SQL-запросов.

Как применить:

• Шаг 1: Активация бэкенда — [Integrations] — Нажмите "Enable" в разделе Back-end.
• Шаг 2: Обучение AI работе с БД — Попросите AI сохранять результаты сканирования в базу.
• Шаг 3: Проверка файлов — Перейдите в режим "Code", чтобы увидеть созданные серверные роуты и логику взаимодействия с БД.

Промпт для сохранения данных:

Every time the user scans a recipe, I want to store the results in the database so they can visit the 'My Recipes' section and view them anytime. Implement the logic to save and fetch these records.

Результат: Персистентное хранилище данных: рецепты сохраняются в профиле пользователя.

5. Публикация в App Store и Google Play

Контекст: Roor предоставляет инструменты для деплоя. Можно опубликовать веб-версию (PWA) или отправить приложение на проверку в официальные магазины.

Выгода: Упрощенный процесс сабмита (submission) без глубокого погружения в Xcode или Android Studio.

Как применить:

• Шаг 1: Кастомизация — [Project Settings] — Измените иконку приложения, название и Bundle ID.
• Шаг 2: Web-публикация — Нажмите "Publish" -> "Publish Web Version" для получения ссылки.
• Шаг 3: Сторы — Нажмите "Publish to App Store" или "Publish to Google Play". Следуйте пошаговой инструкции по подключению аккаунтов разработчика.

Результат: Ссылка на веб-приложение или запущенный процесс модерации в сторах.

FAQ

В: Нужно ли платить за Roor AI? О: Платформа имеет бесплатный уровень для старта, но для серьезных проектов, публикации в сторы и использования продвинутых моделей потребуется платная подписка. Также учитывайте расходы на API (например, OpenAI), если подключаете их отдельно.

В: Можно ли выгрузить код приложения? О: Да, в интерфейсе есть кнопка "Download Code". Вы получаете стандартный проект на React Native / Expo, который можно дорабатывать вручную в VS Code или Cursor.

В: Как добавить авторизацию пользователей? О: Просто напишите в чате: "Add user authentication using email and password". AI интегрирует необходимые компоненты и обновит схему базы данных.

В: Поддерживает ли Roor работу с камерой и GPS? О: Да, так как используется Expo, AI может легко прописать доступ к нативным функциям смартфона (камера, геолокация, уведомления). При первом запуске приложение само запросит нужные разрешения.

В: Можно ли синхронизировать код с GitHub? О: Да, во вкладке "Integrations" есть опция подключения GitHub. Это позволит сохранять историю изменений и работать над кодом совместно с другими разработчиками.

Конспект создан на основе видео «How To Build A Mobile App In Minutes Using AI (No Code)» канала GptUnveiled. Все права на оригинальный материал принадлежат авторам. Источник: https://www.youtube.com/watch?v=5JgsZCtIH_Q