В одной из прошлых статей я рассказывал, как мучился с Google Таблицами и чатами в Telegram, пытаясь упорядочить свои 10+ банковских карт. Но решение пришло не оттуда, откуда я ждал. Оно родилось из моей лени и любопытства.
Я уже давно использую нейросети (ChatGPT, DeepSeek, Gemini) для работы: написать черновик письма, сделать краткий обзор длинного отчета, придумать идею для подарка. Но однажды произошел случай, который изменил всё.
«Нарисуй мне график» — «Не могу, но могу накодить»
Как-то раз мне нужно было визуализировать данные по отчету. Я попросил свою любимую текстовую нейросеть построить график.
В ответ она извинилась:
«Я языковая модель, я не умею генерировать картинки. Но я могу написать для тебя HTML-код с использованием библиотеки Chart.js. Просто сохрани его и открой в браузере».
Я удивился, но попробовал. Скопировал код, сохранил как index.html, кликнул два раза...
И в браузере открылся идеальный, интерактивный график. При наведении мышки всплывали цифры, он был красивым и живым.
В этот момент в моей голове что-то щелкнуло.
Я понял: мне не нужно просить ИИ описывать интерфейс словами. Я могу просить его создавать интерфейс кодом, который я сразу могу "потрогать".
Эпоха прототипов: Как я стал «HTML-архитектором»
Я начал эксплуатировать эту фишку по полной. Когда я возился с AppSheet (конструктором приложений от Google), мне не хватало визуализации. Я не понимал, как лучше расположить кнопки.
Я приходил к ИИ и писал:
«Представь, что ты дизайнер. Сделай мне макет экрана, где сверху будет список карт, а снизу — большая красная кнопка. Пришли HTML-код».
Через 10 секунд у меня был готовый макет.
— «Нет, кнопку сделай зеленой и перенеси наверх», — писал я.
— «Готово», — отвечал ИИ и присылал новый код.
Я открывал эти файлы в браузере на телефоне и чувствовал себя настоящим продакт-менеджером. Я видел наглядный результат, мог нажимать на кнопки (пусть они пока никуда и не вели).
Тогда родилась мысль: «А зачем мне вообще посредники в виде AppSheet или Excel? Если ИИ может написать HTML-страницу, которая выглядит как приложение, может, на этом и остановиться?»
Проблема веб-странички
Я сделал простую HTML-версию своего справочника карт. Она работала в браузере. Но быстро вскрылись минусы:
- Это не приложение. Это сайт. Нет иконки на рабочем столе (ну, почти), адресная строка мешает.
- Нет доступа к железу. Сайт не может нормально работать с геолокацией в фоне, не может присылать пуш-уведомления, когда экран выключен.
- Проблемы с хранением и синхронизацией данных: Данные живут только в браузере. Если очистить кэш — они пропадут.
Мне нужно было настоящее, «взрослое» приложение, .apk файл, который можно установить на Android.
React Native: Выбор, сделанный нейросетью
Я задал ИИ прямой вопрос:
«У меня есть прототип на HTML/JS. Как мне превратить его в настоящее мобильное приложение для смартфона?»
ИИ, как опытный сеньор-разработчик, выкатил варианты:
- Flutter - высокая производительность.
- React Native - оптимальный выбор, так как бизнес-логика на JavaScript из прототипа переносится практически без изменений
Выбор был очевиден.
«Инструкция для чайников»: Среда разработки
Я понимал, что просто скопировать HTML в React Native не получится. Нужно было подготовить почву.
Я написал промпт, который сэкономил мне недели гугления:
«Я новичок. У меня Windows. Напиши пошаговую инструкцию, что именно мне скачать и установить, чтобы запустить первый проект на React Native. Объясняй как для ребенка».
ИИ выдал чек-лист::
- Node.js - «двигатель» для работы JavaScript вне браузера.
- VS Code - удобный редактор кода.
- Android Studio - нужен, чтобы эмулировать телефон на компьютере и собирать итоговый файл приложения.
Два вечера я боролся с установкой, переменными сред и ошибками Java. Нейросеть терпеливо объясняла каждую ошибку консоли.
И вот настал момент истины. Я ввел команду npx react-native run-android.
На экране виртуального телефона появилась надпись: "Welcome to React Native".
Это была победа. У меня была пустая оболочка, готовая принять логику моего финансового помощника. Оставалось только «перевести» мои HTML-черновики на язык React Native. Но об этом — в следующей серии.
А вы пробовали просить ИИ писать код? Или используете его только для текстов? Расскажите о своем опыте в комментариях!