AngularDart Part 2 -- Installation Boiler Projekt

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.

Standort: Zürich, Schweiz

Kommentare

Kommentar veröffentlichen

Beliebte Posts aus diesem Blog

Flutter und JSON

Bild
Wer sich, und wenn es nur oberflächlich ist, mit programmieren befasst wird auf den Begriff JSON stoßen. Wenn man Großmama Google danach fragt, bekommt man von Großvater Wiki diese Definition angeboten: Die JavaScript Object Notation, kurz JSON , ist ein kompaktes Datenformat in einer einfach lesbaren Textform zum Zweck des Datenaustauschs zwischen Anwendungen. Ein Datenformat ist ein Standard, den sich jemand ausgedacht hat. Wieso und warum ist interessant, aber sekundär. JSON ist ein Datenaustausch Format und ist aktuell im Web weit verbreitet. Viele Quellen mit denen man interagieren kann, bieten ihre Daten in diesen Format an. In aller kürze (ohne ein Tutorial zu JSON ersetzen zu wollen) hier das wichtigste: Der Inhalt eines JSON Files befindet sich entweder zwischen [..] oder {...} Klammern. [...] = Der Inhalt ist eine Liste. Diese Liste kann ein oder mehrere Objekte enthalten. {...} = Der Inhalt ist ein Objekt aus einem oder mehreren Schlüssel/Wert Paaren. Beispi...
Mehr anzeigen

Dart Basic: abstract class Part 1

Bild
Photo by Elijah O'Donnell / unsplash.com In diesem Artikel betrachten wir die abstrakte Klassen in Dart. Was ist der Nutzen ? Normale Klassen können auf eine Vielzahl von Arten benutzt und manipuliert werden. Dabei steht die Wiederverwendbarkeit der Klassen und den davon abgeleiteten Objekten im Vordergrund. Abstrakte Klassen bringen nun auf der einten Seite Einschränkungen mit sich, gewähren dafür aber in gewisser Beziehung auch grössere Freiheiten . Wenn man durch die Dart Bibliotheken stöbert wird man auf nicht wenige davon stoßen. Man darf ruhig davon sprechen, das sie eine elementare Rolle in Dart spielen Details Hier links sehen wir, das das Schlüsselwort abstract den Unterschied zu der normalen Klassendefinition ausmacht.   Hier aber gleich zum ersten, wesentlichen Unterschied zu"normalen" Klassen in Dart : von einer abstrakten Klasse, kann man nicht direkt ein Objekt ableiten!  Jeder Versuch das zu tun wird am Compiler scheitern. Selbs...
Mehr anzeigen

Flutter -- Tutorial Teil 8 TextField Part 1 onChanged

Bild
I n den letzten drei Teilen dieses Flutter Tutorials haben wir ein simples Formular erstellt und so schon einige Elemente kennengelernt, die uns Flutter zu diesem Zweck zur Verfügung stellt. Es wird nun Zeit näher auf das wichtigste von allen einzugehen. Das ist ohne Zweifel das Text Feld, oder in der Flutter Welt: TextField ! Zuerst aber zu einem kleinen, aber wichtigen Unterschied. Flutter kennt TextField und TextFormField . Das zuletzt genannte ist darauf vorbereitet, sich im Kontext eines Formulars zu befinden. Das Formular Konzept von Flutter lässt den Benutzer alle Inputfelder , d.h. Text Felder , Switchboxen , Checkboxen manipulieren. Es ist am Entwickler ein Element festzulegen, welches dann den Validierungsprozess auslöst. Oft ist das ein Button mit ok, senden oder speichern als Text. TextField ist also die Variante, auf die wir außerhalb eines Formulars zugreifen können. Für das nachvollziehen des Beispiel Codes verwende ich folgende main.dart Datei: ...
Mehr anzeigen