We may earn an affiliate commission when you visit our partners.
Course image
Bob Ziroll and Per Harald Borgen

The ultimate React 101 - the perfect starting point for any React beginner. Learn the basics of modern React by solving 140+ interactive coding challenges and building eight fun projects.

Read more

The ultimate React 101 - the perfect starting point for any React beginner. Learn the basics of modern React by solving 140+ interactive coding challenges and building eight fun projects.

In this 143-part interactive tutorial, you'll learn how to build dynamic, interactive web applications with React.js.

With Scrimba’s head of education, Bob Ziroll, as a guide, you’ll get to know all the bang-up-to-date features of React and fix them firmly in your memory by using them to create hands-on projects.

React is a free and open-source front-end JavaScript library. It was created by the developers at Facebook for use in their own products, including Facebook, Instagram, and WhatsApp . React is also used by Netflix, The New York Times, AirBnb, Discord, DropBox, and many other big companies. In short, it is one of the most popular JavaScript libraries in the world.

This course is filled with coding challenges that you'll complete by writing React code directly inside the Scrimba screencasts. Before you know it, you'll have written eight interactive React applications!

This course is designed to help you learn to code in a way that sticks - no more tutorial Hell.

We achieve this by stuffing the course full to the brim of interactive challenges, allowing you to develop the muscle memory you need to become a truly effective React developer.

You’ll also benefit from spaced learning and repetition in this course. Make sure you give yourself time (days/weeks) to finish it, and include lots of breaks. Don't try cramming it all in at once.

Once you are done, you will feel confident in your React skills and be ready to continue your coding journey.

Enroll now

What's inside

Syllabus

Build a React info site
Take your first steps in React by building a React info site.
Build an AirBnb Experiences clone
Discover classes and props while building an AirBnB Experiences clone.
Read more
Build a meme generator
Discover props, state and conditional rendering while building a classic meme generator.
Build a notes app and Tenzies game
FIne-tune your React skills by building a notes app and a Tenzies game.

Good to know

Know what's good
, what to watch for
, and possible dealbreakers
Develops core React skills through hands-on challenges, preparing learners for intermediate-level React development
Suitable for absolute beginners with no prior React knowledge
Taught by industry experts with extensive experience in React development
Focuses on interactive, hands-on learning through coding challenges and project building
May require additional time and effort to complete all challenges and projects

Save this course

Save Learn React to your list so you can find it easily later:
Save

Activities

Be better prepared before your course. Deepen your understanding during and after it. Supplement your coursework and achieve mastery of the topics covered in Learn React with these activities:
Review HTML and CSS basics
Refresh your understanding of HTML and CSS, ensuring a solid foundation for React development.
Browse courses on HTML
Show steps
  • Review online tutorials or documentation on HTML and CSS basics.
  • Work through practice exercises to reinforce your knowledge.
  • Build a simple HTML and CSS prototype to demonstrate your skills.
Review JavaScript fundamentals
Practice the fundamentals of JavaScript to strengthen your understanding and prepare for the course's advanced concepts.
Browse courses on JavaScript Fundamentals
Show steps
  • Review variables, data types, and operators
  • Practice writing simple functions and control flow statements
  • Build a small project using fundamental JavaScript concepts
Read 'The Road to Learn React' by Robin Wieruch
Comprehend the fundamental principles of React from a reliable and comprehensive resource, bolstering your foundational knowledge.
Show steps
  • Obtain a copy of 'The Road to Learn React'.
  • Dedicate time to reading and understanding the key concepts.
  • Take notes, highlight important sections, and summarize the main ideas.
  • Consider joining a book club or online discussion forum to engage with other readers.
Eight other activities
Expand to see all activities and additional details
Show all 11 activities
Attend a React hackathon or meetup
Engage with other React enthusiasts, learn from their experiences, and collaborate on projects.
Browse courses on React
Show steps
  • Find a React hackathon or meetup in your area.
  • Register and attend the event.
  • Participate in team projects or discussions.
  • Network with other attendees and exchange knowledge.
Build a simple React app
Develop a hands-on understanding of React by building a basic application, solidifying your knowledge of its core concepts.
Show steps
  • Follow a tutorial to create a React app with state and props
  • Implement basic event handling and data binding
  • Test and debug your React app
