Kurs Front-End (Angular)

HTML5 + CSS3 + JS = NaN?

Jetzt mit Rabatt!

Kursleiter

Mykola Digtiar
Mykola Digtiar
Senior Software Engineer
5+ Jahre im IT-Bereich.
Arbeitet bei Trade Republic.
Spielt Tischtennis und trinkt nachts gerne Kaffee.

Über den Kurs

Die Front-End-Entwicklung ist einer der gefragtesten Bereiche in der heutigen IT-Branche! Jede Website, Webanwendung und mobile App braucht ein "Gesicht", das auf allen möglichen Geräten, vom Heimcomputer bis zum Smartphone, richtig funktioniert. Es sind die Front-End-Entwickler, die ein Design-Layout in eine "lebendige" Website verwandeln. Alles, was Sie auf einer Website oder einer mobilen App sehen, wird als Benutzeroberfläche bezeichnet. Front-End-Entwickler verwenden Softwarecode und Auszeichnungssprachen, um die kreativen Ideen von Webdesignern zum Leben zu erwecken!

Bei ihrer Arbeit verwenden Front-End-Entwickler: die Auszeichnungssprache HTML, Cascading Style Sheets CSS, die Programmiersprache JavaScript und die damit verbundenen Frameworks.

Deshalb gehen wir in der Online-Schulung auf die Untersuchung jedes dieser Blöcke im Detail ein.

Eine der beliebtesten und am meisten nachgefragten Bibliotheken für die Front-End-Entwicklung ist derzeit Angular. Mit Hilfe dieser Bibliothek können Sie nicht nur schnelle und funktionsreiche Websites, sondern auch mobile Anwendungen erstellen. Wir werden in diesem Kurs mehr über die Funktionen dieser Bibliothek erfahren!

Der Kurs ist ideal geeignet für

Diejenigen, die lernen wollen, wie man Websites erstellt face-1
Web Designers face-2
Graphic Designers face-3
Content Managers face-4

Kursprogramm Front-End (Angular)

Modul 1: Layout

Einführung in HTML.
  • Die Rolle des Front-End in der IT-Welt. Interaktion zwischen dem "Front-End" und dem "Back-End" und dem Designer.
  • Etappen des Projektlebens.
  • Entwicklungswerkzeuge (Code-Editor, Photoshop, devTools).
  • Rendering der Seite.
  • Die Grundprinzipien des Layouts. Cross-Browser und Gültigkeit - was ist das und warum ist es wichtig.
  • Browser.
  • Die Struktur eines HTML-Dokuments.
  • Blockbeziehungen: verschachtelt, Kind, Nachbar, Elternteil.
Einführung in CSS.
  • Was ist CSS.
  • Möglichkeiten zur Festlegung von Stilen.
  • CSS-Selektoren.
  • Kaskadierung ("Gewicht" von Selektoren).
  • Kombinieren und Gruppieren von Selektoren. Selektor-Hierarchie. Vererbung.
  • Eingebaute Browser-Stile. CSS zurücksetzen.
  • Das Blockmodell.
  • Die Eigenschaft border.
  • Die display-Eigenschaft.
  • Die float-Eigenschaft.
  • Die Overflow-Eigenschaft.
  • Die Übergangseigenschaft.
  • Die Eigenschaft transform.
  • Animation mit CSS3.
  • Positionierung.
  • CSS3 Flexbox.
Responsive Design.
  • Der Unterschied zwischen adaptivem Design und responsivem Design.
  • Arten von "Geräten".
  • CSS-Tools und Einstellungen für Responsive Design.
  • CSS-Medienabfragen.
  • CSS Haltepunkte (Kontrollpunkte).
  • Navigation auf der Website.
  • Pixelgenaues Design.
Praktisches Layout.
  • Soziale Netzwerke mit SVG-Symbolen.
  • Schriftarten und ihre Verbindung.
  • Praktisches Layout.
Git.
  • Versionskontrollsysteme.
  • Der Befehl init.
  • Dateistatus, Status, add, commit, config, log Befehle.
  • Arbeiten mit einem entfernten Repository (GitHub), SSH-Schlüssel.
  • Grundlegende Befehle.
Linux.
  • Was ist ein Betriebssystem.
  • Automatisierung, Skripting, Netzwerkwerkzeuge (ssh, rsync, ftp, telnet).
  • Netzwerke.
  • Docker.
  • Docker-Komponieren.
Bootstrap.
  • Rahmen. Wie? Und warum?
  • Installieren und Konfigurieren von Bootstrap.
  • Bootstrap-Komponenten.
  • Dienstprogramme.

Modul 2: JavaScript

