Webprogrammering

Hvordan sette opp flutter og lage Hello World Web Application i Linux

Hvordan sette opp flutter og lage Hello World Web Application i Linux
Flutter er et rammeverk for applikasjonsutvikling som kan brukes til å utvikle apper på tvers av plattformer som kjører på innfødt kode når de er kompilert eller bygget. Flutter er utviklet av Google og lar deg lage raske prototyper på kort tid, i tillegg til at du kan lage fullverdige apper som bruker plattformsspesifikke APIer. Ved hjelp av Flutter kan du lage flotte apper for mobile enheter, stasjonære operativsystemer og nettlesere ved hjelp av offisielle widgets for materialdesign. Denne artikkelen vil diskutere installasjon av Flutter og opprettelse av et nytt prosjekt for utvikling av en webapplikasjon. Flutter bruker “Dart” som det viktigste programmeringsspråket for å skrive apper.

Installer Flutter på Linux

Du kan installere Flutter i Linux ved å bruke to metoder. Den første metoden er ganske grei, alt du trenger å gjøre er å kjøre en enkel kommando for å installere Flutter fra snap store.

$ sudo snap install flutter --classic

Den andre metoden innebærer å laste ned flutter-depotet fra GitHub. Kjør følgende kommandoer etter hverandre for å installere Flutter manuelt:

$ sudo apt installere git
$ git klon https: // github.com / flagre / flagre.git -b stabil - dybde 1 - ingen-gren

Merk at når du kjører kommandoen ovenfor, får du nødvendige filer fra det offisielle Flutter-depotet, inkludert kjørbare binære filer. Du vil kunne utføre disse binære filene fra "bin" -mappen. Disse kjørbare filene blir imidlertid ikke lagt til den systemomfattende PATH-variabelen, og du vil ikke kunne kjøre dem hvor som helst med mindre du manuelt legger dem til PATH-variabelen. Følg trinnene nedenfor for å gjøre det.

Åpen ".bashrc ”-fil som ligger i hjemmemappen din ved hjelp av din favoritt teksteditor:

$ nano “$ HOME /.bashrc ”

Legg til følgende linje nederst i filen, og erstatt forsiktig streng.

eksporter PATH = "$ PATH:/ flagre / søppel "

For eksempel, hvis du lastet ned Flutter-depotet i "Nedlastinger" -mappen, må du legge til følgende linje:

eksport PATH = "$ PATH: $ HOME / Nedlastinger / flutter / bin"

Lagre filen når du er ferdig. Oppdater “.bashrc ”-fil ved å kjøre kommandoen nedenfor:

$ kilde “$ HOME /.bashrc ”

For å bekrefte at Flutters "bin" -mappe er lagt til banen, kjør kommandoen nedenfor:

$ ekko $ PATH

Du bør få litt produksjon som dette:

/ usr / local / sbin: / usr / local / bin: / usr / sbin: / usr / bin: / sbin: / bin: / usr / games: / usr / local / games: / snap / bin: / home / nit / Nedlastinger / flagre / søppel

Legg merke til tilstedeværelsen av nøkkelordet "flutter" og hele banen som viser "bin" -mappen i "flutter" -katalogen.

For å sjekke om "flutter" -kommandoen kan kjøres fra hvilken som helst bane, bruk kommandoen nedenfor:

$ som flagrer

Du bør få litt produksjon som dette:

/ hjem / nit / Nedlastinger / flagre / søppel / flagre

Merk at "Dart" -språket, som kreves for å skrive Flutter-apper, leveres med Flutter-filer lastet ned fra git-arkiv eller fra snap-pakken. Kjør følgende kommando for å sjekke manglende avhengigheter som kreves for å kjøre Flutter:

$ fladder lege

Noen nødvendige filer kan begynne å lastes ned for å fullføre Flutter-oppsettet. Hvis du ikke har installert Android SDK ennå, vil det vises en melding i utgangen for å veilede deg gjennom installasjonen.

Hvis du vil utvikle Android-apper ved hjelp av Flutter, klikker du på koblingene som er synlige i terminalutgangen og følger relevante trinn for å installere Android SDK.

