Від PWA до App Store: як випустити Flutter-додаток з builder77

Раніше, щоб додаток потрапив на чийсь телефон, треба було обрати платформу, опанувати її інструменти й дочекатися черги на перевірку — і лише потім хтось міг його спробувати. builder77 ділить цей шлях на два етапи: випусти PWA вже сьогодні, щоб ним користувалися реальні люди, і переходь на нативний Flutter, коли будеш готовий до App Store і Google Play.

Етап 1: PWA, яке користувачі можуть встановити просто зараз

Коли ти створюєш мобільний додаток у builder77, він від самого початку проєктується як додаток для телефона: розкладка на всю висоту екрана, нижня навігація вкладками, великі зони натискання й відступи безпечної зони для екранів із вирізом. Під час публікації він отримує маніфест вебзастосунку та service worker, завдяки чому його можна встановити.

• Натисни Опублікувати й відскануй QR-код телефоном.
• На iPhone натисни Поділитися → На початковий екран. На Android скористайся пропозицією встановлення або меню браузера.
• Додаток відкривається на весь екран зі своєю іконкою — як нативний.

Це найшвидший спосіб отримати зворотний зв’язок. Уже сьогодні можна надіслати посилання десятьом тестувальникам, подивитися, як вони користуються додатком, і далі вдосконалювати його в конструкторі: кожна публікація миттєво оновлює додаток для всіх, без перевірки в магазині.

Етап 2: перетворення на Flutter

Коли додаток у добрій формі, відкрий вкладку Flutter і виконай конвертацію. Це коштує 3 кредити на повідомлення. builder77 створює Flutter-проєкт — pubspec.yaml і lib/main.dart — з тими самими екранами, функціями й фірмовим стилем, що й у вебзастосунку, на Material 3.

Головне: Flutter-додаток працює з тією самою хмарною базою даних через REST API builder77, використовуючи ті самі назви колекцій і полів. Дані, створені в PWA, з’являються в нативному додатку й навпаки, а користувачі твого додатка можуть входити в будь-яку з версій.

// Generated at the top of lib/main.dart
const String kApiBase = 'https://builder77.com';
const String kProjectId = 'your-project-id';

// Example call made by the generated M77Client
// GET $kApiBase/api/runtime/$kProjectId/db/habits?sort=-createdAt

Спробуй до завантаження

Flutter-версію можна запустити, нічого не встановлюючи. На вкладці Flutter є два варіанти:

• DartPad — відкрий згенерований код у DartPad, щоб швидко на нього глянути.
• Хмарна збірка (тариф Plus і вище) — builder77 запускає справжній flutter build web на наших серверах і показує скомпільований додаток просто в конструкторі. Це найточніший попередній перегляд того, як працюватиме нативний додаток.

Якщо хмарна збірка повідомляє про помилку або щось виглядає не так, попроси виправлення в чаті й сконвертуй знову. Оскільки джерелом істини залишається вебзастосунок, зазвичай краще спершу довести до ладу вебверсію, а потім заново згенерувати Flutter-проєкт.

Завантаж і відкрий проєкт

На тарифі Starter і вище Flutter-проєкт можна завантажити. Далі — стандартний процес роботи з Flutter:

flutter create .          # adds the ios/ and android/ platform folders
flutter pub get
flutter run               # on a simulator or a connected device

Публікація в магазинах

Надсилання в магазини, як і раніше, відбувається в інструментах Apple і Google, під твоїми власними обліковими записами розробника. Загальний чек-лист виглядає так:

• Задай унікальний bundle ID / application ID і назву додатка.
• Додай іконки додатка й екран запуску для обох платформ.
• Налаштуй підпис: сертифікат розповсюдження та provisioning profile на iOS, upload keystore на Android.
• Збери релізні збірки за допомогою flutter build ipa і flutter build appbundle.
• Підготуй сторінки в магазинах: скриншоти, опис, відомості про конфіденційність і URL підтримки.
• Надішли додаток на перевірку в App Store Connect і Google Play Console.

Модератори магазинів уважно стежать за конфіденційністю. Якщо в додатку є вхід і він зберігає персональні дані, знадобиться URL політики конфіденційності — можна попросити builder77 додати сторінку конфіденційності у вебзастосунок і послатися на неї.

Не відмовляйся від PWA

Випуск нативної версії не означає, що вебверсію час списати. PWA й далі працює з тими самими даними, тож люди можуть користуватися твоїм додатком у браузері, на комп’ютері або ще до встановлення з магазину. Один продукт, два входи, один бекенд.

Наша порада: перевір ідею за допомогою PWA, конвертуй, коли користувачі попросять, і стався до версії в магазині як до відшліфованого видання того, що люди вже люблять.