Name: Introduction to React
Rating: 4.298245614035087 (114 reviews)

Kursinnhold

In this course, we will learn how to use the JavaScript React library for making front-end applications. This course will help you understand the structure of a React application, how to add …

In this section we will explore why React is useful and why it is worth learning it at all. We will also learn one prerequisite, ES6, which will be used throughout the course.

In this section, we will learn another prerequisite - JSX which will be used throughout the course. Finally, we will explore some example code to get acquainted with React.

JSX Introduction

JSX Variables & Nested Elements

JSX Embedding Expressions

JSX Specifying Attributes

Getting Started with React

In this section we will learn about the essential and practical parts of React excluding the components – which will be covered in the next section. We will look at how JSX can be used with React, and how to create and render more complex elements in the React DOM using JSX. We will also learn how to set up a React based project, and we will explore its structure for deepening our understanding.

Getting familiar with JSX

Writing more Complex Elements using JSX

Creating a React-Based Project

Structure of a React Project

In this section you’ll be introduced to React components. We will look at what React components are and why we need them. We will explore the two different types of React components and learn the syntax for creating them. We will use them to create a single page application that displays X.

Introduction to Components

Functional Components

Creating React Components

Importing Components

In this section we will learn more about how to combine JavaScript and JSX to create dynamic content. We will also learn how to pass data between components. In the end we will also explore event handling.

Passing Data into Components

Conditional Rendering

Loop Based Rendering

Keys in Lists

Event Handling

Creating a TODO Application

In the end of the previous chapter, we tried making a Todo application though in our attempt to do so we soon discovered that we needed some method for re-rendering the components once the data is updated in a component as React wasn’t automatically doing that for us. In this section we will learn how to fix such issues using ‘Hooks’. We will learn and implement hooks in detail. By the end of this section, you will be able to create stateful components in React and combine them to create complex web applications.

Introduction to Hooks

Using the State Hook

The Effect Hook

Rules of Using Hooks

Creating Custom Hooks

Fixing the Todo Application

In this chapter we will learn how to add different pages to our React application and render different components based on URL. You will gain sufficient knowledge to be able to create multi-page applications.

Introduction to React Router

Route-Based Rendering

Creating Navigation Bars

Using Params

Forbedre dine tekniske ferdigheter!

med opptil 55% rabatt

What you'll get with our subscription:

500+ topprangerte kursFullføringssertifikaterPersonlige studieløp40+ praktiske prosjekter fra virkeligheten

Abonnementet ditt inkluderer også 500+ kurs:

Introduksjon til React

Utforsk grunnleggende prinsipper for å bygge brukergrensesnitt med React. Fokuser på komponenter, JSX, dataflyt, tilstand og sideeffekter brukt i daglige React-applikasjoner.

Tilstandshåndtering med Redux Toolkit i React

Oppdag kraften i Redux Toolkit sammen med React, og styrk dine ferdigheter innen tilstandshåndtering. Dette kurset gir en grundig introduksjon til Redux Toolkit, et kraftig bibliotek for tilstandshåndtering. Lær hvordan du kan forenkle Redux-oppsettet, forenkle kompleks tilstandslogikk og lage effektive, skalerbare React-applikasjoner.

React Router Essentials

Lær å håndtere navigasjon i React-applikasjoner ved hjelp av React Router. Forstå strukturen til URL-er og rutingens rolle i nettapplikasjoner. Sett opp React Router for å lage flersidige applikasjoner med dynamisk innhold basert på URL-stier. Arbeid med avanserte funksjoner som spørringsstrenger og URL-parametere for å håndtere applikasjonstilstand og brukernavigasjon.

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.

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.

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.

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.

Introduksjon til React

Utforsk grunnleggende prinsipper for å bygge brukergrensesnitt med React. Fokuser på komponenter, JSX, dataflyt, tilstand og sideeffekter brukt i daglige React-applikasjoner.

Tilstandshåndtering med Redux Toolkit i React

Oppdag kraften i Redux Toolkit sammen med React, og styrk dine ferdigheter innen tilstandshåndtering. Dette kurset gir en grundig introduksjon til Redux Toolkit, et kraftig bibliotek for tilstandshåndtering. Lær hvordan du kan forenkle Redux-oppsettet, forenkle kompleks tilstandslogikk og lage effektive, skalerbare React-applikasjoner.

React Router Essentials

Lær å håndtere navigasjon i React-applikasjoner ved hjelp av React Router. Forstå strukturen til URL-er og rutingens rolle i nettapplikasjoner. Sett opp React Router for å lage flersidige applikasjoner med dynamisk innhold basert på URL-stier. Arbeid med avanserte funksjoner som spørringsstrenger og URL-parametere for å håndtere applikasjonstilstand og brukernavigasjon.

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.

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.

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.

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.

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.

Trinn-for-trinn til fantastiske resultater

Løs virkelige kodingoppgaver

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.

Få veiledning på forespørsel

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.

Lås inn læringen din

Kunnskapssjekk

Avslutt hver modul med en rask quiz som gir umiddelbar tilbakemelding, sporer fremgangen din og sikrer at du har mestret viktige konsepter.

Vis frem ferdighetene dine

Feire suksess

Tjen ditt bransjeanerkjente sertifikat ved fullføring og del det på LinkedIn med ett klikk—la nettverket ditt se hva du kan gjøre.

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 $79 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.

Ofte stilte spørsmål

Hvordan får jeg tilgang til plattformen?

Selv om du kan studere med Codefinity på hvilken som helst enhet, anbefaler vi sterkt å bruke en datamaskin eller bærbar PC for å optimalisere læringsopplevelsen din.

Hva om jeg har spørsmål mens jeg lærer?

Alle våre kurs har en integrert AI-assistent, klar til å hjelpe deg med eventuelle spørsmål du måtte ha under studiene og hjelpe deg med å løse problemer.

Er en teknisk grad nødvendig for å lære?

Nei, du trenger ingen tidligere erfaring for å begynne å lære. Våre kurs er designet for nybegynnere, så du kan enkelt starte din reise i teknologibransjen.

Fortsatt spørsmål?

Skriv spørsmålet ditt her

Introduction to React

Kurs for mellomnivå

Kursinnhold

Abonnementet ditt inkluderer også 500+ kurs:

Hvorfor folk velger Codefinity

Trinn-for-trinn til fantastiske resultater

Stolte på av ansatte i ledende selskaper
og studenter fra toppuniversiteter

Få umiddelbar tilgang til 500+ kurs

Full tilgang til katalogen

Prøv Codefinity med tillit – 30-dagers pengene-tilbake-garanti inkludert

Ofte stilte spørsmål

Fortsatt spørsmål?

Introduction to React

Kurs for mellomnivå

Kursinnhold

Abonnementet ditt inkluderer også 500+ kurs:

Hvorfor folk velger Codefinity

Trinn-for-trinn til fantastiske resultater

Stolte på av ansatte i ledende selskaper og studenter fra toppuniversiteter

Få umiddelbar tilgang til 500+ kurs

Full tilgang til katalogen

Prøv Codefinity med tillit – 30-dagers pengene-tilbake-garanti inkludert

Ofte stilte spørsmål

Fortsatt spørsmål?

Stolte på av ansatte i ledende selskaper
og studenter fra toppuniversiteter