Tutoriály

Středně pokročilý

25 minut

Co se naučíte

  • Požadavky na mobilní aplikace
  • Generování v React Native
  • Integrace nativních funkcí
  • Testování založené na Dockeru
  • Nasazení do obchodů s aplikacemi
  • Publikování v rámci Ekonomiky tvůrců

Vytvořte mobilní aplikaci

Vytvořte iOS a Android aplikace připravené pro produkci za 25 minut

Chcete oslovit uživatele na jejich telefonech? V tomto tutoriálu vytvoříte kompletní mobilní fitness aplikaci pro iOS a Android. Sledujte, jak Conductor plánuje a Virtuoso staví vaši React Native aplikaci v reálných Docker kontejnerech – se skutečnými sestaveními a testy.

Co vytvoříme

Aplikaci pro sledování fitness s: logováním tréninků, grafy pokroku, push notifikacemi, integrací health kit, offline podporou a sociálním sdílením – připravenou pro produkci v App Store a Google Play.

Předpoklady

  • Dokončený tutoriál Začínáme
  • Nxcode účet (Lite nebo Pro)
  • Nejsou vyžadovány žádné zkušenosti s mobilním vývojem

Mobilní vývoj s Nxcode

Nxcode generuje React Native aplikace, které běží nativně na iOS a Androidu. Zde je to, co ho odlišuje:

Skutečný nativní kód

Nejedná se o webový wrapper – jde o skutečný React Native, který se kompiluje do nativních binárních souborů pro iOS a Android.

Testování v Dockeru

Vaše aplikace se sestavuje a běží v Dockeru. Pokud se nezkompiluje, Virtuoso ji automaticky opraví.

Nativní funkce

Fotoaparát, notifikace, health kit, geolokace – vše funguje ihned po vybalení.

Jeden kódový základ

Jediný kód pro obě platformy s optimalizacemi pro konkrétní platformy tam, kde je to potřeba.

Popis vaší mobilní aplikace

Řekněte Conductoru, co chcete. Buďte konkrétní ohledně nativních funkcí:

Vytvoř aplikaci pro sledování fitness pro iOS a Android:

Klíčové funkce:
- Logování tréninků se cviky, sériemi, opakováními, váhami
- Sledování kardia s GPS pro venkovní běhy
- Grafy pokroku ukazující nárůst síly v čase
- Časovač odpočinku mezi sériemi s notifikacemi
- Historie tréninků a osobní rekordy

Integrace zdraví:
- Synchronizace s Apple Health / Google Fit
- Počítání kroků a denní aktivita
- Tepová frekvence během tréninku (pokud je k dispozici)

Sociální funkce:
- Sdílení shrnutí tréninků na sociální sítě
- Výzvy přátel a žebříčky
- Komunitní šablony tréninků

Offline podpora:
- Plná offline funkčnost
- Synchronizace po návratu online

Design:
- Výchozí tmavý režim
- Velká tlačítka vhodná pro dotyk
- Plynulé animace

Conductor plánuje vaši mobilní aplikaci

Pro mobilní aplikace vytváří Conductor plán, který řeší rozdíly mezi platformami:

Fáze 1: Základní nastavení

  • 1Inicializace React Native s TypeScript
  • 2Konfigurace navigace (tab + stack)
  • 3Nastavení správy stavu (Redux)
  • 4Vytvoření datové vrstvy offline-first

Fáze 2: Funkce tréninku

  • 1Tvorba obrazovek pro logování tréninků
  • 2Vytvoření databáze cviků
  • 3Implementace časovače odpočinku s notifikacemi
  • 4Přidání grafů pokroku

Fáze 3: Nativní integrace

  • 1Integrace Apple Health / Google Fit
  • 2GPS sledování pro kardio
  • 3Nastavení push notifikací
  • 4Fotoaparát pro fotky pokroku

Fáze 4: Sociální funkce a ladění

  • 1Integrace sociálního sdílení
  • 2Systém přátel a výzvy
  • 3Animace a haptická odezva
  • 4Generování podkladů pro obchody s aplikacemi
C

Conductor

Plánuji vaši fitness aplikaci. Rychlé otázky: 1. Má GPS sledování fungovat na pozadí během běhu? 2. Chcete doprovodné aplikace pro Apple Watch / Wear OS? 3. Mají se data o tréninku synchronizovat mezi zařízeními? 4. Máte konkrétní databázi cviků (nebo vytvořím komplexní vlastní)?

U

User

Ano pro GPS na pozadí. Zatím žádné aplikace pro hodinky. Ano pro synchronizaci mezi zařízeními. Vytvoř dobrou výchozí databázi.

C

Conductor

