Building User Interfaces Using Functional React Components (Coursera)

Offered by NIIT StackRoute,
Building User Interfaces Using Functional React Components (Coursera)

React Components are generally implemented using Classes. Although they work well, they have their own set of limitations. The stateful logic provided by the class components lack reusability. To enhance the productivity, codes developers are expected to develop codes with reusability.

Class Deals by MOOC List - Click here and see Coursera's Active Discounts, Deals, and Promo Codes.

This course will enable you to develop simple, readable, React components with reusable stateful logic using JavaScript functions and React Hooks. You will also explore the different React Hooks and test the stateful logic.

What You Will Learn
Build React functional components and create reusable and testable stateful logic using React Hooks

Syllabus

WEEK 1
Build React Components using Functions and React Hooks
"A component is the fundamental unit of an SPA which is reusable as it can exist independently. In React, the state of the component is managed within the component. It is therefore recommended to develop a reusable stateful logic that can be used by multiple components. As a React developer, you need to create function components that support Hooks for creating reusable stateful logic .In this learning sprint, you will explore built-in React Hooks and develop custom Hooks with reusable stateful logic. The hands-on assignments included in this learning sprint will enable you to manage state in function components, create side effects like fetching data from the server or handling timer events using built-in React Hooks. You will also learn to develop reusable stateful logic using custom Hooks."

WEEK 2
Test Custom Hooks Using React Hooks Testing Library
"Any unit of the code written should be testable. In React, the custom Hooks help to develop reusable stateful logic and hence, as a developer you should write a test code to test the custom Hooks.In this learning sprint, you will explore the functionalities provided by the react-hooks-testing-library for testing custom Hooks. The hands-on assignments included with the sprint will enable you to write test cases to test custom Hooks that manage the state of the component with event triggers, asynchronous server calls and change in props or context values."

Go to Class
MOOC List is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

Related Courses

Advanced React (Coursera) Coursera
Meta

Advanced React (Coursera)

Learn how to use more advanced React concepts and features, optimize and debug your React applications, and become proficient in using React Bootstrap and JSX. You’ll examine different types of React components, learn various characteristics and when to use them. You’ll start working with hooks, effects and other functional components. You’ll find out how routing is used in React to customize the users' experience, you’ll create a web application that consumes API data, and you'll get familiar with the most commonly used React framework integrations, tools, and debugging approaches.

Nov 2nd 2026
4 Weeks
Web Application Development: Basic Concepts (Coursera) Coursera
University of New Mexico

Web Application Development: Basic Concepts (Coursera)

This is the first course in a Coursera Specialization track involving Web Application Architectures. This course will give you the basic background, terminology and fundamental concepts that you need to understand in order to build modern full stack web applications. A full stack web developer is familiar with each "layer" of the software technologies involved in a web application, including data modeling and database technologies, the web server environment and middleware components, network protocols, the user interface and basic visual design and user interaction concepts.

Nov 9th 2026
5-12 Weeks
Ajax Basics (Coursera) Coursera
Board Infinity

Ajax Basics (Coursera)

This Ajax Basics course is designed for beginners who want to learn how to build web applications that dynamically update content without reloading the entire page. In this course, you will learn the fundamentals of Ajax, including its features, advantages, and common usage scenarios.

Nov 2nd 2026
3 Weeks
Learn React (Coursera) Coursera
Scrimba

Learn React (Coursera)

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.

Nov 16th 2026
3 Weeks
Introduction to HTML, CSS, & JavaScript (Coursera) Coursera
IBM

Introduction to HTML, CSS, & JavaScript (Coursera)

Want to take the first steps to become a Web Developer? This course will help you discover the languages, frameworks, and tools that you will need to create interactive and engaging websites right from the beginning. You will begin by learning about the roles of front-end, back-end, and full-stack developers and how they work together on development projects. Through this, you will also become familiar with the terminology and skills needed in your career as a web developer.

Nov 2nd 2026
4 Weeks
Interactivity with JavaScript and jQuery (Coursera) Coursera
University of California, Davis

Interactivity with JavaScript and jQuery (Coursera)

This course is the third in our JavaScript for Beginners Specialization. The scripts will become more complex and introduce more complex jQuery plugins. You will have several challenges to practice your skills throughout the course. The course objectives include how to identify objects in JavaScript; create new objects and populate them with data; manipulate objects by adding, modifying and deleting data in objects; manipulate the DOM based on the data in objects; identify and articulate how multiple functions work together to create a more complex program; and identify processes for breaking larger programs into smaller, more manageable pieces.

Nov 2nd 2026
4 Weeks