Packt

Front-End Web Developer Bootcamp - HTML, CSS, JS, & React

Holen Sie sich eines unserer besten Angebote und erweitern Sie Ihre Fähigkeiten mit 50% Rabatt auf Coursera Plus. Jetzt sparen.

Packt

Front-End Web Developer Bootcamp - HTML, CSS, JS, & React

Bei Coursera Plus enthalten

Fragen Sie Coursera

Verschaffen Sie sich einen Einblick in ein Thema und lernen Sie die Grundlagen.
Stufe Anfänger

Empfohlene Erfahrung

2 Wochen zu vervollständigen
unter 10 Stunden pro Woche
Flexibler Zeitplan
In Ihrem eigenen Lerntempo lernen
Verschaffen Sie sich einen Einblick in ein Thema und lernen Sie die Grundlagen.
Stufe Anfänger

Empfohlene Erfahrung

2 Wochen zu vervollständigen
unter 10 Stunden pro Woche
Flexibler Zeitplan
In Ihrem eigenen Lerntempo lernen

Was Sie lernen werden

  • Erfahren Sie, wie Sie Webseiten mit HTML5 und CSS3 strukturieren und gestalten

  • Sammeln Sie praktische Erfahrungen mit JavaScript und React bei der Entwicklung interaktiver Benutzeroberflächen

  • Lernen Sie die Techniken des responsiven Designs mithilfe von CSS3-Medienabfragen, Flexbox und Grid

  • Lernen Sie, wie man mit APIs arbeitet und dynamische, datengesteuerte Webanwendungen entwickelt

Kompetenzen, die Sie erwerben

  • Kategorie: Front-End-Webentwicklung
  • Kategorie: React.js
  • Kategorie: Reaktionsfähiges Web-Design
  • Kategorie: Ereignisgesteuerte Programmierung
  • Kategorie: Web-Design
  • Kategorie: HTML und CSS
  • Kategorie: Javascript
  • Kategorie: Web-Entwicklung

Werkzeuge, die Sie lernen werden

  • Kategorie: Restful API
  • Kategorie: Hypertext Markup Language (HTML)
  • Kategorie: JavaScript-Frameworks
  • Kategorie: Cascading Style Sheets (CSS)
  • Kategorie: UI-Komponenten

Wichtige Details

Zertifikat zur Vorlage

Zu Ihrem LinkedIn-Profil hinzufügen

Kürzlich aktualisiert!

Februar 2026

Bewertungen

35 Aufgaben

Unterrichtet in Englisch

Erfahren Sie, wie Mitarbeiter führender Unternehmen gefragte Kompetenzen erwerben.

 Logos von Petrobras, TATA, Danone, Capgemini, P&G und L'Oreal

In diesem Kurs gibt es 35 Module

In diesem Modul stellen wir Ihnen HTML5 und seine Rolle in der modernen Webentwicklung vor. Sie lernen die leistungsstarken Funktionen kennen, darunter semantische Tags, Multimedia-Unterstützung und Verbesserungen bei Formularen. Außerdem erfahren Sie, wie Sie die richtigen Tools wie Visual Studio Code einrichten, um mit dem Programmieren in HTML5 zu beginnen.

Das ist alles enthalten

6 Videos1 Lektüre

In diesem Modul werden wir uns mit dem grundlegenden Aufbau einer HTML5-Datei befassen, einschließlich der Abschnitte „DOCTYPE“, „head“ und „body“. Sie lernen, wie Sie HTML-Projekte und Dateistrukturen effizienter organisieren können. Am Ende werden Sie in der Lage sein, gut strukturierte HTML-Dateien zu erstellen.

Das ist alles enthalten

4 Videos1 Aufgabe

In diesem Modul beschäftigen wir uns eingehend mit den wesentlichen Bausteinen von HTML5, wie beispielsweise Überschriften-Tags, Zitate und Quellenangaben-Tags. Außerdem erhalten Sie Einblicke in die Verwendung von HTML-Attributen zur Anpassung von Elementen und lernen verschiedene Möglichkeiten kennen, HTML-Inhalte zu gestalten.

Das ist alles enthalten

5 Videos1 Aufgabe

