React-Praxiskurs: Die Grundlagen
Stephan Haewß
Ve esta clase y miles más
Ve esta clase y miles más
Lecciones en esta clase
-
-
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
-
-
- --
- Nivel principiante
- Nivel intermedio
- Nivel avanzado
- Todos los niveles
Generado por la comunidad
El nivel se determina según la opinión de la mayoría de los estudiantes que han dejado reseñas en esta clase. La recomendación del profesor o de la profesora se muestra hasta que se recopilen al menos 5 reseñas de estudiantes.
21
Estudiantes
--
Proyectos
Acerca de esta clase
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.
Proyecto de clase práctica
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.
Valoración de la clase
¿Por qué unirse a Skillshare?
Mira las galardonadas Skillshare Originals
Cada clase tiene lecciones cortas y proyectos prácticos
Tu membresía apoya a los profesores de Skillshare
Aprende desde cualquier lugar
Ve clases sobre la marcha con la aplicación de Skillshare. Progresa en línea o descarga las clases para verlas en el avión, el metro o donde sea que aprendas mejor.
Clases relacionadas
