Kaikki artikkelit
Mobiili·7 min lukuaika

PWA:sta App Storeen: näin julkaiset Flutter-sovelluksen

Jokainen builder77-mobiilisovellus alkaa asennettavana PWA:na. Kun olet valmis sovelluskauppoihin, muunna se natiiviksi Flutter-projektiksi, joka käyttää samaa tietokantaa.

77
builder77-tiimi
builder77.com

Sovelluksen saaminen jonkun puhelimeen tarkoitti ennen alustan valitsemista, sen työkalujen opettelua ja tarkistusjonossa odottamista, ennen kuin kukaan pääsi kokeilemaan. builder77 jakaa matkan kahteen vaiheeseen: julkaise PWA tänään, jotta oikeat ihmiset voivat käyttää sitä, ja siirry natiiviin Flutteriin, kun olet valmis App Storeen ja Google Playhin.

Vaihe 1: PWA, jonka käyttäjäsi voivat asentaa heti

Kun rakennat mobiilisovelluksen builder77:llä, se suunnitellaan alusta asti puhelinsovellukseksi: koko korkeuden asettelu, alavälilehtinavigaatio, isot kosketusalueet ja turva-alueen reunukset loveiselle näytölle. Kun julkaiset sen, se saa web-sovellusmanifestin ja service workerin, mikä tekee siitä asennettavan.

  • Paina Julkaise ja skannaa QR-koodi puhelimellasi.
  • iPhonessa napauta Jaa → Lisää Koti-valikkoon. Androidissa käytä asennuskehotetta tai selaimen valikkoa.
  • Sovellus avautuu koko näytölle omalla kuvakkeellaan, aivan kuten natiivisovellus.

Tämä on nopein tapa saada palautetta. Voit jakaa linkin kymmenelle testaajalle jo tänä iltapäivänä, seurata, miten he käyttävät sovellusta, ja parantaa sitä edelleen editorissa – jokainen julkaisu päivittää sovelluksen kaikille heti, ilman kaupan tarkistusta.

Vaihe 2: muunna Flutteriksi

Kun sovellus on hyvässä kunnossa, avaa Flutter-välilehti ja muunna se. Tämä maksaa 3 viestikrediittiä. builder77 luo Flutter-projektin – pubspec.yaml ja lib/main.dart – samoilla näkymillä, ominaisuuksilla ja visuaalisella ilmeellä kuin web-sovelluksesi, Material 3:lla toteutettuna.

Tärkeintä: Flutter-sovellus käyttää samaa pilvitietokantaa builder77:n REST-rajapinnan kautta samoilla kokoelma- ja kenttänimillä. PWA:ssa luodut tiedot näkyvät natiivisovelluksessa ja päinvastoin, ja sovelluksesi käyttäjät voivat kirjautua kummassa tahansa.

dart
// 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

Kokeile ennen lataamista

Voit ajaa Flutter-version asentamatta mitään. Flutter-välilehdellä on kaksi vaihtoehtoa:

  • DartPad – avaa luotu koodi DartPadissa nopeaa vilkaisua varten.
  • Pilvikäännös (Plus-paketti ja ylemmät) – builder77 ajaa oikean flutter build web -käännöksen palvelimillamme ja näyttää käännetyn sovelluksen suoraan editorissa. Se on uskollisin esikatselu siitä, mitä natiivisovellus tekee.

Jos pilvikäännös ilmoittaa virheestä tai jokin näyttää oudolta, pyydä korjausta chatissa ja muunna uudelleen. Koska web-sovellus on totuuden lähde, yleensä kannattaa ensin saada web-versio kuntoon ja luoda sitten Flutter-projekti uudelleen.

Lataa ja avaa projekti

Starter-paketista alkaen voit ladata Flutter-projektin. Siitä eteenpäin kyse on tavallisesta Flutter-työnkulusta:

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

Julkaisu sovelluskauppoihin

Kauppoihin lähettäminen tapahtuu edelleen Applen ja Googlen työkaluissa omilla kehittäjätileilläsi. Yleinen tarkistuslista näyttää tältä:

  • Aseta yksilöllinen bundle ID / application ID ja sovelluksesi nimi.
  • Lisää sovelluskuvakkeet ja käynnistysnäkymä molemmille alustoille.
  • Määritä allekirjoitus: jakelusertifikaatti ja provisiointiprofiili iOS:ssä, upload keystore Androidissa.
  • Käännä julkaisuversiot komennoilla flutter build ipa ja flutter build appbundle.
  • Valmistele kauppasivut: kuvakaappaukset, kuvaus, tietosuojatiedot ja tuki-URL.
  • Lähetä tarkistettavaksi App Store Connectissa ja Google Play Consolessa.

Kauppojen tarkastajat katsovat yksityisyyttä tarkasti. Jos sovelluksessasi on kirjautuminen ja se tallentaa henkilötietoja, tarvitset tietosuojakäytännön URL-osoitteen – voit pyytää builder77:ää lisäämään web-sovellukseesi tietosuojasivun ja linkittää siihen.

Pidä PWA mukana

Natiiviversion julkaiseminen ei tarkoita web-version eläköitymistä. PWA toimii edelleen samoilla tiedoilla, joten ihmiset voivat käyttää sovellustasi selaimessa, tietokoneella tai ennen kuin ovat asentaneet sen kaupasta. Yksi tuote, kaksi etuovea, yksi taustajärjestelmä.

Neuvomme: testaa ideaa PWA:lla, muunna Flutteriksi, kun käyttäjät pyytävät sitä, ja pidä kauppaversiota viimeisteltynä painoksena jostakin, jota ihmiset jo rakastavat.

Valmis rakentamaan?

Kuvaile ideasi ja saat toimivan ensimmäisen version noin minuutissa. Aloittaminen on ilmaista, eikä luottokorttia tarvita.