React-Praxiskurs: Die Grundlagen
Stephan Haewß
Assista a este curso e milhares de outros
Assista a este curso e milhares de outros
Aulas neste curso
-
-
1.
Intro und worum geht es?
2:53
-
2.
Einrichtung der Entwicklungsumgebung
15:40
-
3.
Anatomie einer React App
10:46
-
4.
Exkurs ES6 Module
26:13
-
5.
JSX-Grundlagen
20:02
-
6.
Komponenten selbst schreiben
16:58
-
7.
JavaScript Ausdrücke in JSX
15:20
-
8.
Zustand speichern mit useStae
36:14
-
9.
Zählerkomponente mit Props
15:57
-
10.
Eingabefelder und dynamische Props
13:16
-
11.
Grundlegender Aufbau der Todo App
17:46
-
12.
Kommunikation zwischen Kind und Eltern Komponente
16:44
-
13.
Todo als erledigt markieren
19:14
-
14.
Stylen mit Emotion
36:58
-
15.
Gruppieren nach Erledigt Status
17:47
-
16.
Todos löschen
14:07
-
17.
DIVs sparen
4:42
-
18.
Speichern und Laden
17:34
-
19.
useEffect als Mounted Handler
28:40
-
20.
Fazit
11:13
-
-
- --
- Nível iniciante
- Nível intermediário
- Nível avançado
- Todos os níveis
Gerado pela comunidade
O nível é determinado pela opinião da maioria dos estudantes que avaliaram este curso. Mostramos a recomendação do professor até que sejam coletadas as respostas de pelo menos 5 estudantes.
21
Estudantes
--
Sobre este curso
In diesem Kurs werden die Grundlagen der Programmierung von Web-Apps mit dem Framework React erläutert. Nachdem mit einer einfachen Klick-Zähler-App die notwendigen Basics wie JSX, Event-Handler und Props erklärt werden, wird eine einfache aber funktionale Todo-App erstellt. Am Ende des Kurses seid Ihr in der Lage, einfache bis mittelkomplexe React-Apps zu erstellen und Euch die weiterführenden Themen selbst anzueignen.
Projeto prático de curso
Die Projektaufgabe besteht darin, eine Mini-App zu erstellen, die nur eine Komponente enthält, welche aber mindestens den useState-Hook und ein Eingabefeld verwenden soll. Was die App genau macht, könnt Ihr Euch selbst überlegen, hier einige Beispiele:
- Es wird eine Begrüßung mit dem Namen ausgegeben, den man in einem Eingabefeld eingeben kann.
- Es wird zufällig Vor- und Nachname aus einer Listen von vorgegeben Namen erzeugt, die man selbst erweitern kann.
- Taschenrechner: es gibt drei Eingabefelder für Operand 1, Operator und Operand 2, nach Klick auf einen Button wird das Ergebnis ausgegeben
Ihr könnt auch andere Eingabeelemente wie Textarea oder Radio-Button verwenden, schaut in der React-Doku nach, wenn Ihr nicht sicher seid, wie man sie in React verwendet (Formulare in React).
Angehängt habe ich die beiden Apps, die wir im Kurs verwendet haben, so dass Ihr den Code noch einmal nachvollziehen könnt.
Um Eure Mini-Apps in die Projektgalerie hinzuzufügen, könnt Ihr einen Screenshot vom Code der Komponente machen (und von der App-UI im Browser am besten auch).Ich werde Euch dann Feedback zu Euren Projekten geben, Ihr könnt Euch natürlich auch gegenseitig Feedback geben.
Nota do curso
Por que fazer parte da Skillshare?
Faça cursos premiados Skillshare Original
Cada curso possui aulas curtas e projetos práticos
Sua assinatura apoia os professores da Skillshare
Aprenda em qualquer lugar
Faça cursos em qualquer lugar com o aplicativo da Skillshare. Assista no avião, no metrô ou em qualquer lugar que funcione melhor para você, por streaming ou download.
Cursos relacionados
