We may earn an affiliate commission when you visit our partners.

Building Reusable React

Looking to learn how to create a component library for your team using Javascript and React? This course will teach you enough controlled components, refs, reducers and compound components to get your custom library off the ground.

By the end, you’ll know how to build declarative, reusable components, ensuring your codebase adheres to the DRY (Do Not Repeat Yourself) principle.

On top of all that, this course is jam-packed with interactive challenges to stress-test your new knowledge and truly embed your learning, so you’ll become a truly effective React Developer in no time.

Enroll now

Or subscribe to Coursera Plus

And get unlimited access to Coursera

Three deals to help you save

We found three deals and offers that may be relevant to this course.

Save money when you learn. All coupon codes, vouchers, and discounts are applied automatically unless otherwise noted.

Valid until December 12

Annual Subscription Savings

Unlock programs from Google, Microsoft, and IBM and join 77% of learners who reported positive career outcomes.

Only $239!

Valid for a limited time only

Future-proof your career

Access O'Reilly books, live events, courses, and more. Save with an annual subscription.

Take

15%

off

What's inside

Syllabus

Introduction - Resusable React Fundamentals

Learn the fundamentals of reusable React, with a focus on props, custom hooks and custom events.

Controlled Components and Refs

Learn about controlled components, examine state in class vs functional components, and find out how to wield the useRef hook as you build an interactive form.

Reducers

Learn the basics of reducers in React, compare the useState and useReduce hooks, and investigate custom hooks.

Compound Components

Learn how to utilize compound components and how they can replace props as you wrap up the Reusable React course.

Good to know

Know what's good

, what to watch for

, and possible dealbreakers

Explores reusable React fundamentals, which is standard in building web applications

Designed for beginners and students with prior experience in JavaScript and React

Interactive challenges and exercises provide hands-on practice and reinforce learning

Taught by Cassidy Williams, an experienced instructor specializing in React development

Covers essential React concepts such as controlled components, refs, reducers, and compound components

Suitable for both individual learners and teams looking to improve their React development skills

Save this course

Save Building Reusable 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 Building Reusable React with these activities:

Compile Resources and Materials

Show steps

Organize course content, making it easier to access and retain key concepts.

Show steps

Gather and categorize notes, assignments, and study materials.
Create summaries to condense and reinforce key concepts.

Review React Fundamentals

Show steps

Start the course with a good grasp of fundamental React concepts to fill in any knowledge gaps and build a stronger foundation for the course materials.

Browse courses on React

Show steps

Review the official React documentation.
Take practice quizzes covering basic React concepts.
Do mock coding problems that focus on writing React components.

Follow Tutorials for Advanced React Concepts

Show steps

Expand on materials covered in the course by following tutorials that further delve into the advanced React concepts covered in this course.

Browse courses on Controlled Components

Show steps

Find a tutorial for each advanced concept.
Follow each tutorial step-by-step, implementing the concepts in your own code.
Reflect on how these concepts work and how they can be applied to larger projects.

Three other activities

Expand to see all activities and additional details

Show all six activities

Create Explanatory Blog Post or Video

Show steps

Enhance understanding by explaining concepts to others, solidifying knowledge and identifying areas for further improvement.

Show steps

Choose a specific concept or topic related to the course.
Research and organize information to create a comprehensive explanation.
Write or record your explanation in a blog post, video, or other format.

Build a Reusable React Component Library

Show steps

Apply course knowledge to a practical project by building a reusable React component library, allowing for smoother codebase development in the future.

Browse courses on Component Library

Show steps

Design the architecture and structure of the component library.
Develop the individual components and ensure they are reusable and maintainable.
Test the library thoroughly to ensure it functions as intended.
Document the library for future use.

Mentor Junior React Developers

Show steps

Solidify understanding by sharing knowledge and providing guidance to others, reinforcing concepts and identifying areas for improvement.

Browse courses on Code Review

Show steps

Find opportunities to mentor junior React developers.
Provide code reviews, offer guidance on best practices, and answer questions.
Reflect on your own understanding as you help others.

Career center

Learners who complete Building Reusable React will develop knowledge and skills that may be useful to these careers:

React Native Developer

React Native Developers build mobile applications using the React framework. They combine their knowledge of React and mobile development to create engaging and performant user interfaces. This course provides a strong foundation for aspiring React Native Developers, as it covers essential concepts like custom components, controlled components, and redux. By learning how to build reusable React components, React Native Developers can streamline their development process, create more consistent and maintainable code, and build high-quality mobile applications.

See salaries and explore the career path for React Native Developer

React Developer

