TutKit.com

Webseiten und Apps entwickeln mit Angular

Kategorie: Webdesign | Trainer: Jannis Seemann

77 Lektionen in über 11,5 Stunden Video-Training zur Webentwicklung mit Angular
Lerne alle wichtigen Konzepte der Angular-Entwicklung kennen: Components, Routing, Module u. v. m.
Inklusive Arbeitsmaterialien: Setze deine neu erworbenen Kenntnisse anhand von Beispielen direkt um
Lass dich von der Programmierleidenschaft deines Trainers Jannis Seemann mitreißen

Kategorien:
Erste Schritte
Grundlegende Funktionen
Components
Parameter übergeben (Data-Binding)
Components Teil 2
Routing: Entwickle eine Anwendung mit mehreren Unterseiten
Services/Wikipedia-Projekt
Pipes
Express + Angular
Exkurs: Ionic/App-Entwicklung mit Angular
Schlusswort

Trainings-Informationen

Videos: 77
Kapitel: 11
Länge : 11.5 Stunden
Detailinformationen
Ähnliche Inhalte

Trailer ansehen
Gesamtinhalt herunterladen
Jetzt dabei sein Jetzt gratis testen

Erste Schritte

Webseiten und Apps entwickeln mit Angular - 1.1 Installation der benötigten Tools

In diesem Tutorial installieren wir die für den Kurs benötigten Tools. So erfährst du, was du zum Nachvollziehen der Inhalte brauchst.

3 Min. mit Arbeitsdatei Kostenlos

Webseiten und Apps entwickeln mit Angular - 1.2 Einleitung

Bevor wir so richtig loslegen, gehen wir die ersten Schritte, damit du verstehst, was es mit Angular auf sich hat.

6 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 1.3 Hintergrundwissen: Wie wird eine Angular - Anwendung geladen?

Ausgangspunkt für deine Projekte: Du musst wissen, wie du Angular-Anwendungen lädst. Und genau das erkläre ich dir hier.

10 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 1.4 Ausgeben von Variablen

In diesem Video soll es um die Ausgabe von Variablen gehen und worauf du dabei achten musst.

5 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 1.5 Variable ändern

In diesem Tutorial zeige ich dir, wie du Variablen änderst.

5 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 1.6 Schleifen: ngFor in Angular

Hier soll es um die ngFor-Schleifen in Angular gehen, die du unbedingt kennen solltest.

13 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 1.7 Einführung TypeScript

Was ist TypeScript und wofür ist es gut? Das erfährst du in diesem Tutorial.

14 Min. mit Arbeitsdatei

Grundlegende Funktionen

Webseiten und Apps entwickeln mit Angular - 2.1 Reagieren auf Ereignisse

Gleich zu Beginn lernst du wichtigsten Grundlagen von Angular kennen. Hier steigen wir ein mit dem Thema „Reagieren auf Ereignisse.“

6 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 2.2 ngFor mit Index

In diesem Tutorial geht es erneut um ngFor, dieses Mal mit Index.

6 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 2.3 Das Keyup-Event Teil 1

Ebenfalls wichtig in Angular: Das Keyup-Event.

17 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 2.4 Das Keyup-Event Teil 2

Weitere Ausführungen zum Keyup-Event.

4 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 2.5 If-Abfragen (ngIf)

Kommen wir zu Bedingungen. In diesem Tutorial geht es um If-Abfragen per ngIf.

2 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 2.6 Wir programmieren eine Stoppuhr!

Das war ein erster Ausschnitt zur Theorie. Nun etwas Praxis: Erfahre, wie du eine Stoppuhr programmierst.

10 Min. mit Arbeitsdatei

Components

Webseiten und Apps entwickeln mit Angular - 3.1 Was ist ein Component?

Tauchen wir etwas tiefer hinab in die Welt von Angular und widmen wir uns den Components. Was das ist? Hier erfährst du es.

13 Min.

Webseiten und Apps entwickeln mit Angular - 3.2 Wir schreiben einen eigenen Component!

Nachdem du weißt, was Components sind, lernst du in diesem Tutorial, einen eigenen Component zu schreiben.

11 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 3.3 Wir übergeben einen Parameter an unseren Component

Damit schlussendlich auch etwas passiert, übergeben wir nun einen Parameter an den Component.

9 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 3.4 Eigene Ereignisse

In diesem Tutorial geht es um Ereignisse.

13 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 3.5 Was ist ein EventEmitter?

EventEmitter in Angular?! Hier erfährst du, was du dazu wissen musst.

12 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 3.6 Wir programmieren einen kleinen eigenen Component

Gehen wir wieder in die Praxis: Gemeinsam programmieren wir einen eigenen Component.

18 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 3.7 Wir programmieren einen kleinen eigenen Component Teil 2

Zweiter Teil unserer Component-Programmierung.

4 Min. mit Arbeitsdatei

Parameter übergeben (Data-Binding)

Webseiten und Apps entwickeln mit Angular - 4.1 Parameter übergeben: Two-Way Data-Binding Teil 1