Was ist JavaScript?
  • ECMAScript.
  • Dokumentenmodell (DOM).
  • Automatische Speicherverwaltung.
  • Fehlen einer strengen Datentypisierung.
  • Fehlen von Eingabe- und Ausgabewerkzeugen.
  • Fehlender Zugriff auf die Funktionen des Betriebssystems.
  • Verarbeitung von Benutzeraktionen und Browser-Ereignissen.
Erste Schritte. JavaScript-Grundlagen.
  • Type casting.
  • Funktionen.
  • Methoden.
  • Einbindung von JavaScript in Web-Seiten.
Datentypen.
  • Number.
  • String.
  • Boolean.
  • Null.
  • Undefined.
  • Object.
  • Array.
String.
  • Erstellen einer Zeichenkette.
  • Zeilenübertragung.
  • Verwendung von Variablen.
  • Zeichen-Escaping.
  • Verkettung und Addition.
  • Array.
  • Methoden.
Number.
  • NaN und Unendlich.
  • Methoden.
  • Mathematik.
Object.
  • Objekte erstellen.
  • Objekte verwenden.
  • Kopieren von Objekten.
  • Die Deskriptoren der Objekteigenschaften.
  • Die Struktur des Deskriptors.
  • Die Objektklasse.
  • Objekt-Prototypen.
  • Vererbung von Prototypen.
Array.
  • Erstellen eines Arrays.
  • Zugriff auf Array-Elemente.
  • Ändern eines Arrays.
  • Array-Methoden.
Variables.
  • Deklaration von Variablen.
  • Benennung der Variablen.
Bedingungsoperatoren.
  • Die if-Bedingungsanweisung.
  • Der Switch-Bedingungsoperator.
  • Ternärer Bedingungsoperator.
Schleifen.
  • Schleife while.
  • Schleife do...while.
  • Schleife for.
  • Schleife for...of.
  • Schleife for...in.
  • Verwendung von continue und break.
Funktionen.
  • Funktionsdeklaration und Funktionsaufruf.
  • Funktionsargumente.
  • Schlüsselwort return.
  • Pfeil-Funktionen.
  • Der Kontext der Funktion.
  • Der Anwendungsbereich einer Funktion.
Datum und Uhrzeit.
  • ISO-Norm für Datum und Uhrzeit.
  • Datumsmethoden.
OOP.
  • Was ist OOP?
  • Klassen in OOP.
  • Assoziationen.
  • Vererbung.
  • Überladen.
  • Ungeeignete Verwendung.
  • Abstrakte Klassen.
  • Polymorphismus.
  • Verkapselung.
  • Accessoren (Getter und Setter).
  • Abstraktion.
  • Grad der Abstraktion.
Schließung. Timers.
  • setTimeout().
  • setInterval().
  • setImmediate().
DOM.
  • DOM-Elemente abrufen.
  • Ändern von DOM-Elementen.
  • Löschen von Elementen aus dem DOM.
Local Storage und Session Storage.
  • Promise - async /await.
  • Exceptions.
  • Fetch API.
  • Objekt window.

Modul 3: Angular

Einführung in Angular
  • Kennenlernen des Frameworks
  • Die wichtigsten Vorteile
  • Kennenlernen und Arbeiten mit TypeScript
Erste Angular-Anwendung
  • Struktur des Frameworks
  • Beschreibung und Funktionalität der Hauptmodule
  • Arbeit mit CLI
  • Wie man Variablen und Funktionen anfügt
Grundlagen der Arbeit mit DOM in Angular
  • Komponenten
  • Direktiven
  • Pipes
  • Templates
  • Grundlagen der Erstellung von Angular-Webkomponenten - Angular-Elemente
Grundlagen der Arbeit mit Daten in Angular
  • Dekorateure
  • Dienste
  • Datenbindung
  • Datenspeicherung
  • Interaktion zwischen den Komponenten
  • Arbeit mit HttpClient
Arbeit mit Formularen in Angular
  • Formulare in Angular
  • Validierung und Anpassung von Formularen
  • Erfassung von Daten aus verschiedenen Formulartypen
  • Reaktive Formen
Wichtige Lebenszyklen der Anwendung
  • ngOnChanges, ngOnInit, ngDoCheck, ngAfterContentInit, ngAfterContentChecked, ngAfterViewInit, ngAfterViewChecked, ngOnDestroy
  • constructor
Grundlagen der Arbeit mit HTTP
  • Aufgliederung des HttpClient-API-Moduls
  • Schnittstellen für die Arbeit mit allen Methoden von HTTP-Anfragen
  • Serveranfragen mit Promises
  • Kurze Einführung in Observables