Perfektní! Vytvořil jsem 18 úkolů ve 4 fázích. Virtuoso bude stavět a testovat na simulátorech iOS a Android v Dockeru. To zabere asi 12-15 minut. Začínám!

Sledování mobilních sestavení v Dockeru

Virtuoso spouští reálná mobilní sestavení – ne jen generování kódu:

1Metro Bundler

JavaScript bundle vytvořen a validován

2iOS Build

Xcode sestavuje v Dockeru, chyby zachyceny včas

3Android Build

Gradle sestavení s reálným Android SDK

4Simulator Tests

Aplikace se spustí a otestují se základní průchody

5Native Module Check

Ověření oprávnění pro health kit, GPS a fotoaparát

Na rozdíl od nástrojů, které pouze vypisují kód, Nxcode vaši aplikaci skutečně sestaví. Pokud React Native vyhodí chyby při sestavení, Virtuoso je automaticky opraví. Získáte funkční aplikaci, nikoli rozbitý projekt.

Integrace nativních funkcí

Virtuoso zvládá složité nativní nastavení:

Health Kit / Google Fit

Čtení kroků, tréninků, tepové frekvence. Zápis tréninkových relací. Správné zpracování oprávnění.

GPS & Poloha na pozadí

Sledování venkovních běhů, i když je aplikace na pozadí. Implementace optimalizovaná pro výdrž baterie.

Push notifikace

Lokální notifikace pro časovače odpočinku. Vzdálené notifikace pro aktivitu přátel.

Offline-First

SQLite pro lokální úložiště. Synchronizace na pozadí po připojení. Včetně řešení konfliktů.

Testování vaší mobilní aplikace

Několik způsobů, jak testovat před odesláním do obchodu s aplikacemi:

Webový náhled

Rychlý náhled v prohlížeči. Dobré pro UI, ale bez nativních funkcí.

Expo Go

Naskenujte QR kód a testujte ve svém telefonu. Většina funkcí funguje.

Vývojové sestavení

Plné nativní sestavení pro testování všech funkcí včetně health kit.

TestFlight / Interní testování

Sdílejte s beta testery před veřejným vydáním.

Nasazení do obchodů s aplikacemi

Nxcode zjednodušuje proces odesílání do obchodů s aplikacemi:

  1. Klikněte na "Build for Production"
  2. Vygenerováno podepsané IPA (iOS) a AAB (Android)
  3. Automaticky vygenerované snímky obrazovky pro obchody
  4. Vytvořeny zásady ochrany osobních údajů a texty pro zalistování
  5. Nahrání do App Store Connect / Google Play Console

Co je zahrnuto

  • Automatické podepisování kódu
  • Generování snímků obrazovky pro všechny velikosti zařízení
  • Návrhy obsahu pro zalistování v App Store
  • Generátor zásad ochrany osobních údajů
  • Správa verzí

Monetizujte svou mobilní aplikaci

Proměňte svou aplikaci v opakující se příjmy:

1

Předplatné v aplikaci

Virtuoso může přidat úrovně předplatného (zdarma, pro) s účtováním přes App Store / Play Store.

2

Ekonomika tvůrců

Zalistujte v Nxcode tržišti. Uživatelé platí přes naši platformu, vy si necháváte 70 %.

3

Přímý prodej

Prodávejte prémiové funkce přímo přes svůj vlastní Stripe účet.

Mnoho fitness aplikací účtuje 9,99 $/měsíc. S 200 předplatiteli je to 1 400 $/měsíc (po 70% podílu v Ekonomice tvůrců).

Co jste vytvořili

  • React Native aplikace připravená pro produkci
  • Nativní podpora pro iOS a Android
  • Integrace health kit a GPS
  • Architektura offline-first
  • Push notifikace
  • Sestavení připravená pro obchody s aplikacemi

Vaše mobilní aplikace nebyla jen vygenerována – byla sestavena, otestována na simulátorech iOS a Android a ověřena, že se skutečně zkompiluje. To je rozdíl Nxcode.

Další kroky

Webový společník

Přidejte ke své mobilní aplikaci webový dashboard

Webový společník →

Ekonomika tvůrců

Naučte se strategie monetizace

Ekonomika tvůrců →

Základní koncepty

Pochopte Conductor a Virtuoso

Základní koncepty →

Jste připraveni vytvořit svou mobilní aplikaci?

Začněte stavět svou iOS a Android aplikaci hned teď.

Začít stavětDalší tutoriály

Continue Learning

React Native App

Cross-platform mobile development

Mobile E-commerce

Build a mobile shopping app

Publishing Your App

Deploy to App Store & Play Store

Location-Based App

Maps and geolocation features

Browse All Tutorials →