Follow a tutorial on building a React portfolio website
Gain practical experience and expand knowledge of React by following a guided tutorial for a real-world project.
Browse courses on React
Show steps
  • Find a reputable tutorial on building a portfolio website with React.
  • Follow the tutorial step-by-step, implementing the code and understanding the concepts.
  • Customize the website to showcase your own work and style.
  • Deploy the website to a hosting platform.
Build a basic React Tic-Tac-Toe game
Reinforce core React concepts while building a simple and engaging game.
Browse courses on React
Show steps
  • Create a new React project and set up the basic game structure.
  • Define the game state and set up the board.
  • Handle player moves and check for win conditions.
  • Add a simple UI and styling.
Build a React-based landing page for a fictional product
Apply React skills to create a functional and visually appealing landing page, demonstrating your proficiency in building user interfaces.
Browse courses on React
Show steps
  • Define the product and target audience.
  • Design the landing page layout and content.
  • Develop the React components and implement interactivity.
  • Style the landing page with CSS or a design framework.
  • Test the landing page for responsiveness and functionality.
  • Deploy the landing page to a hosting platform.
Write a blog post on using React with Hooks
Demonstrate understanding of React Hooks and share knowledge with others, fostering understanding and retention.
Browse courses on React
Show steps
  • Identify the key concepts of React Hooks.
  • Develop an outline for the blog post.
  • Write the content, providing clear explanations and examples.
  • Edit and proofread the blog post.
  • Publish the blog post on a relevant platform.
Contribute to an open-source React project
Gain hands-on experience in React development and contribute to the wider community by participating in open-source projects.
Browse courses on React
Show steps
  • Identify a reputable open-source React project to contribute to.
  • Review the project's documentation and codebase.
  • Identify an area where you can make a meaningful contribution.
  • Develop and test your proposed changes.
  • Submit a pull request to the project's repository.
Contribute to the React ecosystem
Enhance your React expertise by making meaningful contributions to the React ecosystem, directly impacting the technology's evolution.
Browse courses on React Development
Show steps
  • Identify areas of contribution within the React ecosystem
  • Collaborate with React developers on open-source projects
  • Create and maintain React-related packages or documentation
  • Present your contributions at React conferences or meetups

Career center

