Kako nastaviti Flutter in ustvariti spletno aplikacijo Hello World v Linuxu

Flutter je okvir za razvoj aplikacij, ki ga lahko uporabimo za razvoj večplastnih aplikacij, ki se izvajajo na izvorni kodi, potem ko so zbrane ali izdelane. Flutter, ki ga je razvil Google, vam omogoča, da v kratkem času ustvarite hitre prototipe, pa tudi polnopravne aplikacije, ki uporabljajo API-je, specifične za platformo. Z uporabo Flutterja lahko z uradnimi pripomočki za oblikovanje materiala ustvarite čudovite aplikacije za mobilne naprave, namizne operacijske sisteme in spletne brskalnike. Ta članek bo obravnaval namestitev Flutterja in ustvarjanje novega projekta za razvoj spletne aplikacije. Flutter uporablja "Dart" kot glavni programski jezik za pisanje aplikacij.

Namestite Flutter v Linux

Flutter lahko v Linux namestite na dva načina. Prva metoda je precej preprosta, vse kar morate storiti je, da zaženete preprost ukaz za namestitev Flutterja iz snap store.

$ sudo snap install flutter --classic

Druga metoda vključuje prenos shrambe flutter iz GitHub. Za ročno namestitev Flutterja zaženite naslednje ukaze:

$ sudo apt install git
$ git klon https: // github.com / flutter / flutter.git -b stabilen - globina 1 - nobena enojna veja

Upoštevajte, da boste z izvajanjem zgornjega ukaza dobili potrebne datoteke iz uradnega repozitorija Flutter, vključno z izvršljivimi binarnimi datotekami. Te binarne datoteke boste lahko zagnali iz mape "bin". Vendar te izvršljive datoteke ne bodo dodane v sistemsko spremenljivko PATH in jih ne boste mogli zagnati od nikoder, razen če jih ročno dodate spremenljivki PATH. Če želite to narediti, sledite spodnjim korakom.

Odprto ".bashrc ”v vaši domači mapi z vašim najljubšim urejevalnikom besedil:

$ nano “$ HOME /.bashrc "

Na dnu datoteke dodajte naslednjo vrstico in previdno zamenjajte vrvica.

izvoz PATH = "$ PATH:/ flutter / bin "

Če ste na primer shranili skladišče Flutter v mapo »Prenosi«, boste morali dodati naslednjo vrstico:

izvoz PATH = "$ PATH: $ HOME / Downloads / flutter / bin"

Ko končate, shranite datoteko. Osveži “.bashrc ”z zagonom spodnjega ukaza:

$ source “$ HOME /.bashrc "

Če želite preveriti, ali je bila Flutterjeva mapa »bin« dodana na pot, zaženite spodnji ukaz:

$ echo $ PATH

Morali bi dobiti nekaj takšnih rezultatov:

/ usr / local / sbin: / usr / local / bin: / usr / sbin: / usr / bin: / sbin: / bin: / usr / games: / usr / local / games: / snap / bin: / home / nit / Downloads / flutter / bin

Opazite prisotnost ključne besede "flutter" in celotno pot, ki prikazuje mapo "bin" v imeniku "flutter".

Če želite preveriti, ali je ukaz »flutter« mogoče zagnati s katere koli poti, uporabite spodnji ukaz:

$ ki plapolajo

Morali bi dobiti nekaj takšnih rezultatov:

/ home / nit / Downloads / flutter / bin / flutter

Upoštevajte, da je jezik "Dart", ki je potreben za pisanje aplikacij Flutter, priložen datotekam Flutter, prenesenim iz git repozitorija ali iz snap paketa. Zaženite naslednji ukaz, da preverite manjkajoče odvisnosti, potrebne za zagon Flutterja:

$ flutter zdravnik

Nekatere potrebne datoteke se lahko začnejo prenašati, da dokončate nastavitev Flutterja. Če še niste namestili Android SDK, bo v izhodnem sporočilu prikazano sporočilo, ki vas bo vodilo skozi namestitev.

