We may earn an affiliate commission when you visit our partners.
Course image
Cassidy Williams

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

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
Read more
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
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
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
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
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
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
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.
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.
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.
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.
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.
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.
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.
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.
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.
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.
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.
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.
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.
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.
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.

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.
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.
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.
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.
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.
Emphasizes the importance of writing clean and maintainable code, which is essential for building reusable and scalable React components.

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