In diesem Modul behandeln wir verschiedene wichtige HTML5-Tags, von Anker- und Bild-Tags bis hin zu Listen-, Tabellen-, Video- und Audio-Tags. Sie lernen, wie Sie Inhalte – seien es Texte, Multimedia-Inhalte oder Daten – strukturieren und präsentieren, um eine bessere Barrierefreiheit und Funktionalität zu gewährleisten.

Das ist alles enthalten

8 Videos1 Aufgabe

In diesem Modul führen wir Sie Schritt für Schritt durch den Prozess der Erstellung eines HTML5-Formulars von Grund auf. Sie lernen verschiedene Eingabetypen, Attribute und Validierungstechniken kennen, um eine korrekte Datenübermittlung durch die Benutzer sicherzustellen.

Das ist alles enthalten

5 Videos1 Aufgabe

In diesem Modul werden wir uns mit den Unterschieden zwischen Block- und Inline-Elementen in HTML befassen. Sie erfahren, wie sich diese Elemente auf das Seitenlayout auswirken und wie Sie sie einsetzen können, um Inhalte effizient zu strukturieren.

Das ist alles enthalten

2 Videos1 Aufgabe

In diesem abschließenden Modul werden wir die wichtigsten Konzepte von HTML5, die im gesamten Abschnitt behandelt wurden, noch einmal zusammenfassen. Sie werden ein tieferes Verständnis dafür gewinnen, welche Bedeutung HTML5 für die Erstellung gut strukturierter und dynamischer Webseiten hat.

Das ist alles enthalten

1 Video1 Aufgabe

In diesem Modul führen wir Sie in CSS3 und dessen entscheidende Rolle bei der Optimierung des Webdesigns ein. Sie werden ein Verständnis für die CSS3-Syntax entwickeln und lernen, wie Sie damit verschiedene Aspekte Ihrer Webseite gestalten können – vom Layout bis zur Typografie.

Das ist alles enthalten

5 Videos1 Aufgabe

In diesem Modul konzentrieren wir uns auf grundlegende CSS3-Eigenschaften, mit denen sich das Erscheinungsbild und die Abstände von Elementen steuern lassen. Sie lernen, wie Sie Hintergründe, Rahmen und Abmessungen festlegen, sodass Sie das Layout und die Abstände Ihrer Webseite ganz nach Ihren Vorstellungen gestalten können.

Das ist alles enthalten

5 Videos1 Aufgabe

In diesem Modul werden wir uns mit den Typografie-Eigenschaften von CSS3 befassen. Sie lernen, wie Sie die Textausrichtung steuern, Verzierungen anwenden und Text transformieren können, um dessen Erscheinungsbild und Lesbarkeit auf Ihren Webseiten zu verbessern.

Das ist alles enthalten

6 Videos1 Aufgabe

In diesem Modul beschäftigen wir uns eingehend mit fortgeschrittenen CSS3-Selektoren und -Eigenschaften. Sie lernen, wie Sie das Layout und die Sichtbarkeit von Elementen beeinflussen sowie Pseudoklassen und Pseudoelemente anwenden können, um interaktive, gestaltete Inhalte zu erstellen.

Das ist alles enthalten

9 Videos1 Aufgabe

In diesem Modul behandeln wir zusätzliche CSS3-Funktionen, mit denen Sie das Erscheinungsbild Ihrer Website aufwerten können. Sie lernen, wie Sie Deckkraft, abgerundete Ecken und Schatteneffekte einsetzen, um visuell ansprechende Designs mit modernem Flair zu gestalten.

Das ist alles enthalten

3 Videos1 Aufgabe

In diesem Modul vermitteln wir Ihnen die Grundlagen des responsiven Designs mit CSS3. Sie lernen die leistungsstarken Werkzeuge von CSS Grid und Flexbox kennen und erfahren, wie Sie Medienabfragen einsetzen, um Websites zu gestalten, die sich an unterschiedliche Bildschirmgrößen und Geräte anpassen.

Das ist alles enthalten

3 Videos1 Aufgabe

In diesem Modul arbeiten Sie an einem Mini-Projekt, um die Kenntnisse, die Sie in HTML5 und CSS3 erworben haben, in die Praxis umzusetzen. Diese praktischen Übungen werden Ihnen helfen, Ihr Verständnis für die Erstellung und Gestaltung dynamischer Webseiten zu vertiefen.

Das ist alles enthalten

1 Video1 Aufgabe

