Ein Blog rund um moderne Webtechnologien. Schwerpunkte sind die Programmiersprache Dart, und das SDK Flutter von Google. Die Posts enthalten in der Regel getestete Code - Beispiele.
AngularDart Part 2 -- Installation Boiler Projekt
Link abrufen
Facebook
X
Pinterest
E-Mail
Andere Apps
AngularDart Logo
Im ersten Teil zu AngularDart, haben wir schon eine Annäherung versucht. In diesem Post setzten wir das fort und erstellen nun das BoilerProjekt in Visual Studio Code.
Wer regelmäßig alle Updates, sowohl für VSC, als auch für Dart installiert hat, sollte keine Probleme haben, schließlich erledigt die IDE alles für uns.
Wir öffnen die Befehlspalette in Visual Studio Code, wählen Dart: neues Projekt und dort AngularDart. Unten ein kleines Video dazu. Aber es ist wirklich einfach...
Nach dem das Boiler Projekt steht, sollte man noch sicherheitshalber die installierten Abhängigkeiten updaten. Entweder über $pub get im Terminal (bitte kontrollieren ob man sich im richtigen Verzeichnis befindet), oder einfacher über den vorhandenen Button von Visual Studio Code. Diesen erhält man, wenn man die pubspec.yaml Datei geöffnet hat, oben rechts. Wenn das geschehen ist und wir keine Fehlermeldungen bekommen haben, sind wir schon fast startbereit. Was jetzt noch fehlt ist die Möglichkeit unser Boiler Projekt im Browser anzuschauen.
Um das zu bewerkstelligen müssen wir das Terminal nutzen. Hier benötigen wir das Programm webdev, welches wir ganz einfach mit pub global activate webdev installieren. Global bedeutet im übrigen, das webdev in unserem path ist und wir keine Probleme mit dem Zugriff haben.
localhost:8080
Hier möchte ich noch einmal erwähnen wie wichtig das updaten aller Komponenten ist. Dart, AngularDart, Flutter, aber auch verwandte Programme werden ständig weiterentwickelt. Während sich einiges automatisch updaten lässt, muss man anderes "von" Hand machen. Man erspart sich im Zweifelsfall viel Arbeit bei der Fehlersuche...
Wenn alles fehlerfrei ist, sollten wir auf localhost:8080 dann unsere Page haben. An sich nichts weltbewegendes, aber ein guter Startpunkt für weitere Schritte in AngularDart.
Formulare Manchmal scheint es so, als seien sie allgegenwärtig: Formulare ! Aber seien wir ehrlich, ohne geht es nicht. Ob ein Log In oder bei der Erfassung von Benutzerdaten. Wir brauchen die Möglichkeit Daten geordnet zu erfassen, ob das nun am Bildschirm ist, oder auf einem Blatt Papier. Natürlich bietet hier Flutter auch Unterstützung an. Ein typisches Formular am Bildschirm besteht oft aus Textfeldern, Checkboxen und eventuell Dropdown Listenfeldern. Dieser Artikel wird seinen Fokus auf das Textfeld legen. Um mit einer Form umzugehen brauchen wir einen State in unserem Code. Für unseren Beispielcode muss es nicht gleich die Implementation von Provider oder BloC sein, ein StatefulWidget erfüllt hier seinen Zweck auch. Vorneweg etwas zu der Organisation der Files. Wenn man sich in Flutter einarbeitet und das bevorzugt mit Beispielcode macht, ist man geneigt immer wieder neue Projekte zu erstellen. Das geht natürlich auch, wird mit der Zeit aber unübersichtli...
Im letzten Artikel zu Dart haben wir uns ja mit, abstrakten Klassen beschäftigt. Ein zugegebener Massen abstraktes Thema (dieser flache Scherz musste jetzt sein) . In diesem Artikel geht es um Parameter, also Übergabewerte. Nicht wenige Funktionen verrichten ihre Arbeit nur, wenn wir Ihnen einen, oder mehrere Werte beim Aufruf übergeben. Dabei kann jede Funktion zwei Arten von Parametern übernehmen: benötige(Pflicht) Werte und optionale . Beispiel: Funktion mit Parametern In diesem sehr einfach Beispielcode wird eine Funktion benutzt, die zwei Zeichenketten als Übergabewerte erwartet. Sollten wir diese Funktion ohne, oder mit nur einem Parameter aufrufen, oder sollten die Übergabewerte den falschen Typ haben, wird uns der Compiler einen Fehler melden . Im Beispiel haben wir also zwei Pflichtwerte zu übergeben. Das Beispiel können wir jetzt um optionale Parameter erweitern. Optionale Parameter gibt es in zwei Varianten : solche die wir durch ihre Position definier...
Der Einsatz von Final und Const in Dart ist nicht ganz einfach zu verstehen. Beide Schlüsselwörter deklarieren eine Variable, die explizit im Code initialisiert werden muss und im weiteren Verlauf nicht mehr veränderbar ist. Wir können zum Beispiel deklarieren: int zahl ; . Die Variable zahl ist nicht initialisiert und wird von Dart mit dem Wert null belegt. Das sollte man nicht mit 0 verwechseln. null lässt sich am besten mit " undefiniert " übersetzen und ist ein Sprachkonstrukt, welches sich innerhalb von Dart auch benutzen bzw abfragen lässt. Im weiteren Verlauf des Programms können wir der Variable zahl werte zuweisen, sprich den Inhalt von zahl ändern. Bei final und const sieht das anders aus. const Beispiel Code: Die erste Variable wird const int tage deklariert. Jeder Versuch sie im weiteren Programmverlauf zu ändern, wird eine Fehlermeldung hervorrufen. Die zweite Variable entsteht aus einer Berechnung, wobei die erste mit ei...
Kommentare
Kommentar veröffentlichen