Modul 4: Diplomarbeit

Beschreibung.
  • Die Diplomarbeit umfasst die Erstellung der Website. Die Website muss enthalten: Registrierung und Anmeldung, ein individuelles Konto (je nach dem spezifischen Projekt), Routing, sicheres Routing in Gegenwart von Rollen auf der Rückseite, Download-Dateien, die strukturelle Gestaltung des Codes auf der Festplatte, einer der Rahmen oder ihr eigenes Layout: Bootstrap, Ameisen-Design. Strukturiertes Layout, Aufschlüsselung in Komponenten im Wesentlichen. Storage, Redux + mehrere redusers, Server-seitige Interaktion und lange Skripte: actionCreator + Thunk oder Saga, Backend-Arbeit.
Verteidigung des Projekts.
  • Es ist notwendig, die Praxis zu bestehen, die eine Demonstration des Arbeitsprojekts, Antworten auf alle Fragen im Zusammenhang mit dem Projekt, eine Demonstration des Codes auf Anfrage bietet. Und separat wird die Theorie zum gesamten Kursprogramm und zu allen Themen bestanden. Die Theorie wird in Form eines Bewerbungsgesprächs für eine Stelle als Junior Developer vor einem externen, unabhängigen Experten abgelegt. Sie können für beide Blöcke zwischen 0 und 100 Punkten erhalten.

Ihr Lebenslauf nach Abschluss des Kurses

Junior Front-End Developer
Gehalt von
45 000 Euro pro Jahr

Berufliche Kompetenzen:
  • HTML & CSS
  • Adaptive + Responsive designs
  • Git
  • JavaScript (DOM API, ES6+)
  • REST API
  • ReactJS
  • KISS, DRY, SOLID
  • SCSS, SASS
  • TypeScript
  • AJAX & HTTP
  • ООП

So sieht Ihr elektronisches Zertifikat aus

Sie können diese Bescheinigung Ihrem Lebenslauf beifügen
Certificate Front-End (Angular)

Tools, die Sie beherrschen werden

HTML
CSS
Bootstrap
JavaScript
Git
GitHub
Linux
Angular
CodePen
HTML
Eine Auszeichnungssprache für Hypertext-Seiten, die verwendet wird, um Dokumente für die Anzeige von Webseiten in einem Browser auszuzeichnen. Sie wird verwendet, um dem Browser mitzuteilen, wie eine geladene Website oder Seite angezeigt werden soll.
CSS
CSS (Cascading Style Sheets) ist eine Sprache zur Beschreibung des Erscheinungsbildes von Dokumenten, die mit einer Auszeichnungssprache geschrieben wurden. Sie wird in der Regel verwendet, um das Aussehen von Webseiten zu beschreiben, die in der Auszeichnungssprache HTML geschrieben wurden.
Bootstrap
Bootstrap ist ein kostenloses Toolkit für die Erstellung von Websites und Webanwendungen. Es enthält HTML- und CSS-Designvorlagen für Typografie, Webformulare, Schaltflächen, Beschriftungen, Navigationsboxen und andere Webschnittstellenkomponenten, einschließlich JavaScript-Erweiterungen.
JavaScript
JavaScript ist eine mehrparadigmatische Programmiersprache. Sie unterstützt objektorientierte, imperative und funktionale Stile. Es handelt sich um eine Implementierung der ECMAScript-Spezifikation. JavaScript wird normalerweise als eingebettete Sprache für den programmatischen Zugriff auf Anwendungsobjekte verwendet.
Git
Git ist ein verteiltes Versionskontrollsystem, mit dem Sie den Verlauf der Softwareentwicklung nachverfolgen und von jedem Ort der Welt aus an komplexen Projekten mitarbeiten können.
GitHub
GitHub ist ein Online-Code-Speicher- und Synchronisierungsdienst für Programmierer und Anwendungsentwickler. Der Hauptzweck dieses Dienstes ist die Unterstützung der gemeinschaftlichen Projektentwicklung und Versionskontrolle.
Linux
Linux ist eine Familie von Betriebssystemen (OS), die auf dem gleichnamigen Kernel basieren. Es gibt kein einzelnes Linux-Betriebssystem wie Windows oder MacOS. Es gibt viele Distributionen (eine Reihe von Dateien, die zur Installation von Software benötigt werden), die bestimmte Aufgaben erfüllen.
Angular
Angular ist ein von Google entwickelter Open-Source-Frontend-Framework für die effiziente Entwicklung von dynamischen und skalierbaren Single-Page-Anwendungen. Mit Funktionen wie deklarativer Benutzeroberfläche, bidirektionaler Datenbindung und modularer Architektur erleichtert Angular die Entwicklung, fördert die Codeorganisation und verbessert die Wartbarkeit. Seine leistungsstarken Tools, darunter die Dependency Injection und ein integrierter Router, machen es zu einer beliebten Wahl für die Erstellung robuster und funktionsreicher clientseitiger Anwendungen.
CodePen
CodePen ist eine Online-Community zum Testen und Anzeigen von HTML-, CSS- und JavaScript-basierten Snippets. Die Community wurde 2012 von den Entwicklern Alex Vazquez, Tim Sabat und dem Webdesigner Chris Coyer gegründet.