In diesem Modul geben wir Ihnen einen Einblick in JavaScript, seine Geschichte und seine entscheidende Rolle in der Webentwicklung. Sie lernen die Grundlagen der JavaScript-Syntax und die Datentypen kennen und erfahren, wie Sie JavaScript in Ihre HTML-Dateien einbinden können, um dynamische Funktionen zu realisieren.

Das ist alles enthalten

4 Videos1 Aufgabe

In diesem Modul beschäftigen Sie sich eingehend mit Variablen in JavaScript und lernen, wie man sie deklariert, initialisiert und bearbeitet. Außerdem erfahren Sie, wie Sie `console.log` zum Debuggen und Überprüfen Ihres Codes einsetzen können.

Das ist alles enthalten

3 Videos1 Aufgabe

In diesem Modul lernen Sie, wie Sie verschiedene Kontrollstrukturen in JavaScript verwenden, darunter bedingte Anweisungen und Schleifen. Sie werden sich mit der Syntax und der Anwendung von if-Anweisungen, ternären Operatoren sowie break und continue zur Steuerung des Programmablaufs befassen.

Das ist alles enthalten

7 Videos1 Aufgabe

In diesem Modul werden wir uns mit den verschiedenen in JavaScript verfügbaren Operatoren befassen. Sie lernen, mathematische Operationen durchzuführen, Variablen Werte zuzuweisen und diese für bedingte Auswertungen zu vergleichen.

Das ist alles enthalten

3 Videos1 Aufgabe

In diesem Modul lernen Sie verschiedene Arten von Popup-Fenstern in JavaScript kennen. Sie erfahren, wie Sie interaktive Warn-, Bestätigungs- und Eingabefenster erstellen, die Feedback geben und Benutzereingaben erfassen.

Das ist alles enthalten

6 Videos1 Aufgabe

In diesem Modul werden wir uns damit befassen, wie Ereignisse in JavaScript funktionieren. Sie lernen, wie Sie Ereignis-Listener an HTML-Elemente anhängen und auf Benutzeraktionen wie Klicks, Tastendrücke und Mausbewegungen reagieren können.

Das ist alles enthalten

1 Video1 Aufgabe

In diesem Modul lernen Sie JavaScript-Schleifen wie „while“, „do-while“ und „for“ kennen. Außerdem erfahren Sie, wie Sie verschachtelte Schleifen einsetzen können, um komplexe Datenstrukturen effektiv zu verarbeiten.

Das ist alles enthalten

4 Videos1 Aufgabe

In diesem Modul beschäftigen wir uns mit Arrays in JavaScript. Sie lernen, wie man Arrays erstellt und bearbeitet, leistungsstarke Array-Methoden zum Sortieren, Umkehren und Filtern einsetzt und mit integrierten Funktionen wie forEach() und map() die Elemente eines Arrays durchläuft.

Das ist alles enthalten

15 Videos1 Aufgabe

In diesem Modul werden wir Objekte in JavaScript vorstellen. Sie lernen, wie man Objekte definiert, auf deren Eigenschaften zugreift und sie mithilfe der for-in-Schleife durchläuft, während Sie gleichzeitig die Möglichkeiten der objektorientierten Programmierung in JavaScript erkunden.

Das ist alles enthalten

3 Videos1 Aufgabe

In diesem Modul lernen Sie, wie man Zeichenfolgen in JavaScript bearbeitet. Sie lernen grundlegende und fortgeschrittene Methoden zur Bearbeitung von Zeichenfolgen kennen, mit denen Sie Textdaten effizient suchen, ersetzen, zerlegen und ändern können.

Das ist alles enthalten

3 Videos1 Aufgabe

In diesem Modul lernen Sie die in JavaScript integrierten Zahlen- und Mathematikmethoden kennen. Sie lernen, wie Sie Zahlen und Datumsangaben überprüfen, bearbeiten und formatieren, und erwerben so die Fähigkeit, komplexe Berechnungen durchzuführen und Datums- und Zeitangaben in Ihren Projekten effizient zu verarbeiten.

Das ist alles enthalten

4 Videos1 Aufgabe

In diesem Modul lernen Sie das DOM und dessen Rolle in der Webentwicklung kennen. Sie erfahren, wie Sie mit JavaScript dynamisch auf HTML-Elemente und deren Attribute zugreifen, diese bearbeiten und ändern können.

Das ist alles enthalten

14 Videos1 Aufgabe

