Интервью FlutterFlow, сторонний конструктор визуальных приложений для фреймворка Flutter, теперь имеет настраиваемые функции для добавления кода Dart, но разработчики могут по-прежнему находить это слишком ограничивающим.
Конструкторы визуальных приложений с низким кодом не намного проще, чем FlutterFlow, браузерная среда для создания мобильных приложений с Flutter.
Не нужно ничего устанавливать: пользователи запускают новый проект в браузере и создают пользовательский интерфейс путем перетаскивания, используя обнадеживающие короткие значки и компоненты, начиная от простых списков и кнопок до AudioPlayer, WebView, VideoPlayer или GoogleMap. Элементы макета определяют расположение компонентов, включая контейнеры, строки, столбцы, сетки, вкладки и карточки.
Чтобы оживить пользовательский интерфейс, нужно выбрать компонент и установить его свойства, включая такие параметры макета, как цвета, шрифты и отступы; такие действия, как навигация или вызовы API, соединения с запросами к базе данных и анимация, чтобы добавить немного шика.
Элементы управления могут быть привязаны к данным для отображения результатов запроса, включая аутентификацию пользователя для управления доступом к данным. Режим предварительного просмотра примерно показывает, как приложение будет работать во время выполнения, хотя в настоящее время без данных в реальном времени, без аутентификации или вызовов API. В режиме Run выполняется полная компиляция, но подготовка занимает несколько минут.

