Tutoriaalit

Keskitaso

25 minuuttia

Opit seuraavat asiat

  • Mobiilisovelluksen vaatimukset
  • React Native -generointi
  • Natiiviominaisuuksien integrointi
  • Docker-pohjainen testaus
  • Sovelluskauppajulkaisu
  • Creator Economy -julkaiseminen

Rakenna mobiilisovellus

Luo tuotantovalmiita iOS- ja Android-sovelluksia 25 minuutissa

Haluatko tavoittaa käyttäjät heidän puhelimillaan? Tässä tutoriaalissa rakennat täydellisen mobiilin kuntoilusovelluksen iOS:lle ja Androidille. Katso, kuinka Conductor suunnittelee ja Virtuoso rakentaa React Native -sovelluksesi aidoissa Docker-konteissa – oikeilla koosteilla ja testeillä.

Mitä rakennamme

Kuntoilun seurantasovellus, jossa on: treenien kirjaus, edistymiskaaviot, push-ilmoitukset, Health Kit -integraatio, offline-tuki ja sosiaalinen jakaminen – tuotantovalmiina App Storeen ja Google Playhin.

Esivaatimukset

  • Suoritettu Aloitusopas-tutoriaali
  • Nxcode-tili (Lite tai Pro)
  • Mobiilikehityskokemusta ei vaadita

Mobiilikehitys Nxcode-alustalla

Nxcode generoi React Native -sovelluksia, jotka toimivat natiivisti iOS:llä ja Androidilla. Tässä on se, mikä tekee siitä erilaisen:

Aito natiivikoodi

Ei pelkkä verkkosivukääre – vaan aitoa React Native -koodia, joka kääntyy natiiveiksi iOS- ja Android-binääreiksi.

Docker-testaus

Sovelluksesi rakentuu ja ajetaan Dockerissa. Jos se ei käänny, Virtuoso korjaa sen automaattisesti.

Natiiviominaisuudet

Kamera, ilmoitukset, Health Kit, paikannus – kaikki toimivat suoraan paketista.

Yksi koodipohja

Yksi koodi molemmille alustoille, alustakohtaisilla optimoinneilla tarvittaessa.

Mobiilisovelluksesi kuvaileminen

Kerro Conductorille, mitä haluat. Ole tarkka natiiviominaisuuksien suhteen:

Rakenna kuntoilun seurantasovellus iOS:lle ja Androidille:

Ydinominaisuudet:
- Treenien kirjaus: liikkeet, sarjat, toistot, painot
- Cardion seuranta GPS:llä ulkojuoksuja varten
- Edistymiskaaviot, jotka näyttävät voiman kehityksen ajan myötä
- Lepoajastin sarjojen välillä ilmoituksilla
- Treenihistoria ja omat ennätykset

Health-integraatio:
- Apple Health / Google Fit -synkronointi
- Askelten laskenta ja päivittäinen aktiivisuus
- Syke treenien aikana (jos saatavilla)

Sosiaaliset ominaisuudet:
- Treeniyhteenvetojen jakaminen sosiaaliseen mediaan
- Kaverien haasteet ja tulostaulut
- Yhteisön treenimallit

Offline-tuki:
- Täysi offline-toiminnallisuus
- Synkronointi, kun yhteys palautuu

Suunnittelu:
- Tumma tila oletuksena
- Suuret, helposti painettavat painikkeet
- Sulavat animaatiot

Conductor suunnittelee mobiilisovelluksesi

Mobiilisovelluksia varten Conductor luo suunnitelman, joka huomioi alustojen väliset erot:

Vaihe 1: Perusasetukset

  • 1Alusta React Native TypeScriptillä
  • 2Määritä navigointi (tab + stack)
  • 3Aseta tilanhallinta (Redux)
  • 4Luo offline-first-tietokerros

Vaihe 2: Treeniominaisuudet

  • 1Rakenna treenien kirjausnäkymät
  • 2Luo liiketietokanta
  • 3Toteuta lepoajastin ilmoituksilla
  • 4Lisää edistymiskaaviot

Vaihe 3: Natiivi-integraatio

  • 1Apple Health / Google Fit -integraatio
  • 2GPS-seuranta cardiolle
  • 3Push-ilmoitusten määritys
  • 4Kamera edistymiskuvia varten

Vaihe 4: Sosiaaliset toiminnot ja viimeistely

  • 1Sosiaalisen jakamisen integraatio
  • 2Kaverijärjestelmä ja haasteet
  • 3Animaatiot ja haptinen palaute
  • 4Sovelluskauppa-aineistojen generointi
C

Conductor

Suunnittelen kuntoilusovellustasi. Muutama nopea kysymys: 1. Pitäisikö GPS-seurannan toimia taustalla juoksun aikana? 2. Haluatko Apple Watch / Wear OS -kumppanisovellukset? 3. Pitäisikö treenidatan synkronoitua laitteiden välillä? 4. Onko sinulla tiettyä liiketietokantaa (vai luonko kattavan oletustietokannan)?

U

User