Gehaltserwartungen

Die Möglichkeit der beruflichen Weiterentwicklung mit einem Anstieg der Gehälter zieht neue Fachkräfte im IT-Bereich wie ein Magnet an.

Um ein Einkommen von 85.000 Euro (brutto) pro Jahr oder mehr zu erreichen, müssen Sie vom Junior zum Senior aufsteigen. Und dieser Weg kann ziemlich schnell sein - es hängt alles von Ihnen ab!
Junior
4000 Euro / Monat
Middle
5500 Euro / Monat
Senior
7000 Euro / Monat
Für die Junior-Stelle reicht ein Monatsgehalt von 4000 Euro (brutto) für die gesamte sechsmonatige Ausbildung in unserem Kurs. Sie werden Ihr Geld sehr schnell zurückbekommen!
Erfahrung: Anfänger
Wenn Sie zum Middle Specialist heranwachsen, wird Ihr Gehalt ab 5500 Euro (brutto) pro Monat und darüber liegen! Dieses Ergebnis können Sie nur nach 2 Jahren harter Arbeit und ständiger Selbstentwicklung erreichen.
Erfahrung: 2-3 Jahre
Senior ist eine Fachkraft, die ab 7.000 Euro (brutto) pro Monat verdient - je nach Art des Unternehmens, Erfahrung und Ihren Zielen. Nur Ihr Ehrgeiz bestimmt die Obergrenze Ihres Verdienstes und Ihrer Karriereleiter - bleiben Sie also nicht stehen!
Erfahrung: 4-5 Jahre

Kontakt

Wir werden Ihnen helfen, Sie informieren und Ihre Richtung in der IT finden.
Bewerben Sie sich für eine kostenlose Beratung oder melden Sie sich für einen Kurs an.

Administrator

Nikita

Telefon

+49 152 5263 7381

E-Mail

hello@codillas.academy

Fertig!

Herzlichen Glückwunsch! Sie haben sich erfolgreich für unsere kostenlose Beratung angemeldet. Unser Team wird sich in Kürze mit weiteren Details bei Ihnen melden. Machen Sie sich bereit, Ihre IT-Kenntnisse und Fähigkeiten mit uns von der Codillas Academy zu erweitern!

Oh nein!

Wir entschuldigen uns für die Unannehmlichkeiten. Bei der Übermittlung Ihres Kontaktformulars für die kostenlose Beratung ist ein Fehler aufgetreten. Bitte überprüfen Sie Ihre Angaben und versuchen Sie es erneut. Wenn Sie Hilfe benötigen, wenden Sie sich bitte an unser Support-Team unter info@codillas.com. Wir danken Ihnen für Ihr Verständnis und freuen uns darauf, Sie auf Ihrer IT-Lernreise zu unterstützen.

Melden Sie sich für einen IT-Kurs an

Wir werden Ihnen helfen, Sie informieren und Ihre Richtung in der IT finden.
Bewerben Sie sich für eine kostenlose Beratung oder melden Sie sich für einen Kurs an.

Administrator

Nikita

Telefon

+49 152 5263 7381

E-Mail

hello@codillas.academy

Fertig!

Herzlichen Glückwunsch! Sie haben sich erfolgreich für unseren IT-Kurs angemeldet. Unser Team wird sich in Kürze mit weiteren Details bei Ihnen melden. Machen Sie sich bereit, Ihre IT-Kenntnisse und Fähigkeiten bei uns in der Codillas Academy zu erweitern!

Oh nein!

Wir entschuldigen uns für die Unannehmlichkeiten. Bei der Übermittlung Ihres Kontaktformulars für den IT-Kurs ist ein Fehler aufgetreten. Bitte überprüfen Sie Ihre Angaben und versuchen Sie es erneut. Wenn Sie Hilfe benötigen, wenden Sie sich bitte an unser Support-Team unter info@codillas.com. Wir danken Ihnen für Ihr Verständnis und freuen uns darauf, Sie auf Ihrer IT-Lernreise zu unterstützen.