Wichtig ist die Übergabe von Parametern per Two-Way Data-Binding. Wie das funktioniert, erfährst du in diesem Auftaktvideo zum Thema.

7 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 4.2 Parameter übergeben: Two-Way Data-Binding Teil 2

Weiter geht es mit der Übergabe von Parametern per Two-Way Data-Binding.

4 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 4.3 Parameter übergeben: Two-Way Data-Binding Teil 3

Beschließen wir die Theorie zur Übergabe von Parametern mit Two-Way Data-Binding mit einem weiteren Video dazu.

9 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 4.4 Projektvorstellung + Aufgabe: Programmiere eine To-do-Liste

Probiere dich jetzt mit deinem neu erlangten Wissen: Hier stelle ich dir eine kleine Aufgabe – die Programmierung einer To-do-Liste.

2 Min.

Webseiten und Apps entwickeln mit Angular - 4.5 To-do-Liste, Musterlösung Teil 1

Hier erhältst du die Musterlösung zu der dir gestellten Aufgabe: Wie du an die To-do-Liste herangehen kannst, Teil 1.

18 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 4.6 To-do-Liste, Musterlösung Teil 2

Wie du an die To-do-Liste herangehen kannst, Teil 2.

11 Min. mit Arbeitsdatei

Components Teil 2

Webseiten und Apps entwickeln mit Angular - 5.1 Event-Modifier

Wissen über Components ist besonders wichtig, wenn du mit Angular arbeitest. Daher widmen wir uns dem Thema in diesem Kapitel erneut.

10 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 5.2 CSS-Klassen setzen

Starten wir mit CSS-Klassen und wie du sie setzt.

9 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 5.3 CSS-Styles setzen

In diesem Tutorial geht es um das Setzen von CSS-Styles mit Angular.

4 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 5.4 Components: Eigenes Panel programmieren (ng-content)

So verwendest du ng-content, um in Angular dein eigenes Panel zu programmieren.

7 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 5.5 Components: Eigenes Panel programmieren (ng-content select)

Die Panel-Programmierung wird durch ng-content select jetzt noch erweitert.

7 Min.

Webseiten und Apps entwickeln mit Angular - 5.6 Module in Angular

In diesem Tutorial geht es um Module in Angular.

8 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 5.7 Hintergrundwissen: Wie funktioniert ngStyles? Was sind WebComponents?

Gehen wir ngStyles und WebComponents auf den Grund. Wie das Ganze funktioniert und was es ist – in diesem Tutorial erhältst du Antworten.

13 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 5.8 HTML-Code/CSS-Code in separaten Dateien

Ein paar wichtige Informationen zu deinen HTML- und CSS-Codes: Die gehören in separate Dateien.

3 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 5.9 Components: Lifecycle-Callbacks

In diesem Tutorial geht es um Lifecycle-Callbacks bei den Components in Angular.

12 Min. mit Arbeitsdatei

Routing: Entwickle eine Anwendung mit mehreren Unterseiten

Webseiten und Apps entwickeln mit Angular - 6.1 Einführung: Was ist Routing überhaupt?

Mithilfe des Routings entwickelst du deine Anwendungen mit mehreren Unterseiten. Was Routing ist, erkläre ich zum Einstieg in dieses Kapitel.

5 Min.

Webseiten und Apps entwickeln mit Angular - 6.2 Routing: Einfaches Beispiel

Machen wir es konkret: Hier ein Beispiel dafür, was du mit Routing anfangen kannst.

9 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 6.3 Routing: Navigationsleiste programmieren

So programmierst du mit Angular eine Navigationsleiste.

10 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 6.4 Routing: Startseite definieren

Hier lernst du, wie du beim Routing die Startseite definierst.

6 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 6.5 Routing: Diese Seite konnte nicht gefunden werden

Das kommt nun eben auch vor: „Diese Seite konnte nicht gefunden werden.“ So setzt du das Ganze beim Routing um.

5 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 6.6 Routing: Parameter übergeben Teil 1

In diesem Tutorial geht es mir darum, dir zu zeigen, wie du beim Routing in Angular Parameter übergibst.

10 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 6.7 Routing: Parameter übergeben Teil 2

Hier der zweite Teil zur Übergabe von Parametern beim Routing in Angular.

11 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 6.8 Exkurs: Was sind Observables? Teil 1

Schließen wir noch einen kleinen Exkurs zu einem aber umso wichtigeren Thema an: Observables in Angular.

17 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 6.9 Exkurs: Was sind Observables? Teil 2

Zweiter Teil zu den Observables in Angular.

6 Min. mit Arbeitsdatei

Services/Wikipedia-Projekt

Webseiten und Apps entwickeln mit Angular - 7.1 Projekt: Wikipedia-API abfragen Teil 1

In diesem Abschnitt des Trainings zu Angular gehen wir ein Wikipedia-Projekt an. Hier die Einleitung dazu.

16 Min. mit Arbeitsdatei Kostenlos

Webseiten und Apps entwickeln mit Angular - 7.2 Projekt: Wikipedia-API abfragen Teil 2

