Testing react applications for professional engineers

Learn the best practices and strategies to effectively test your react components and applications.

4.65 (23 reviews)
Udemy
platform
English
language
Software Testing
category
instructor
219
students
2.5 hours
content
Aug 2021
last update
$54.99
regular price

What you will learn

Shipping confident, well tested and stable code

The best practices for testing react applications

What should you test in your frontend applications

How to test third-party providers such as Stripe

How to test navigation flow with react router

How to test your application for accessibility

How to test custom hooks

Description

Hi ! I' m Kati Frantz , and I've built tons and tons of React applications. Everyone can ship software, but shipping quality software requires a lot of quality assurance and best practices. A professional ships confident, well tested, and stable code.

This is the standard, but testing react applications can be painful and complex. What are the best practices ? What should I test ? How can I test a react router based, redux store connected stripe checkout form ???

Be glad you found this course, because this course will show you the best practices for testing components and full scale applications.

We'll be testing an e-commerce application ?? with Stripe Checkout. Here are some of the features we'll be testing:

  • Reusable checkboxes

  • External API powered products listing

  • Product tiles accessibility

  • Off canvas filter menu (with portals)

  • Prevent scroll on canvas open

  • Event listener cleanups

  • Debounced products search

  • Context dependent components

  • React router page navigation

  • Redux connected components and pages

  • Custom hooks

  • Checkout modal

  • Stripe checkout

By the end of this course, you'll be able to:

  • Implement a testing solution for any react application

  • Test components connected to state management stores

  • Test components that call external APIs

  • Test components that use other component packages

  • Test router connected components

  • Test components that use a huge range of design patterns such as render props and composition.

  • Test components with accessibility in mind.

And so much more ! Go ahead and enroll to the course and join me to learn techniques and strategies you can use in applications and job starting today!

Content

Introduction

Introduction
How to get the project source code

Testing with the DOM

Test a component with ReactDOM
Test a checkbox with react testing library
Fire native events on elements
Checked and unchecked checkbox states
Automate accessibility tests
Find elements using text and alt text
Test for absence of elements

Test context connected components

Test context connected elements
Test array rendering elements
Test parent components that render children
Test context provider values
Test the toggle scroll behaviour

Test react hooks

Test the use filters hook
Test use outside click hook
Test hook cleanup functionality

Integration tests - Test API connected components

Integration test for fetch products
Generate test data with test-data-bot
Test open and close off canvas
Test product search functionality

Test react router connected components

Introduction to part 2
Test router dependent components with memory router
Test a component with use location hook
Test a user can navigate to a page

Test the checkout process

Test add product to cart
Test checkout with stripe

Screenshots

Testing react applications for professional engineers - Screenshot_01Testing react applications for professional engineers - Screenshot_02Testing react applications for professional engineers - Screenshot_03Testing react applications for professional engineers - Screenshot_04

Reviews

Victory
November 8, 2022
Amazing course, Kati's delivery is top-notch. Straight to the point with clear explanations. Definitely recommend.
Varchasvi
August 20, 2022
Really great hands-on examples. My suggestion to everyone is to try writing the tests on your own first because there can be multiple ways of writing one single test. After writing the test on your own, check what Kati has to say about the test case.

Charts

Price

Testing react applications for professional engineers - Price chart

Rating

Testing react applications for professional engineers - Ratings chart

Enrollment distribution

Testing react applications for professional engineers - Distribution chart
4087156
udemy ID
5/29/2021
course created date
8/18/2021
course indexed date
Bot
course submited by