FlutterFlow создает мобильные приложения для Android и iOS
Основным вариантом для подключения к данным является Google Firestore, часть его платформы Firebase, хотя возможность выполнять вызовы API, REST GET или POST для любой конечной точки означает, что код сервера может вызывать другие источники по выбору разработчика, но за пределами Среда FlutterFlow.
После завершения проект можно запустить в браузере и развернуть в iOS App Store или загрузить как APK для Android. Также можно загрузить код, сгенерированный FlutterFlow, и импортировать его в другую среду для завершения, хотя это односторонний процесс и нет средств для импорта измененного кода обратно в среду FlutterFlow.
FlutterFlow был запущен в мае, но в этом месяце появилась важная новая функция: пользовательские функции. Это позволяет разработчикам добавлять в проект код Dart (язык, используемый Flutter), определяя функции, которые могут принимать аргументы, полученные из данных, привязанных к элементу управления.
Цены бесплатны для тестирования с предварительным просмотром в браузере; 30 долларов в месяц за дополнительную возможность загрузки кода и APK-файлов; и 70 долларов в месяц на добавление пользовательских API, интеграцию с GitHub, которая обновляет репозиторий при изменении кода, развертывание iOS и управление контентом Firebase. Одна кодовая база поддерживает как iOS, так и Android.
Если FlutterFlow кажется похожим на Google, то это не только потому, что Flutter – это проект Google, но и потому, что соучредителями FlutterFlow являются бывшие инженеры Google, Абель Менгисту и Алекс Гривз, хотя и не из команды Flutter.
«Мы ушли, чтобы основать компанию, мы собирались создать механизм рекомендаций ИИ для совершенно другого пространства», – говорит Менгисту. Рег. «Мы почувствовали, что сделали сложную часть, и затем мы попытались создать приложение прямо перед ней». Именно тогда они исследовали Flutter и пришли к выводу, что, хотя он и превосходен, ему не хватало простого в использовании визуального дизайнера.
«Получив дизайн от нашего дизайнера, мы потратили много времени, просто пытаясь усовершенствовать код, чтобы он соответствовал дизайну», – говорит Менгисту. «Код не казался самым быстрым способом сделать это. Это было первоначальной мотивацией».
Они начали разговаривать с потенциальными пользователями и обнаружили, что у многих из них есть общие требования к потокам, такие как вход в систему или другие общие шаблоны. «Это одна и та же логика, реализуемая снова и снова. Поэтому мы подумали, что иметь сквозной опыт для этих общих потоков должно быть легко. Попытка поднять уровень абстракции выше, чем такие концепции программирования, как условные выражения и функции, поток, который вы можно перетаскивать и добавлять в свое приложение “.
Хотя абстракция общих шаблонов хороша, ничто не может заменить мощь пользовательского кода. До введения пользовательских функций в этом месяце основная идея добавления кода заключалась в репозитории GitHub, который FlutterFlow постоянно обновляет с помощью генерируемого кода. «Он идет в отдельную ветку, чтобы не конфликтовать с другим кодом». Они могут объединить его, и если вы добавили какой-то код, например, для нажатия кнопки, git merge справится с этим нормально », – говорит Менгисту.
Среда FlutterFlow предназначена исключительно для разработки приложений, а не для размещения специальных сервисов. «Мы не занимаемся хостингом, потому что думаем, что Firebase действительно хорошо с этим справляется», – говорит нам Менгисту. В будущем есть планы по интеграции с другими сервисами, но «сейчас мы сосредоточены на том, чтобы максимально эффективно использовать эти ранние наборы функций».
Как FlutterFlow может конкурировать с другими предложениями с низким кодом от облачных гигантов, такими как Microsoft Power Platform, Google AppSheet или Amazon Honeycode? «Я думаю, что они больше сосредоточены на корпоративном пространстве», – говорит Менгисту. «Многие из получаемых нами пользователей не являются пользователями этих платформ. Существующие инструменты для них не работали».
Какую же нишу заполняет FlutterFlow? «Ежегодно сотни тысяч приложений разрабатываются и отправляются в магазины приложений. Power Apps, например, с Microsoft очень нацелены на внутренние организационные подразделения. Мы видели много пользователей, которые хотят создавать приложения намного быстрее».
Какие приложения создают пользователи FlutterFlow? «Такие вещи, как образовательные приложения, у нас также была компания, которая работала над сайтами вакцинации COVID. Для некоммерческих организаций мы предоставляем бесплатный доступ. Мы также видели, как люди создают приложения для сообщества. Создание приложений очень дорогое, средняя стоимость – я считаю, что это 100 000 долл. Так что, если вы хотите приложение для местного сообщества, его разработка слишком дорога, но мы можем значительно снизить стоимость или повысить производительность », – говорит Менгисту.
Важной особенностью, как Microsoft обнаружила несколько десятилетий назад с Visual Basic, будет возможность для третьих сторон создавать компоненты, которые другие могут включать в приложения. Это запланировано для FlutterFlow? «Это определенно то, что мы хотим реализовать. Мне сложно предсказать, когда именно. Вы уже можете создавать компоненты внутри FlutterFlow, которые можно легко использовать повторно, но чтобы иметь что-то, что работает во всех приложениях, открывает множество возможностей».
Функции добавляются относительно быстро. С июня команда добавила аудиокомпонент, визуальные переходы, компонент PageView, аутентификацию телефона с помощью Firebase, Search и Google Maps, поддержку новых размеров устройств, управление командой разработчиков, платежи через PayPal, Google Pay и Apple Pay, условный виджет. видимость, контроль переполнения текста, пользовательские функции кода и проверка пользовательских функций кода.

Разработка пользовательской функции во FlutterFlow
В то же время дыры в платформе легко проделывать. Например, редактор кода для пользовательских функций груб, а связь с Firebase ограничивает. В контексте предприятия система выиграет от соединителей с ключевыми платформами, такими как системы CRM, а также с другими менеджерами баз данных. FlutterFlow, по сравнению с IDE, такой как Android Studio, Xcode, Visual Studio или Visual Studio Code, кажется ограниченным и ограниченным, а режим Run мучительно медленным. Односторонний экспорт кода является серьезным раздражением для тех, кто привык к инструментам, позволяющим разработчикам плавно переключаться между кодом и визуальной разработкой.
Теперь задача состоит в том, чтобы улучшить функциональность, не теряя при этом простоты использования, что является основным достоинством FlutterFlow. ®