--- title: The React Roadmap for 2024 – How to Learn React | daily.dev description: This post provides a roadmap for learning React in 2024, covering core concepts, hooks, intermediate concepts, creating apps with Vite, data fetching with... canonical: https://daily.dev/posts/the-react-roadmap-for-2024-how-to-learn-react-mywtztg65 twitter:card: summary_large_image twitter:site: @dailydotdev og:type: website og:site_name: daily.dev og:title: The React Roadmap for 2024 – How to Learn React | daily.dev og:description: This post provides a roadmap for learning React in 2024, covering core concepts, hooks, intermediate concepts, creating apps with Vite, data fetching with... og:url: https://daily.dev/posts/the-react-roadmap-for-2024-how-to-learn-react-mywtztg65 og:image: https://api.daily.dev/og/posts/MYWTztG65.png og:image:alt: The React Roadmap for 2024 – How to Learn React og:image:width: 1200 og:image:height: 630 og:locale: en --- > ## Documentation Index > Fetch the complete documentation index at: https://daily.dev/llms.txt > Use this file to discover all available pages before exploring further. # The React Roadmap for 2024 – How to Learn React **[freeCodeCamp](https://daily.dev/sources/freecodecamp)** · 7 min read · 332 upvotes · 12 comments ## Summary This post provides a roadmap for learning React in 2024, covering core concepts, hooks, intermediate concepts, creating apps with Vite, data fetching with TanStack Query, state management with Zustand, styling with TailwindCSS and Radix, routing with TanStack Router, building forms with React Hook Form, and full-stack React development with Next.js. ## Full article daily.dev links to this article rather than hosting it. Read it at the original source: ## Community discussion Top comments from developers on daily.dev. **@pectorel** · 2 upvotes > Very good summarized article about what to learn with React ! **@kiritobest** · 1 upvotes > Very helpful for starting the year. **@ahiknrs** · 0 upvotes > As a total beginner this can be a very helpful article. **@orcdev** · 0 upvotes > Great article! Agree with everything! Especially the Next.js part! It's going in the full stack direction, and I think in 2 - 3 years it's going to be a blast! **@beardyman** · 0 upvotes > Very very good!! ## Similar posts on daily.dev - [Don’t just attend KubeCon \+ CloudNativeCon, Merge Forward your experience\!](https://daily.dev/posts/don-t-just-attend-kubecon-cloudnativecon-merge-forward-your-experience--l0rpp73x8) · CNCF · 1 upvotes · 0 comments - [Announcing H2 2026 KCDs](https://daily.dev/posts/announcing-h2-2026-kcds-m96goajm1) · CNCF · 1 upvotes · 0 comments - [Two months of Open Community Groups](https://daily.dev/posts/two-months-of-open-community-groups-asf52zhbs) · CNCF · 0 upvotes · 0 comments - [CNCF Unveils Schedule for KubeCon \+ CloudNativeCon Europe 2026](https://daily.dev/posts/cncf-unveils-schedule-for-kubecon-cloudnativecon-europe-2026-ikhcoa5cb) · CNCF · 2 upvotes · 0 comments - [CNCF Debuts KubeCon \+ CloudNativeCon Japan 2026 Schedule](https://daily.dev/posts/cncf-debuts-kubecon-cloudnativecon-japan-2026-schedule-xp5pyudub) · CNCF · 1 upvotes · 0 comments --- Tags: [#webdev](https://daily.dev/tags/webdev), [#react](https://daily.dev/tags/react), [#javascript](https://daily.dev/tags/javascript) [View this post on daily.dev](https://daily.dev/posts/the-react-roadmap-for-2024-how-to-learn-react-mywtztg65) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@type":"TechArticle","headline":"The React Roadmap for 2024 – How to Learn React","url":"https://daily.dev/posts/the-react-roadmap-for-2024-how-to-learn-react-mywtztg65","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/the-react-roadmap-for-2024-how-to-learn-react-mywtztg65"},"datePublished":"2024-01-09T22:25:25.253Z","dateModified":"2024-01-09T22:25:24.308Z","description":"This post provides a roadmap for learning React in 2024, covering core concepts, hooks, intermediate concepts, creating apps with Vite, data fetching with...","image":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/d6b9c49f42af73b34eea17866a74e76e?_a=AQAEufR","thumbnailUrl":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/d6b9c49f42af73b34eea17866a74e76e?_a=AQAEufR","isAccessibleForFree":true,"articleSection":"freeCodeCamp","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"freeCodeCamp","logo":"https://media.daily.dev/image/upload/t_logo,f_auto/v1628412854/logos/freecodecamp","url":"https://daily.dev/sources/freecodecamp"},"commentCount":12,"discussionUrl":"https://daily.dev/posts/the-react-roadmap-for-2024-how-to-learn-react-mywtztg65","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":332},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":12}],"keywords":"webdev,react,javascript","timeRequired":"PT7M"} {"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"freeCodeCamp","item":"https://daily.dev/sources/freecodecamp"},{"@type":"ListItem","position":3,"name":"The React Roadmap for 2024 – How to Learn React"}]} {"@context":"https://schema.org","@type":"WebPage","@id":"https://daily.dev/posts/the-react-roadmap-for-2024-how-to-learn-react-mywtztg65","comment":[{"@type":"Comment","text":"Very good summarized article about what to learn with React !","datePublished":"2024-01-11T14:41:38.944Z","url":"https://daily.dev/posts/MYWTztG65#c-KnwktP1gE","author":{"@type":"Person","name":"Aurélien","url":"https://daily.dev/pectorel","image":"https://media.daily.dev/image/upload/s--2nwotCoq--/f_auto/v1704984156/avatars/avatar_RwCuw9N3yU4Oc4OXu1G43"},"interactionStatistic":{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":2}},{"@type":"Comment","text":"Very helpful for starting the year.","datePublished":"2024-01-12T20:56:41.033Z","url":"https://daily.dev/posts/MYWTztG65#c-8iigJV4Ku","author":{"@type":"Person","name":"Masood Acheampong","url":"https://daily.dev/kiritobest","image":"https://lh3.googleusercontent.com/a/ACg8ocJFJCl5DbL4doGF5Dxj-FSCpKWQazO3BfhkZgxgRZ295G0=s96-c"},"interactionStatistic":{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":1}},{"@type":"Comment","text":"As a total beginner this can be a very helpful article.","datePublished":"2024-01-15T06:55:52.868Z","url":"https://daily.dev/posts/MYWTztG65#c-aB8elney5","author":{"@type":"Person","name":"Krishna Shah","url":"https://daily.dev/ahiknrs","image":"https://avatars.githubusercontent.com/u/93765134?v=4"}},{"@type":"Comment","text":"Great article! Agree with everything! Especially the Next.js part! It’s going in the full stack direction, and I think in 2 - 3 years it’s going to be a blast!","datePublished":"2024-01-31T19:28:10.483Z","url":"https://daily.dev/posts/MYWTztG65#c-tlRLUnpKX","author":{"@type":"Person","name":"OrcDev","url":"https://daily.dev/orcdev","image":"https://avatars.githubusercontent.com/u/7549148?v=4"}},{"@type":"Comment","text":"Very very good!!","datePublished":"2024-02-24T06:48:50.644Z","url":"https://daily.dev/posts/MYWTztG65#c-VpjgCRxJe","author":{"@type":"Person","name":"Beardy","url":"https://daily.dev/beardyman","image":"https://media.daily.dev/image/upload/s--e0nqUKXh--/f_auto/v1711134690/avatars/avatar_915CLTTLyePA44qFRzV4P"}}]} ```