Мобільні застосунки

Створюйте мобільні веб-застосунки в Proyecta. PWA вже доступні; нативні обгортки для iOS/Android — через PWA Builder.

Proyecta будує веб-застосунки. Найшвидший шлях до «застосунку на телефоні» — це адаптивний веб-застосунок, який за бажанням можна покращити до Progressive Web App (PWA), щоб користувачі могли додати його на головний екран і (на підтримуваних платформах) отримувати push-сповіщення, офлайн-підтримку та повноекранний досвід.

Для нативного розповсюдження через App Store, Google Play або Microsoft Store ти обгортаєш опублікований PWA за допомогою інструменту на кшталт PWA Builder.

Що ти отримуєш з коробки

• Перемикач viewport у builder — переключайся між Desktop / Tablet / Mobile previews під час редагування
• AI-підказки з орієнтацією на мобільний — AI вміє будувати адаптивні макети на твоє прохання
• Вкладка Mobile на dashboard — окрема панель Mobile з кроками Appearance, Test і Publish для перетворення застосунку на встановлюваний мобільний застосунок
• Push-сповіщення — дивись Push-сповіщення
• Мобільний UI builder — Proyecta сам працює на телефонах, тож ти можеш будувати де завгодно

Вкладка Mobile

Відкрий dashboard і перейди на вкладку Mobile, щоб побачити покроковий процес із трьох кроків:

• Appearance — перегляди іконку застосунку, назву та колір теми. Якщо мобільну підтримку ще не налаштовано, натисни Set up mobile support, і Proyecta зробить усе за один крок — без жодного промпту.
• Test — відскануй QR-код, щоб відкрити опублікований застосунок на реальному телефоні (дивись Тестування на мобільному).
• Publish to App Store — покрокова інструкція з пакування та подачі в магазини застосунків (дивись Публікація в App Stores).

Шаблон веб-застосунку вже постачається з web app manifest (site.webmanifest) і service worker (sw.js), тому основа для встановлюваного, офлайн-здатного PWA готова з першого build — вкладка Mobile і AI просто налаштовують її під твій застосунок.

Шлях через PWA

Найшвидший варіант — кнопка Set up mobile support у вкладці Mobile. Якщо хочеш бути більш конкретним, можеш також звернутися до AI напряму:

Add PWA support to my app:
- Web app manifest with name, icons, theme color
- Service worker with offline cache for the app shell
- Service worker with update toast on new version

В обох випадках manifest і service worker будуть налаштовані. Після публікації користувачі зможуть:

• Відкрити твій застосунок у будь-якому мобільному браузері
• Натиснути меню браузера і вибрати Add to Home Screen (iOS) або Install app (Android)
• Запускати його як нативний застосунок з головного екрану

PWA на iOS 16.4+ також підтримують Web Push, тож сповіщення працюють — дивись Push-сповіщення для налаштування.

Глибше: нативні обгортки

Якщо потрібно випустити застосунок в App Store або Google Play, рекомендований шлях — обгорнути опублікований PWA:

1. Опублікуй на своєму субдомені *.proyecta.live (або власному домені)
2. Відкрий pwabuilder.com і введи свою URL
3. Згенеруй нативні пакети — Android (AAB), iOS (Xcode project), Windows (MSIX)
4. Подай до відповідного магазину

Дивись Публікація в App Stores для деталей.

Важливі обмеження

• Apple може відхилити чисті WebView-застосунки, які не додають нативної функціональності. Врахуй це перед тим, як цілитися в App Store.
• Push-сповіщення на iOS вимагають, щоб користувач спочатку встановив PWA із Safari (а не з обгортки).
• Камера, GPS, контакти — усе працює через веб-API; нативні API (HealthKit, ARKit) недоступні з PWA-обгортки.

Незабаром

• Нативні шаблони React Native / Expo для проєктів, яким потрібні справжні нативні оболонки
• Інтеграція з Capacitor як альтернативний шлях обгортання
• Майстер публікації в магазини застосунків прямо в builder (іконки, splash-екрани, текст для сторінки в магазині)
• Управління метаданими для магазинів застосунків, синхронізоване з builder