Bli en React-Utvikler
Intermediate
4.3
122 reviews
5.8k+ Learners
Bli en mester i å bygge dynamiske og interaktive brukergrensesnitt for webapplikasjoner som en dyktig React-utvikler. Hvis du har god forståelse for J…
121
Chapters
19
Learning hours
73
Assignments
AI Assistant
Shareable Certificate
Resultater
Resultater
Track content
Related courses and projects
Attester
Funksjoner
Priser
Resultater
Resultater
Track content
Related courses and projects
Attester
Funksjoner
Priser
Hva du vil lære
Building reusable UI components with React
Navigating apps using React Router
Setting up and deploying Next.js projects
Styling React apps with CSS and inline styles
Handling state with Redux Toolkit
Fetching and displaying data in Next.js
Managing state with React Hooks and Context
Developing apps with Next.js framework
Implementing authentication in Next.js
Learning track content
Utforsk hva React er og hvordan det gjengir brukergrensesnitt. Fokus på komponenter, JSX-syntaks og visning av elementer på skjermen.
Fordypning i overføring av data mellom komponenter og kontroll av UI-utdata. Fokus på props, betinget rendering og rendering av lister med data.
Overføring av Data med Props
Utfordring: Opprett Funksjonelle Komponenter
Betinget Gjengivelse i React
Utfordring: Implementer Betinget Gjengivelse i Chatvarsling
Utfordring: Implementer Betinget Rendering i Bankvarsel
Gjengivelse av Lister med Data i React
Utfordring: Vis Datasamlinger
Oppsummering av React-grunnleggende
Lær hvordan brukerinteraksjoner og ekstern data endrer brukergrensesnittet over tid. Fokus på håndtering av tilstand og sideeffekter med React-hooks.
Utforsk vanlige metoder for å style React-komponenter. Fokus på bruk av inline-stiler og ekstern CSS.
Lær hvordan du kjører et React-prosjekt og forstår dets struktur. Fokuser på å starte et prosjekt med Vite og navigere i prosjektfilene.
Lær de teoretiske grunnprinsippene for konsepter som URL, domene, protokoll, spørringsparametere og mer. Forstå betydningen av ruting i webapplikasjoner og hvorfor vi trenger React Router-biblioteket.
Lær hvordan du kan lage en komplett React-applikasjon fra bunnen av, med mulighet til å vise innhold som tilpasses basert på URL ved hjelp av React Router-funksjonalitet.
Oversikt over Flerside-nettstedet
Installasjon av React Router
Aktivere Routing i en React-app
Definere Ruter for Navigasjon
Oppsummering: Første Steg i React Router
Optimalisering av Importer med Lazy Loading
Implementering av en Reservekomponent
Oppsummering: Andre Steg i React Router
Oppretting og Håndtering av Navigasjon
Utforskning av React Routers Fullstendige Logikk
Oppsummering av Grunnleggende React Router
Utforsk bruk av spørringsstrenger for deling og håndtering av applikasjonstilstand via URL-er, arbeid med ulike datatyper i spørringsparametere, og utnytt React Router for navigasjon og effekter basert på endringer i URL.
Utforsk de grunnleggende konseptene innen tilstandshåndtering og lær hvordan du kan utnytte kraften i Redux Toolkit. Vi veileder deg gjennom installasjonsprosessen og hjelper deg med å opprette ditt første React Redux Toolkit-prosjekt. I tillegg får du en utfordring for å teste din forståelse og ferdigheter.
Undersøk integrasjon av Redux med React-applikasjoner, med fokus på kjernebegreper: actions, reducers og Redux store. Inkluderer praktiske eksempler og kodeforklaringer for konfigurasjon av store, opprettelse av reducers og tilkobling av React-komponenter via hooks som useSelector og useDispatch.
Hva Venter
Forståelse av Prosjektkoden og Filstrukturen
Oppretting av Redux-butikken
Integrering av Redux Store i React-appen
Inspisere Store i React-appen
Forståelse av Actions og Action Creators
Forstå Rollen til Reducers
Inspeksjon av Actions og Reducers i Redux
Koble Redux til React-Komponenter
Fullføre Appen
Styrk ferdighetene dine innen tilstandshåndtering. I dette praktiske verkstedet løser du reelle utfordringer og får praktisk erfaring med å bruke Redux Toolkit for smidig applikasjonsutvikling.
Vi skal diskutere hva du bør kunne før du begynner med Next.js-rammeverket, hva du kan forvente av dette kurset, og hva du kommer til å bygge.
Vi setter opp prosjektet, undersøker måter å legge til styling i appen vår på, og dekker visuelle aspekter som bilder, fonter, sider og oppsett.
Oppsett Av Next.Js-Prosjektet
Forståelse av Prosjektets Fil- og Mappestruktur
Stiltilnærminger i Next.js
Legge Til Den Globale CSS-Filen
Bruk av Tailwind CSS for Styling
Arbeide med CSS-moduler
Betinget Bruk av Stiler
Legge til Egendefinerte Google Fonts
Utfordring: Implementere en Tilpasset Google-font
Håndtering av Bilder i Next.js
Lær hvordan du enkelt kan opprette og administrere et nytt visningsbilde for applikasjonen din, samt navigere sømløst mellom alle sider med et integrert rutingsystem.
Distribuer Next.js-appen ved hjelp av GitHub- og Vercel-kontoer. Etabler i tillegg en database for å levere nødvendig data til appen.
Vurder hvordan data kan hentes og vises for brukeren på en tydelig og effektiv måte.
Lær hvordan du implementerer moderne nettfunksjoner som paginering, CRUD-operasjoner, globalt søk, skjemavalidering og mer.
Implementering av autentisering i Next.js.
Forståelse av Autentisering
Oppsett av Innloggingsrute
Bruk av Nextauth.js for Autentisering
Konfigurering av Autentisering og Beskyttelse av Ruter
Hashing av passord og håndtering av legitimasjon
Implementering av Innloggingsfunksjonalitet
Koble Brukergrensesnittet til Autentiseringslogikk
Implementering av Utloggingsfunksjonalitet
Avsluttende Tanker og Neste Steg
Forbedre dine tekniske ferdigheter!
med opptil 55% rabatt
Features:
*Tracks not included in Pro plan
500+ topprangerte kursBanebrytende AI Copilot
Personlige studieløp40+ praktiske prosjekter fra virkeligheten
Uten oppsigelse, før den valgte rabatterte planen utløper, godtar jeg at Codefinity automatisk belaster $104 hver 3. måned til jeg kansellerer. Les mer om oppsigelses- og refusjonspolicy på Abonnementsvilkår.
Recommended Courses and Projects
kurs
End to End Testing React Apps with Playwright
Test React applications end to end using Playwright. Write reliable browser tests, interact with UI elements, handle asynchronous behavior, and validate navigation and network behavior. Apply advanced testing strategies to build scalable, maintainable test suites for production React applications.
2 timer
15 kapitlerMiddelsnivå
1 STUDERER NÅ
kurs
TanStack Query Server State Management in React
Manage server state in React applications using TanStack Query. Fetch, cache, and synchronize remote data, handle mutations and optimistic updates, and implement advanced query patterns for dynamic data flows. Optimize queries for performance, scalability, and maintainability in production React applications.
2 timer 14 kapitlerMiddelsnivå
2 STUDERER NÅ
kurs
React Forms with React Hook Form
Manage forms in React applications using React Hook Form. Learn core concepts, validation techniques, error handling patterns, and dynamic form structures that scale. Integrate forms with UI component libraries and apply performance optimizations to build reliable, user friendly form experiences.
2 timer 13 kapitlerMiddelsnivå
2 STUDERER NÅ
kurs
MUI Essentials for React Applications
Build modern, responsive, and visually polished React applications using Material UI. Learn to structure interfaces with core components, design flexible layouts, manage forms, and apply responsive behavior. Customize themes, refine visual styles, and develop practical features through focused, real-world mini projects. Gain the confidence to create clean, accessible, production-ready UIs with MUI.
3 timer 22 kapitlerMiddelsnivå
kurs
Testing React Apps with Jest and React Testing Library
Test React applications using Jest and React Testing Library. Write unit and integration tests, validate component behavior through user interactions, and debug test failures effectively.
2 timer 12 kapitlerMiddelsnivå
kurs
Animations in React with Framer Motion
Master UI animation techniques in React using Framer Motion. Build animated components, control motion through state and variants, implement interactive gestures, and optimize animations for performance and accessibility. Apply animation patterns that scale across real application interfaces and navigation flows.
1 time 13 kapitlerNybegynner
kurs
Tailwind CSS Styling in React Applications
Master styling React applications using Tailwind CSS. Learn how to integrate Tailwind into React, design reusable UI components, customize themes, build responsive layouts, and enhance interfaces with interactivity and animations.
1 time 13 kapitlerNybegynner
kurs
Auth0 Authentication and Authorization in React Apps
Implement secure authentication and authorization in React applications using Auth0. Configure login flows, protect routes, manage user sessions, and customize authentication experiences. Apply advanced Auth0 features such as roles, permissions, and secure API access in production React apps.
1 time 11 kapitlerMiddelsnivå
1 STUDERER NÅ
kurs
State Management in React with Zustand
Manage application state in React using Zustand.
Create and update stores, derive and organize state, handle asynchronous logic, and apply middleware for extended behavior.
Structure Zustand stores effectively and evaluate when Zustand is an appropriate state management solution.
1 time 11 kapitlerMiddelsnivå
kurs
Building UI Systems in React with Storybook
Develop, document, and test React UI components using Storybook. Create structured stories, configure addons for documentation and testing, and scale component libraries for team workflows. Integrate Storybook into collaborative development and automated delivery pipelines.
1 time 12 kapitlerNybegynner
kurs
Data Visualization in React with Recharts
Build powerful, interactive data visualizations in React using Recharts. Learn how to integrate Recharts into React projects, render essential chart types, customize design and behavior, work with dynamic real-world data, and apply best practices for performance, accessibility, and scalability.
2 timer 14 kapitlerMiddelsnivå
kurs
TypeScript Essentials for React
Strengthen your React development skills by applying TypeScript to components, events, hooks, and async logic. Use the TypeScript features that matter most in real React applications to write safer, clearer, and more maintainable UI code. Build confidence with typed props, state, API calls, custom hooks, and advanced React patterns.
2 timer 24 kapitlerNybegynner
Discover more Learning Tracks
spor
Webutvikling med C#
10 Kurs
439 OppgaverNybegynner
4.7
(3815)
spor
SQL fra Nybegynner til Ekspert
7 Kurs248 OppgaverNybegynner
4.7
(3986)
spor
C++-Grunnleggende
6 Kurs124 OppgaverNybegynner
4.3
(1285)
spor
Spillutvikling med Unity
4 Kurs164 OppgaverNybegynner
4.4
(283)
spor
Full Stack Webutvikling
7 Kurs398 OppgaverNybegynner
4.6
(1457)
spor
Grunnleggende Innen Frontend-Utvikling
6 Kurs386 OppgaverNybegynner
4.6
(1389)
spor
C++ Mastery
4 Kurs85 OppgaverAvansert
4.5
(103)
spor
Java Web
6 Kurs240 OppgaverAvansert
4.7
(4355)
spor
Bli en QA-Ingeniør
5 Kurs315 OppgaverNybegynner
4.6
(1185)
spor
Video Production With Adobe
4 Kurs123 OppgaverNybegynner
5.0
(13)
spor
UI/UX Designverktøy
4 Kurs161 OppgaverNybegynner
4.8
(24)
Hvorfor folk velger Codefinity
Web Developer
Kwizera Mugisha
The teaching methodology at Codefinity is excellent, and I particularly appreciate how it has prepared me to handle real-world coding problems. Currently, I am delving into Node.js and eagerly anticipate building full-stack projects that integrate all the knowledge I have gained.
Senior Business Analyst
Sherry Barnes-Fox
My first course was 4 hours, I did it in a few days, "nugget-style". The instructions are very clear and easy to understand. There is even a hint to help you get the answer. I love the learning style that is used, it engages me.
Accounts Payable Specialist
Bill Wagner
I have really liked the browser-based lessons that allow me to code within the lesson. The RUN button allows me to test the code I write before submitting for a grade.
IT Support Specialist
Daniel Chinea
I have gained a lot of practical and logical thinking skills, along with patience for myself and confidence in myself that I can learn programming. Years ago, I would have never thought that I could learn programming in any way, shape or form, and I was able to obtain these certifications and skills with Codefinity.
Technology Project Manager
Steve Bruening
The learning was progressive and made it easy to follow along and make progress. I could feel my skills increasing and building on each other as the course went along.
Project Manager
Stephanie Chan
As I went through the first course of the Python track, I liked the way the course was lay out (in easy and digestible modules) with little exercises at the end of each concept.
Step-by-Step to Stellar Results
Interaktivt kodemiljø
Dykk inn i vårt interaktive miljø: skriv og kjør koden din med sanntids tilbakemelding og suksessmålinger—lær ved å gjøre på hvert trinn.
AI-drevet støtte
Bruk den innebygde AI-assistenten til å forklare feil, foreslå løsninger eller svare på spørsmål om koden din—slik at du forblir produktiv og aldri står fast.
Check your progress
Avslutt hver modul med en rask quiz som gir umiddelbar tilbakemelding, sporer fremgangen din og sikrer at du har mestret viktige konsepter.
Promote your expertise
Tjen ditt bransjeanerkjente sertifikat ved fullføring og del det på LinkedIn med ett klikk—la nettverket ditt se hva du kan gjøre.
Stolte på av ansatte i ledende selskaper
og studenter fra toppuniversiteter
Full tilgang til katalogen
Et abonnement gir tilgang til dette kurset og hele katalogen vår av prosjekter og ferdigheter.Features:
500+ topprangerte kursBanebrytende AI Copilot
Personlige studieløp40+ praktiske prosjekter fra virkeligheten
Uten oppsigelse, før den valgte rabatterte planen utløper, godtar jeg at Codefinity automatisk belaster $104 hver 3. måned til jeg kansellerer. Les mer om oppsigelses- og refusjonspolicy på Abonnementsvilkår.
Prøv Codefinity med tillit – 30-dagers pengene-tilbake-garanti inkludert
For å ønske deg velkommen til Codefinity, tilbyr vi opptil 64% rabatt på våre kurs. I tillegg har vi en 30-dagers pengene-tilbake-garanti, slik at du kan prøve oss uten risiko.Vi ser virkelig frem til å ønske deg velkommen til vår plattform og er forpliktet til å gjøre din læringsopplevelse enkel, interaktiv og morsom.
Ready to get started?
Pro
Best intro offer
Ultimate
A complete experience
to kickstart your career
to kickstart your career
500+ Top-Rated courses
Completion certificates
Early access to new courses
40+ hands-on Real-world projects
Personalized study tracks
Unlimited workspaces
Få umiddelbar tilgang til 500+ kurs
Ubegrenset læring, umiddelbar tilgangFå full tilgang til alle kurs og spor, inkludert videoinnhold, quizer og dyptgående materialer—start læringen når som helst.
Bransjeanerkjente sertifikaterTjen sertifikater som bekrefter din ekspertise og styrker karrieren din innen teknologi, AI, data, markedsføring og mer.
KI-assistert læringFå personlige hint, sanntids tilbakemelding og AI-drevne forklaringer for å akselerere fremgangen din.
Stadig utvidelse: Nye kurs og karrieresporHold deg foran med stadig oppdaterte kurs, karriereveikart, utfordringer og praktiske prøver.
Bygg ferdigheter som betyr noeMestre etterspurte ferdigheter med kurs i AI, datavitenskap, programmering, markedsføring, automatisering, webutvikling og mer.
Interaktiv og sømløs læringEngasjer deg med praktiske prosjekter, virkelige øvelser og en intuitiv læringsopplevelse — ingen ekstra verktøy nødvendig.