Kyllä tausta-GPS:lle. Ei kellosovelluksia toistaiseksi. Kyllä laitteiden väliselle synkronoinnille. Luo hyvä oletustietokanta.

C

Conductor

Selvä! Olen luonut 18 tehtävää 4 vaiheeseen. Virtuoso rakentaa ja testaa sovelluksen sekä iOS- että Android-simulaattoreilla Dockerissa. Tämä kestää noin 12-15 minuuttia. Aloitetaan!

Mobiilikoosteiden seuraaminen Dockerissa

Virtuoso ajaa oikeita mobiilikoosteita – ei pelkkää koodin generointia:

1Metro Bundler

JavaScript-paketti luotu ja vahvistettu

2iOS Build

Xcode rakentaa Dockerissa, virheet havaitaan aikaisin

3Android Build

Gradle-kooste aidolla Android SDK:lla

4Simulator Tests

Sovellukset käynnistyvät ja perusvirrat testataan

5Native Module Check

Health Kit, GPS ja kameran käyttöoikeudet varmistettu

Toisin kuin työkalut, jotka vain tuottavat koodia, Nxcode todella rakentaa sovelluksesi. Jos React Native antaa koontivirheitä, Virtuoso korjaa ne automaattisesti. Saat toimivan sovelluksen, et rikkinäistä projektia.

Natiiviominaisuuksien integrointi

Virtuoso hoitaa monimutkaiset natiiviasetukset:

Health Kit / Google Fit

Lue askeleet, treenit ja syke. Kirjoita treenisessiot. Asianmukainen käyttöoikeuksien hallinta.

GPS & taustapaikannus

Seuraa ulkojuoksuja, vaikka sovellus olisi taustalla. Akkuoptimoitu toteutus.

Push-ilmoitukset

Paikalliset ilmoitukset lepoajastimille. Etäilmoitukset kaverien aktiviteeteista.

Offline-First

SQLite paikalliseen tallennukseen. Taustasynkronointi verkkoyhteyden palatessa. Sisältää ristiriitojen ratkaisun.

Mobiilisovelluksesi testaaminen

Useita tapoja testata ennen sovelluskauppaan lähettämistä:

Web Preview

Nopea esikatselu selaimessa. Hyvä käyttöliittymälle, mutta ei natiiviominaisuuksia.

Expo Go

Skannaa QR-koodi ja testaa puhelimellasi. Useimmat ominaisuudet toimivat.

Development Build

Täysi natiivikooste kaikkien ominaisuuksien, kuten Health Kitin, testaamiseen.

TestFlight / Sisäinen testaus

Jaa betatestaajille ennen julkista julkaisua.

Sovelluskauppajulkaisu

Nxcode yksinkertaistaa sovelluskauppaan lähettämisprosessia:

  1. Klikkaa "Build for Production"
  2. Allekirjoitettu IPA (iOS) ja AAB (Android) luodaan
  3. Sovelluskaupan kuvakaappaukset generoidaan automaattisesti
  4. Tietosuojakäytäntö ja esittelytekstit luodaan
  5. Lataus App Store Connectiin / Google Play Consoleen

Mitä sisältyy

  • Koodin allekirjoitus hoidetaan automaattisesti
  • Kuvakaappausten generointi kaikille laiteryhmille
  • Ehdotukset sovelluskaupan esittelyteksteiksi
  • Tietosuojakäytännön generaattori
  • Versiohallinta

Ansaitse mobiilisovelluksellasi

Muuta sovelluksesi jatkuvaksi tulovirraksi:

1

Sovelluksen sisäiset tilaukset

Virtuoso voi lisätä tilaustasoja (ilmainen, pro) App Store / Play Store -laskutuksella.

2

Creator Economy

Listaa sovelluksesi Nxcode-markkinapaikalla. Käyttäjät maksavat alustamme kautta, sinä pidät 70 %.

3

Suoramyynti

Myy premium-ominaisuuksia suoraan oman Stripe-tilisi kautta.

Monet kuntoilusovellukset veloittavat 9,99 $/kk. 200 tilaajalla se on 1 400 $/kk (70 % Creator Economy -osuuden jälkeen).

Mitä olet rakentanut

  • Tuotantovalmis React Native -sovellus
  • Natiivi iOS- ja Android-tuki
  • Health Kit- ja GPS-integraatio
  • Offline-first-arkkitehtuuri
  • Push-ilmoitukset
  • Sovelluskauppavalmiit koosteet

Mobiilisovellustasi ei vain generoitu – se rakennettiin, testattiin iOS- ja Android-simulaattoreilla ja varmistettiin, että se todella kääntyy. Se on Nxcode-ero.

Seuraavat vaiheet

Verkkosovelluskumppani

Lisää hallintapaneeli mobiilisovelluksellesi

Verkkosovelluskumppani →

Creator Economy

Opi kaupallistamisstrategioita

Creator Economy →

Ydinkäsitteet

Ymmärrä Conductor ja Virtuoso

Ydinkäsitteet →

Valmis rakentamaan mobiilisovelluksesi?

Aloita iOS- ja Android-sovelluksesi rakentaminen nyt.

Aloita rakentaminenLisää tutoriaaleja

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 →