React Developers specialize in developing and maintaining user interfaces using the React framework. They work closely with designers and other engineers to bring visions to life and ensure that applications are responsive, performant, and bug-free. This course is an excellent resource for aspiring React Developers, as it provides a comprehensive overview of reusable React concepts. By completing this course, learners will build a solid foundation in reusable component development, custom events, reducers, and compound components, all of which are essential technologies for React Developers.

See salaries and explore the career path for React Developer

Technical Architect

Technical Architects design and develop the architecture of software systems. They work with stakeholders to understand business requirements and translate them into technical solutions. This course provides Technical Architects with a valuable foundation in reusable React development, as it covers essential concepts like custom components, controlled components, and reducers. By incorporating reusable React techniques, Technical Architects can help their teams develop more efficient, consistent, and maintainable software systems.

See salaries and explore the career path for Technical Architect

Software Architect

Software Architects design and develop software systems and oversee their implementation. They work on the high-level design and architecture of software applications, ensuring that they meet business requirements and are scalable, reliable, and maintainable. This course can be a valuable resource for Software Architects who want to learn more about reusable React development, as it provides a deep dive into creating custom components, using reducers, and developing compound components. By incorporating reusable React techniques, Software Architects can help their teams develop more efficient, consistent, and maintainable software systems.

See salaries and explore the career path for Software Architect

Software Engineer

Software Engineers design, develop, and maintain software systems. They work on all aspects of the software development process, from requirements gathering to deployment. This course provides Software Engineers with a valuable foundation in reusable React development, as it covers essential concepts like custom components, controlled components, and reducers. By incorporating reusable React techniques, Software Engineers can improve the efficiency and maintainability of their codebases.

See salaries and explore the career path for Software Engineer

Front-End Software Engineer

Front-End Software Engineers design, build, and maintain user interfaces. They work with static and dynamic content, ensuring that it is visually appealing, engaging, and functional across diverse devices and browsers. This course's focus on building reusable React components would be very useful to a Front-End Software Engineer, as it could help them develop custom components that can be used across multiple projects, ensuring consistency and efficiency. Additionally, the course covers React fundamentals like props, custom hooks, and custom events, all of which are essential for Front-End Software Engineers to master.

See salaries and explore the career path for Front-End Software Engineer

System Analyst

System Analysts design and develop software systems to meet the needs of businesses or organizations. They work with stakeholders to understand their requirements and ensure that the software is efficient and effective. This course provides System Analysts with a valuable foundation in reusable React development, as it helps them understand the technical aspects of software development. By learning about custom components, controlled components, and reducers, System Analysts can make more informed decisions about the development process and ensure that the software meets the needs of the organization.

See salaries and explore the career path for System Analyst

Full-Stack Developer

Full-Stack Developers are responsible for both the front-end and back-end development of web applications. They work on all aspects of the application, from the user interface to the database. This course provides Full-Stack Developers with a valuable foundation in reusable React development. By learning how to create custom components, use reducers, and develop compound components, Full-Stack Developers can improve the efficiency and maintainability of their codebases.

See salaries and explore the career path for Full-Stack Developer

Quality Assurance Engineer

Quality Assurance Engineers test and evaluate software products to identify and fix bugs. They work with developers to ensure that software is reliable and meets customer requirements. This course provides Quality Assurance Engineers with a valuable foundation in reusable React development, as it helps them understand how to test and evaluate React applications. By learning about custom components, controlled components, and reducers, Quality Assurance Engineers can develop more effective test plans and ensure that React applications are of high quality.

See salaries and explore the career path for Quality Assurance Engineer

Web Developer

Web Developers design and develop websites and web applications. They work on both the front-end and back-end of websites, ensuring that they are visually appealing, engaging, and functional. This course can be a helpful resource for Web Developers who want to learn more about reusable React development. By learning how to create custom components, use reducers, and develop compound components, Web Developers can improve the efficiency and maintainability of their codebases.

See salaries and explore the career path for Web Developer

UI/UX Designer

UI/UX Designers create the look and feel of websites and applications. They work closely with developers to ensure that the user experience is seamless and intuitive. This course can be helpful for UI/UX Designers who want to learn more about reusable React development. By understanding how to create custom components, use reducers, and develop compound components, UI/UX Designers can create more efficient and consistent designs that are easier for developers to implement.

See salaries and explore the career path for UI/UX Designer

Project Manager

Project Managers plan, execute, and manage software development projects. They work with stakeholders to define project scope, timelines, and budgets. This course provides Project Managers with a valuable foundation in reusable React development, as it helps them understand the technical aspects of software development. By learning about custom components, controlled components, and reducers, Project Managers can make more informed decisions about the development process and ensure that the project is completed on time and within budget.

See salaries and explore the career path for Project Manager