In diesem abschließenden Modul fassen wir die wichtigsten Core-JavaScript-Konzepte zusammen, die wir im Laufe des Kurses behandelt haben. Sie werden sich damit auseinandersetzen, wie Sie JavaScript effektiv mit HTML und dem DOM kombinieren können, um dynamische, interaktive Webseiten zu erstellen.

Das ist alles enthalten

1 Video1 Aufgabe

In diesem Modul stellen wir Ihnen React.JS und dessen komponentenbasierten Ansatz zur Erstellung von Benutzeroberflächen vor. Sie werden verstehen, wie React die Entwicklung vereinfacht und mithilfe des virtuellen DOM die Leistung verbessert.

Das ist alles enthalten

3 Videos1 Aufgabe

In diesem Modul lernen Sie verschiedene Möglichkeiten kennen, React-Komponenten zu gestalten. Außerdem erfahren Sie, wie Sie mithilfe von Props dynamische, wiederverwendbare Komponenten erstellen und wie Sie mit Template-Literalen dynamische Inhalte in JSX verarbeiten können.

Das ist alles enthalten

5 Videos1 Aufgabe

In diesem Modul werden wir uns eingehend mit dem Konzept der Komponentenhierarchie in React befassen. Du lernst, wie du den Zustand von Komponenten verwaltest, Komponenten bedingt renderst und den `useEffect`-Hook nutzt, um Lebenszyklusereignisse und Nebeneffekte zu handhaben.

Das ist alles enthalten

3 Videos1 Aufgabe

In diesem Modul lernst du React Router DOM kennen und erfährst, wie es dir bei der Verwaltung von Routen in React-Anwendungen hilft. Du wirst Techniken zur Navigation zwischen Seiten, zur Fehlerbehandlung und zur Optimierung der Routing-Struktur deiner App kennenlernen.

Das ist alles enthalten

4 Videos1 Aufgabe

In diesem Modul arbeiten Sie an der Erstellung eines vollständigen React-Projekts und wenden dabei alles an, was Sie bisher gelernt haben. Der Schwerpunkt liegt dabei auf zentralen Funktionen wie State-Management, Kommunikation zwischen Komponenten und dynamischem Rendering.

Das ist alles enthalten

2 Videos1 Aufgabe

In diesem Modul erstellen Sie mithilfe von React eine voll funktionsfähige Taschenrechner-App. Sie werden grundlegende arithmetische Operationen implementieren, Benutzereingaben verarbeiten und fortgeschrittene Funktionen wie Dezimalberechnungen und Fehlerbehandlung einführen.

Das ist alles enthalten

2 Videos1 Aufgabe

In diesem Modul lernen Sie, wie Sie eine RESTful-API in React erstellen. Sie lernen, wie Sie mit Axios Daten dynamisch abrufen, die Paginierung handhaben und mit fortgeschrittenen API-Funktionen wie Authentifizierung und CRUD-Operationen arbeiten.

Das ist alles enthalten

5 Videos1 Aufgabe

In diesem abschließenden Modul werden wir die wichtigsten Konzepte zusammenfassen, die wir im gesamten React-Abschnitt gelernt haben. Du wirst dann in der Lage sein, React in realen Projekten anzuwenden, und verfügst über eine solide Grundlage, um dich mit fortgeschritteneren Themen der React-Entwicklung auseinanderzusetzen.

Das ist alles enthalten

1 Video2 Aufgaben

Dozent

Packt - Course Instructors
Packt
1.946 Kurse573.323 Lernende

von

Packt

Warum entscheiden sich Menschen für Coursera für ihre Karriere?

Felipe M.

Lernender seit 2018
„Es ist eine großartige Erfahrung, in meinem eigenen Tempo zu lernen. Ich kann lernen, wenn ich Zeit und Nerven dazu habe.“

Jennifer J.

Lernender seit 2020
„Bei einem spannenden neuen Projekt konnte ich die neuen Kenntnisse und Kompetenzen aus den Kursen direkt bei der Arbeit anwenden.“

Larry W.

Lernender seit 2021
„Wenn mir Kurse zu Themen fehlen, die meine Universität nicht anbietet, ist Coursera mit die beste Alternative.“

Chaitanya A.

„Man lernt nicht nur, um bei der Arbeit besser zu werden. Es geht noch um viel mehr. Bei Coursera kann ich ohne Grenzen lernen.“

Häufig gestellte Fragen