Wenn Sie sich für diesen Kurs anmelden, werden Sie auch für diese Spezialisierung angemeldet.
Lernen Sie neue Konzepte von Branchenexperten
Gewinnen Sie ein Grundverständnis bestimmter Themen oder Tools
Erwerben Sie berufsrelevante Kompetenzen durch praktische Projekte
Erwerben Sie ein Berufszertifikat zur Vorlage
In diesem Kurs gibt es 6 Module
Lernen Sie React Router v6, die beliebteste Routing-Bibliothek für React-Anwendungen und eine der am häufigsten heruntergeladenen React-Support-Bibliotheken überhaupt. In diesem Kurs lernen Sie die wichtigsten Teile der React Router (v6)-Bibliothek kennen, während Sie eine App namens "VanLife" erstellen, eine App, mit der Sie ausgestattete Reisebusse für Ihr nächstes Roadtrip-Abenteuer mieten können. Dieser Kurs ist voll von kleinen und großen interaktiven Coding-Herausforderungen, die Ihnen helfen, die Themen, die Sie lernen werden, zu vertiefen, während Sie das Hauptprojekt VanLife erstellen. Wiederholung und Übung sind der beste Weg, um die Hölle der Tutorien zu vermeiden und das Muskelgedächtnis aufzubauen, das Sie brauchen, um wirklich zu verstehen, was Sie lernen. Wenn Sie also der Hölle der Tutorien entkommen wollen, ist dieser Kurs (und Scrimba-Kurse im Allgemeinen) der richtige Weg für Sie!
Machen Sie Ihre ersten Schritte mit React Router und machen Sie sich mit dem Kursprojekt vertraut, einer coolen Website für die Vermietung von Lieferwagen.
Route Params Teil 3.1 - useParams() & Herausforderung•5 Minuten
Route Params Teil 3.2 - useParams() Herausforderung•7 Minuten
Route Params Quiz•4 Minuten
Verschachtelte Routen
Modul 2•2 Stunden abzuschließen
Moduldetails
Das Lernmodul erforscht verschachtelte Routen im React Router 6, die zur Erstellung komplexer und hierarchischer Routenstrukturen innerhalb von React-Anwendungen verwendet werden.
Fügen Sie die endgültige Navigationsleiste hinzu!•7 Minuten
Auslass-Kontext•6 Minuten
Aktualisieren Sie die bereitgestellte Version auf Netlify!•3 Minuten
Suchparameter und Links
Modul 3•2 Stunden abzuschließen
Moduldetails
Dieses Modul taucht in die Verwendung von Suchparametern und Links in React Router 6 ein und ermöglicht es Entwicklern, die Navigation mit Abfrageparametern in ihren React-Anwendungen zu implementieren.
Herausforderung: Einrichten von Suchparametern in VanLife•5 Minuten
Das Array mit dem Suchparameter filtern•5 Minuten
Herausforderung: Filtern Sie die Lieferwagen in VanLife•2 Minuten
Links zum Hinzufügen von Suchparametern verwenden•3 Minuten
Herausforderung: Filtern Sie die Lieferwagen mit Links•3 Minuten
Verwendung der Funktion search params setter•4 Minuten
Herausforderung: Filtern Sie die Lieferwagen mit einer Setter-Funktion•3 Minuten
Vorbehalte gegen das Setzen von Parametern•2 Minuten
Zusammenführung von Suchparametern mit Links•6 Minuten
Zusammenführen von Suchparametern mit der Funktion setSearchParams•5 Minuten
Herausforderung: Praxis des bedingten Renderns•5 Minuten
Verbleibende absolute Pfade korrigieren•2 Minuten
Zurück zu allen Transportern•2 Minuten
Link-Status•6 Minuten
useLocation•8 Minuten
Herausforderung: Bedingtes Rendern des Textes der Zurück-Schaltfläche•3 Minuten
404 Seite•6 Minuten
"Happy Path" vs. "Sad Path"•3 Minuten
Schnelles Update unseres Codes zum Abrufen•3 Minuten
Kodierung des traurigen Pfades - Ladezustand•4 Minuten
Kodierung des traurigen Pfades - Fehlerbehandlung•5 Minuten
Lader und Fehler
Modul 4•1 Stunde abzuschließen
Moduldetails
Dieses Modul befasst sich mit Loadern und Fehlern in React Router 6, die zur Handhabung von Lastzuständen und Fehlerbehandlung innerhalb der Routing-Komponenten ihrer Anwendungen verwendet werden.
Herausforderung: useLoaderData auf der Seite Vans List•2 Minuten
Verwenden Sie die Loader-Daten anstelle der useEffect•4 Minuten
Lader-Quiz•3 Minuten
Umgang mit Fehlern•3 Minuten
ErrorElement zur Transporterroute hinzufügen•3 Minuten
useRouteError•6 Minuten
Aktionen und geschützte Routen
Modul 5•3 Stunden abzuschließen
Moduldetails
Erkunden Sie Aktionen und geschützte Routen in React Router 6,. Lernen Sie, Authentifizierung und Autorisierung zu implementieren, indem Sie Routen schützen und Aktionen auf der Basis von Benutzerrollen oder Berechtigungen durchführen.
Geschützte Routen - Bedingte Weiterleitung zur /login-Seite•4 Minuten
Quiz über geschützte Routen•2 Minuten
Geschützte Routen - mit Lader•5 Minuten
Geschützte Routen mit Lader•4 Minuten
Parallele Lader Demo•4 Minuten
Herausforderung: Geschützte Routen mit Lader•1 Minute
Herausforderung: Geschützte Routen in VanLife - Teil 1•2 Minuten
Nebenbei bemerkt: Verlagerung der restlichen Abrufe auf Lader - Teil 1•6 Minuten
Nebenbei bemerkt: Verlagerung der restlichen Abrufe auf Lader - Teil 2•4 Minuten
Herausforderung: Geschützte Routen in VanLife - Teil 2•8 Minuten
Prompt für Login-Nachricht an Login-Seite senden•3 Minuten
Nachricht vom Suchparameter auf der Anmeldeseite konsumieren•8 Minuten
Nachricht an die Login-Seite weiterleiten•8 Minuten
🌶️ Nehmen Sie: Formulare in React sind schlecht•2 Minuten
Einrichten für die Authentifizierung - Happy Path•5 Minuten
Einrichten für die Authentifizierung - trauriger Pfad•8 Minuten
useNavigate()•4 Minuten
React Router-Formular-Komponente•3 Minuten
Einrichten der Funktion Aktion•4 Minuten
Formular und Aktion zu VanLife hinzufügen•2 Minuten
Aktionsfunktion - Parameter•2 Minuten
Aktionsfunktion - Anfrage•3 Minuten
Abrufen von Formulardaten in VanLife•2 Minuten
Daten in Aktion verwenden, um sich anzumelden•3 Minuten
Bessere (aber immer noch gefälschte) Zulassung•4 Minuten
Herausforderung: Benutzer nach dem Einloggen zur /host-Route schicken•3 Minuten
Formular ersetzen•5 Minuten
useActionData•4 Minuten
Aktion Fehlerbehandlung•3 Minuten
Aktionsfehlerbehandlung in VanLife•3 Minuten
useNavigation()•4 Minuten
useNavigation in VanLife•4 Minuten
den Pfadnamen der vorherigen Route abrufen•7 Minuten
redirectTo - Teil 1•4 Minuten
redirectTo - Teil 2•6 Minuten
redirectTo in VanLife•5 Minuten
Aufgeschobene Daten
Modul 6•2 Stunden abzuschließen
Moduldetails
Dieses Modul befasst sich mit zeitversetzten Daten in React Router 6, die es Entwicklern ermöglichen, Daten effizient zu laden und bei Bedarf für bestimmte Routen anzuzeigen, was die Leistung und Benutzererfahrung verbessert.
Scrimba ist eine interaktive Code-Lernplattform mit über einer Million Nutzern aus der ganzen Welt. Sie bietet hochgradig interaktive und ansprechende Kurse über Programmierung und Webentwicklung.
Wann werde ich Zugang zu den Vorlesungen und Aufgaben haben?
Um Zugang zu den Kursmaterialien und Aufgaben zu erhalten und um ein Zertifikat zu erwerben, müssen Sie die Zertifikatserfahrung erwerben, wenn Sie sich für einen Kurs anmelden. Sie können stattdessen eine kostenlose Testversion ausprobieren oder finanzielle Unterstützung beantragen. Der Kurs kann stattdessen die Option "Vollständiger Kurs, kein Zertifikat" anbieten. Mit dieser Option können Sie alle Kursmaterialien einsehen, die erforderlichen Bewertungen abgeben und eine Abschlussnote erhalten. Dies bedeutet auch, dass Sie kein Zertifikat erwerben können.
Was bekomme ich, wenn ich mich für diese Specialization einschreibe?
Wenn Sie sich für den Kurs einschreiben, erhalten Sie Zugang zu allen Kursen der Spezialisierung, und Sie erhalten ein Zertifikat, wenn Sie die Arbeit abgeschlossen haben. Ihr elektronisches Zertifikat wird Ihrer Seite "Leistungen" hinzugefügt - von dort aus können Sie Ihr Zertifikat ausdrucken oder Ihrem LinkedIn-Profil hinzufügen.
Ist finanzielle Hilfe verfügbar?
Ja. Für ausgewählte Lernprogramme können Sie finanzielle Unterstützung oder ein Stipendium beantragen, wenn Sie die Einschreibegebühr nicht aufbringen können. Wenn für das von Ihnen gewählte Lernprogramm eine finanzielle Unterstützung oder ein Stipendium verfügbar ist, finden Sie auf der Beschreibungsseite einen Link zur Beantragung.