Če želite razviti aplikacije za Android s pomočjo Flutterja, kliknite povezave, vidne v izhodu terminala, in sledite ustreznim korakom za namestitev Android SDK.

Ta vadnica se osredotoča na izdelavo spletnih aplikacij s pomočjo Flutterja. Če želite omogočiti podporo za ustvarjanje spletnih aplikacij, zaporedoma zaženite naslednje ukaze:

$ flutter channel beta
Nadgradnja $ flutter
$ flutter config --enable-web

Če želite preveriti, ali je podpora za spletne aplikacije resnično omogočena, zaženite spodnji ukaz:

$ flutter naprav

Morali bi dobiti nekaj takšnih rezultatov:

2 povezani napravi:
Spletni strežnik (splet) • spletni strežnik • spletni javascript • Flutter Tools
Chrome (splet) • chrome • web-javascript • Google Chrome 87.0.4280.66

Če ste doslej pravilno sledili korakom, mora biti Flutter zdaj pravilno nameščen v vaš sistem in pripravljen za ustvarjanje nekaterih spletnih aplikacij.

Ustvarite nov projekt Flutter

Če želite z uporabo Flutterja ustvariti nov projekt spletne aplikacije »HelloWorld«, zaženite spodnje ukaze:

$ flutter ustvari helloworld
$ cd helloworld

Če želite preizkusiti novo ustvarjeni projekt, zaženite ukaz:

$ flutter run -d krom

Videti bi morali predstavitev spletne aplikacije Flutter, kot je ta:

Spletne aplikacije Flutter lahko odpravite s pomočjo razvojnih orodij, vgrajenih v Chrome.

Spremenite svoj projekt

Demonstracijski projekt, ki ste ga ustvarili zgoraj, vsebuje »glavno.dart ”, ki se nahaja v mapi“ lib ”. Koda, vsebovana v tej "glavni.dart ”je zelo dobro komentirana in jo lahko razumemo precej enostavno. Predlagam vam, da vsaj enkrat preberete kodo, da boste razumeli osnovno strukturo aplikacije Flutter.

Flutter podpira "vročo ponovno nalaganje", kar vam omogoča hitro osvežitev aplikacije, ne da bi jo znova zagnali, da vidite spremembe. Poskusite naslov aplikacije spremeniti iz “Flutter Demo Home Page” v “Hello World !!"V" glavni.pikado ”. Ko končate, pritisnite vnesite v terminal, da osvežite stanje aplikacije, ne da bi ga znova zagnali.

Zgradite svojo aplikacijo Flutter

Če želite zgraditi spletno aplikacijo Flutter, uporabite spodnji ukaz iz imenika projekta:

$ flutter build web

Ko je postopek gradnje končan, bi morali imeti novo mapo v imeniku projekta, ki se nahaja na poti »build / web«. Tu boste našli vse potrebno “.html ",".js "in".css ”datoteke, potrebne za služenje projekta na spletu. V projektu boste našli tudi različne datoteke sredstev.

Uporabni viri

Če želite izvedeti več o razvoju spletnih aplikacij s pomočjo Flutterja, glejte njegovo uradno dokumentacijo. Za boljše razumevanje aplikacij Flutter se lahko obrnete na uradno dokumentacijo za jezik Dart. Flutter ima na voljo številne uradne in tuje pakete, ki jih lahko uporabite za hiter razvoj aplikacij. Te pakete lahko najdete tukaj. Pripomočke za oblikovanje materiala Flutter lahko uporabite v svojih spletnih aplikacijah. Dokumentacijo za te pripomočke lahko najdete v uradni dokumentaciji Flutter. Ti pripomočki jih lahko tudi občutite z brskanjem po delovnih predstavitvah spletnih komponent materialnega oblikovanja.

Zaključek

Flutter se razvija že nekaj časa in raste kot okvir za razvoj večplatformnih aplikacij »enkrat piši, ko jih uvedeš kjer koli«. Njegovo sprejemanje in priljubljenost morda nista tako visoki kot drugi tovrstni okviri, vendar zagotavlja stabilen in robusten API za razvoj medplatformnih aplikacij.