Product Manager

Product Managers are responsible for the overall vision and development of products. They work with stakeholders to define product requirements and ensure that the product meets customer needs. This course provides Product Managers with a valuable foundation in reusable React development, as it gives them a deeper understanding of the technical aspects of product development. By learning about custom components, controlled components, and reducers, Product Managers can make more informed decisions about the development process and ensure that the product is built to be efficient and maintainable.

See salaries and explore the career path for Product Manager

Business Analyst

Business Analysts gather and analyze business requirements to define the scope and specifications of software products. They work with stakeholders to understand their needs and ensure that the software meets their expectations. This course provides Business Analysts with a valuable foundation in reusable React development, as it helps them understand the technical aspects of software development. By learning about custom components, controlled components, and reducers, Business Analysts can make more informed decisions about the development process and ensure that the software meets the needs of the business.

See salaries and explore the career path for Business Analyst

Data Analyst

Data Analysts collect, clean, and analyze data to help businesses make informed decisions. They work with data from a variety of sources to identify trends and patterns. This course may be useful for Data Analysts who want to learn more about reusable React development, as it can help them develop more efficient and maintainable data visualization tools. By learning about custom components, controlled components, and reducers, Data Analysts can build interactive data visualizations that are easy to update and maintain.

See salaries and explore the career path for Data Analyst

Reading list

We've selected seven 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 Building Reusable React.

Functional-Light JavaScript

Save

Is highly recommended to bolster your understanding of functional programming concepts in JavaScript. It provides a strong foundation for grasping how React leverages functional programming techniques. If you want to strengthen your theoretical understanding of React's core principles, this book is highly valuable.

Functional-Light JavaScript: Balanced, Pragmatic FP...

Paperback

A Million And One Random Digits

Save

A classic in the JavaScript community, this book delves into the core principles and best practices of the language. Its insights into JavaScript's design and quirks are highly beneficial for any JavaScript developer. It provides a deeper understanding of the language, which can enhance your React development experience.

A Million And One Random Digits

Paperback

Check price

A Million And One Random Digits

Kindle Edition

Check price

The Road to Firebase

Save

An accessible introduction to React, this book starts from scratch and gradually introduces core concepts. It's a great way to reinforce your understanding of the fundamentals covered in the course and serves as a solid foundation for further exploration of React.

The Road to Firebase: Your journey to master...

Paperback

The Road to Firebase: Your journey to master...

Kindle Edition

Effective Typescript

Save

A practical and detailed guide to writing effective TypeScript code, this book offers specific tips and techniques to improve your code quality, maintainability, and performance. It's an invaluable resource for developers using TypeScript in React or any other context.

Learning React

Save

This beginner-friendly guide is good for those new to React, providing a solid foundation in its core concepts.

Learning React: Modern Patterns for Developing...

Paperback

Learning React: Functional Web Development with...

Paperback

$$$

Learning React: Modern Patterns for Developing...

Kindle Edition

CLEAN CODE

Save

Emphasizes the importance of writing clean and maintainable code, which is essential for building reusable and scalable React components.

The Pragmatic Programmer

Save

While not specific to React, this classic book provides valuable insights and best practices for software development, including object-oriented programming and design principles.

The Pragmatic Programmer: Your Journey To Mastery,...

Hardcover

Pragmatic Programmer, The: From Journeyman to Master

Kindle Edition

(Italiano) Pragmatic Programmer - Edizione del 20°...

Kindle Edition

(Italiano) Il Pragmatic Programmer: Guida per manovali del...

Kindle Edition

(中文) The Pragmatic Programmer: access to the highest...

Paperback

Pragmatic programmer (Korean Edition)

Paperback

$$$

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

Facebook

Copy Link

Similar courses

Here are nine courses similar to Building Reusable React.

Testing in React 18

Most relevant

Testing Mobile Apps in React Native

Advanced React & Storybook: From Components Library to CI/CD

Advanced React & Storybook: From Components Library to...

Developing Front End Apps with React

Code School: Powering up with React 15

Building Navigational Workflows Using React

Level

Advanced

Via

Coursera

Institution

Scrimba

Instructor

Cassidy Williams

Language

English

Good to know

Explores reusable React fundamentals, which is standard in building web applications

Designed for beginners and students with prior experience in JavaScript and React

Interactive challenges and exercises provide hands-on practice and reinforce learning

Taught by Cassidy Williams, an experienced instructor specializing in React development

Covers essential React concepts such as controlled components, refs, reducers, and compound components

Suitable for both individual learners and teams looking to improve their React development skills

Share and help others discover this course.

Facebook

Link

Don't miss out

Enroll today to gain access to this course

Enroll in this course

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.