Zweiter Teil zu unserem Projekt „Wikipedia-API abfragen“.

11 Min.

Webseiten und Apps entwickeln mit Angular - 7.3 Projekt: Wikipedia-API abfragen Teil 3

Dritter Teil zu unserem Projekt „Wikipedia-API abfragen“.

7 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 7.4 Projekt: Wikipedia-API abfragen Teil 4

Vierter Teil zu unserem Projekt „Wikipedia-API abfragen“.

14 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 7.5 Projekt: Wikipedia-API abfragen Teil 5

Fünfter Teil zu unserem Projekt „Wikipedia-API abfragen“.

6 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 7.6 Projekt: Wikipedia-API abfragen Teil 6

Sechster Teil zu unserem Projekt „Wikipedia-API abfragen“.

7 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 7.7 Projekt: Wikipedia-API abfragen Teil 7

Siebter Teil zu unserem Projekt „Wikipedia-API abfragen“.

17 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 7.8 Projekt: Wikipedia-API abfragen Teil 8

Achter Teil zu unserem Projekt „Wikipedia-API abfragen“.

17 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 7.9 Projekt: Wikipedia-API abfragen Teil 9

Neunter und letzter Teil zu unserem Projekt „Wikipedia-API abfragen“.

16 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 7.10 Exkurs: JSONP vs. HTTP

Wagen wir noch einen Blick auf den Vergleich zwischen JSONP und HTTP.

7 Min. mit Arbeitsdatei

Pipes

Webseiten und Apps entwickeln mit Angular - 8.1 Pipes in Angular

Hier geht es um Pipes in Angular.

4 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 8.2 Eigene Pipe programmieren

So programmierst du eine Pipe.

13 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 8.3 Die Async-Pipe

Die Async-Pipe.

11 Min. mit Arbeitsdatei

Express + Angular

Webseiten und Apps entwickeln mit Angular - 9.1 Überblick: Projekt Express + Angular

In diesem Kapitel soll es darum gehen, Angular und Express zu kombinieren. Starten wir mit einem kleinen Überblick zum Projekt.

3 Min.

Webseiten und Apps entwickeln mit Angular - 9.2 Einrichtung des Express-Servers

Hier erkläre ich dir, wie du den Express-Server einrichtest.

11 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 9.3 Angular einrichten Teil 1

Nach dem Express-Server richten wir nun auch Angular ein.

13 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 9.4 Angular einrichten Teil 2

Weiter geht es mit der Einrichtung von Angular.

7 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 9.5 Angular einrichten Teil 3

Noch einmal richten wir Angular ein, dieses Mal in Hinblick auf TypeScript.

8 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 9.6 Angular einrichten Teil 4

Angular muss auch bezüglich Typings eingerichtet werden.

7 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 9.7 Angular einrichten Teil 5

Und noch ein paar abschließende Bemerkungen zum Einrichten von Angular.

8 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 9.8 Einbau von LiveReload

Jetzt bauen wir LiveReload ein.

7 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 9.9 To-do-Service erstellen

In diesem Tutorial geht es um den To-do-Service.

9 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 9.10 Daten vom Server laden

Laden wir die Daten vom Server – wie das funktioniert, erfährst du in diesem Tutorial.

8 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 9.11 Daten anzeigen

Nun können wir uns die Daten auch anzeigen lassen.

6 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 9.12 Neuen Eintrag erstellen (Angular)

So erstellst du einen neuen Eintrag – Angular.

13 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 9.13 Neuen Eintrag erstellen (Server)

So erstellst du einen neuen Eintrag – Server.

8 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 9.14 To-do-App fertigstellen

In diesem Tutorial nehmen wir an der To-do-App den letzten Feinschliff vor.

11 Min. mit Arbeitsdatei

Exkurs: Ionic/App-Entwicklung mit Angular

Webseiten und Apps entwickeln mit Angular - 10.1 Einführung

Zum Ende des Trainings hin möchte ich dir noch ein weiteres, ganz konkretes Beispiel mit auf den Weg geben. Hier die Einführung zur App-Entwicklung.

3 Min.

Webseiten und Apps entwickeln mit Angular - 10.2 Installation

In diesem Video geht es um die Installation.

11 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 10.3 Erste Schritte

In diesem Tutorial zeige ich dir die ersten Schritte.

10 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 10.4 Entwicklung einer einfachen App

So entwickelst du eine einfache App.

14 Min. mit Arbeitsdatei

Webseiten und Apps entwickeln mit Angular - 10.5 Wie geht es jetzt weiter?

Bleibt noch eine Frage offen: Wie geht es weiter? Dazu ein paar Bemerkungen in diesem Tutorial.

2 Min.

Schlusswort

Webseiten und Apps entwickeln mit Angular - 11 Schlusswort

Ich hoffe, du konntest dir aus dem Angular-Training vieles mitnehmen. Zum Abschied ein Schlusswort.

2 Min.

Diese Inhalte könnten dich ebenfalls interessieren

Wir sind auf der Suche nach interessanten Trainings für dich, bitte gib uns einen Moment.

Top