Denne opplæringen fokuserer på å bygge webapplikasjoner ved hjelp av Flutter. For å aktivere støtte for å lage webapper, kjør følgende kommandoer etter hverandre:

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

For å bekrefte at nettapplikasjonsstøtte er aktivert, kjør kommandoen nedenfor:

$ flagrende enheter

Du bør få litt produksjon som dette:

2 tilkoblede enheter:
Webserver (web) • webserver • web-javascript • Flutter Tools
Chrome (web) • krom • web-javascript • Google Chrome 87.0.4280.66

Hvis du har fulgt trinnene riktig så langt, bør Flutter nå være riktig installert på systemet ditt, klar til å lage noen webapper.

Lag et nytt Flutter-prosjekt

For å lage et nytt "HelloWorld" -applikasjonsprosjekt ved hjelp av Flutter, kjør kommandoene nevnt nedenfor:

$ flutter skape helloworld
$ cd helloworld

For å teste det nyopprettede prosjektet ditt, kjør kommando:

$ flutter run -d krom

Du bør se en Flutter-webapplikasjonsdemo slik:

Du kan feilsøke Flutter-nettapper med utviklingsverktøy innebygd i Chrome.

Endre prosjektet ditt

Demoprosjektet du opprettet ovenfor inneholder en “main.dart-fil i "lib" -mappen. Koden inneholdt i denne “hoved.dart-filen er kommentert veldig bra og kan forstås ganske enkelt. Jeg vil foreslå at du går gjennom koden minst en gang for å forstå den grunnleggende strukturen til en Flutter-app.

Flutter støtter "hot reload", slik at du raskt kan oppdatere appen din uten å starte den på nytt for å se endringene. Prøv å endre programtittelen fra "Flutter Demo Home Page" til "Hello World !!" i hoved.dart ”-fil. Når du er ferdig, trykk tast inn terminalen for å oppdatere apptilstanden uten å starte den på nytt.

Bygg din Flutter-app

For å bygge Flutter-webappen din, bruk kommandoen spesifisert nedenfor fra prosjektkatalogen din:

$ flutter build web

Når byggeprosessen er ferdig, bør du ha en ny mappe i prosjektkatalogen din som ligger på "build / web" -stien. Her finner du alle nødvendige “.html ”,“.js ”og“.css ”-filer som kreves for å tjene prosjektet online. Du finner også forskjellige aktivafiler som brukes i prosjektet.

Nyttige ressurser

Hvis du vil vite mer om utvikling av webapper ved hjelp av Flutter, kan du se den offisielle dokumentasjonen. Du kan se i offisiell dokumentasjon for Dart-språk for å få en bedre forståelse av Flutter-apper. Flutter kommer med mange offisielle og tredjepartspakker som du kan bruke til å raskt utvikle apper. Du finner disse pakkene tilgjengelig her. Du kan bruke materialdesign Flutter-widgets i webappene dine. Du finner dokumentasjon for disse widgetene i den offisielle Flutter-dokumentasjonen. Du kan også få en følelse av disse widgetene ved å bla gjennom arbeidsdemoer av materialkomponenter.

Konklusjon

Flutter har vært under utvikling en god stund nå, og den vokser som et rammeverk for utvikling av "skriv en gang distribuer hvor som helst" apper på tvers av plattformer. Adopsjonen og populariteten er kanskje ikke så høy som andre slike rammer, men det gir en stabil og robust API for å utvikle plattformapplikasjoner.

Kamp for Wesnoth 1.1. 3.6 Utvikling utgitt
Kamp for Wesnoth 1.1. 3.6 utgitt i forrige måned, er den sjette utgivelsen i 1.1. 3.x-serien, og den leverer en rekke forbedringer, spesielt til bruke...
Slik installerer du League Of Legends på Ubuntu 14.04
Hvis du er fan av League of Legends, er dette en mulighet for deg å prøvekjør League of Legends. Merk at LOL støttes på PlayOnLinux hvis du er en linu...
Installer det siste OpenRA-strategispillet på Ubuntu Linux
OpenRA er en Libre / Free Real Time Strategy-spillmotor som gjenskaper de tidlige Westwood-spillene som den klassiske Command & Conquer: Red Alert. Di...