Learners who complete Learn React will develop knowledge and skills that may be useful to these careers:
React Developer
React Developers specialize in the development and maintenance of React applications. They have a deep understanding of React and its ecosystem, and are able to use it to build complex and interactive web applications. This course is a perfect fit for aspiring React Developers, as it teaches all the essential skills needed to succeed in this role, including how to build dynamic, interactive web applications with React.js.
JavaScript Developer
JavaScript Developers specialize in the development and maintenance of JavaScript applications. They have a deep understanding of JavaScript and its ecosystem, and are able to use it to build complex and interactive web applications. This course is a perfect fit for aspiring JavaScript Developers, as it teaches all the essential skills needed to succeed in this role, including how to build dynamic, interactive web applications with React.js.
Web Developer
Web Developers are responsible for the development and maintenance of websites and web applications. They have a strong understanding of web technologies, and are able to use them to create complex and interactive websites and applications. This course is a great starting point for aspiring Web Developers, as it teaches the basics of React, one of the most popular front end frameworks.
Front-End Developer
Front End Developers specifically work with the user interface (UI) of applications. They are responsible for developing and maintaining the code that controls how users view and interact with a website or application. This course teaches all the foundational skills needed to become an effective Front End Developer using React, which is one of the most in-demand front end frameworks. React is free, open source, and used by some of the biggest companies in the world including Facebook, Netflix, and The New York Times.
Full-Stack Developer
Full Stack Developers are responsible for both the front end and back end of web applications. They have a strong understanding of both front end and back end technologies, and are able to work independently on both sides. This course provides a solid foundation in React, one of the most popular front end frameworks, making it a valuable resource for aspiring Full Stack Developers looking to enhance their front end skills.
Software Engineer
Software Engineers are responsible for the design, development, and maintenance of software systems. They have a strong understanding of computer science fundamentals, and are able to use them to solve complex problems. This course can be a valuable resource for aspiring Software Engineers who are looking to gain experience with React, one of the most popular front end frameworks.
Computer Programmer
Computer Programmers are responsible for the development and maintenance of computer programs. They have a strong understanding of programming languages and computer science fundamentals, and are able to use them to solve complex problems. This course can be a valuable resource for aspiring Computer Programmers who are looking to gain experience with React, one of the most popular front end frameworks.
Mobile App Developer
Mobile App Developers are responsible for the design, development, and maintenance of mobile apps. They have a strong understanding of mobile app development technologies, and are able to use them to create complex and interactive mobile apps. This course may be useful for aspiring Mobile App Developers who are looking to gain experience with React Native, which is a framework for building cross-platform mobile apps using JavaScript.
Web Designer
Web Designers are responsible for the design and layout of websites and web applications. They have a strong understanding of design principles and web technologies, and are able to use them to create visually appealing and user-friendly websites and applications. This course may be useful for aspiring Web Designers who are looking to gain experience with React, one of the most popular front end frameworks.
UX Designer
UX Designers are responsible for the design and evaluation of user interfaces. They have a strong understanding of human-computer interaction and design principles, and are able to use them to create user interfaces that are both visually appealing and easy to use. This course may be useful for aspiring UX Designers who are looking to gain experience with React, one of the most popular front end frameworks.
Product Manager
Product Managers are responsible for the planning, development, and launch of new products. They have a strong understanding of market research and product development, and are able to use them to create successful products. This course may be useful for aspiring Product Managers who are looking to gain experience with React, one of the most popular front end frameworks.
Data Scientist
Data Scientists are responsible for the collection, analysis, and interpretation of data. They have a strong understanding of statistics and machine learning, and are able to use them to solve complex problems. This course may be useful for aspiring Data Scientists who are looking to gain experience with React, one of the most popular front end frameworks.
Technical Writer
Technical Writers are responsible for the creation and maintenance of technical documentation. They have a strong understanding of technical writing principles and web technologies, and are able to use them to create clear and concise technical documentation. This course may be useful for aspiring Technical Writers who are looking to gain experience with React, one of the most popular front end frameworks.
Business Analyst
Business Analysts are responsible for the analysis and improvement of business processes. They have a strong understanding of business analysis techniques and web technologies, and are able to use them to identify and solve business problems. This course may be useful for aspiring Business Analysts who are looking to gain experience with React, one of the most popular front end frameworks.
Project Manager
Project Managers are responsible for the planning, execution, and completion of projects. They have a strong understanding of project management techniques and web technologies, and are able to use them to successfully manage projects. This course may be useful for aspiring Project Managers who are looking to gain experience with React, one of the most popular front end frameworks.

Reading list

We've selected six books that we think will supplement your learning. Use these to develop background knowledge, enrich your coursework, and gain a deeper understanding of the topics covered in Learn React.
Hands-on guide that focuses on getting you started with React and building real-world apps as quickly as possible. It covers the fundamentals of React, including components, state, props, and event handling. It also introduces advanced concepts such as routing, Redux, and server-side rendering.
Provides a comprehensive overview of React Native. It covers topics such as building user interfaces, handling state, and working with native modules. It great resource for developers who want to learn how to build high-quality React Native applications.
Provides a comprehensive overview of full-stack development with React. It covers topics such as server-side rendering, data fetching, and authentication. It great resource for developers who want to build full-stack applications with React.
Provides a practical guide to building mobile applications with React Native. It covers topics such as building user interfaces, handling state, and working with native modules. It great resource for developers who want to learn how to build high-quality React Native applications.
Provides a collection of design patterns and best practices for developing React applications. It covers topics such as component design, state management, and performance optimization. It great resource for developers who want to learn how to build high-quality React applications.
Comprehensive guide to testing React applications. It covers topics such as unit testing, integration testing, and end-to-end testing. It great resource for developers who want to improve the quality of their React applications.

Share

Help others find this course page by sharing it with your friends and followers:
Our mission

OpenCourser helps millions of learners each year. People visit us to learn workspace skills, ace their exams, and nurture their curiosity.

Our extensive catalog contains over 50,000 courses and twice as many books. Browse by search, by topic, or even by career interests. We'll match you to the right resources quickly.

Find this site helpful? Tell a friend about us.

Affiliate disclosure

We're supported by our community of learners. When you purchase or subscribe to courses and programs or purchase books, we may earn a commission from our partners.

Your purchases help us maintain our catalog and keep our servers humming without ads.

Thank you for supporting OpenCourser.

© 2016 - 2024 OpenCourser