February 2017
Intermediate
2h 40m
English
on-demand course
Test-Driven Development for React/Redux in an Isomorphic Application
with Hany Elemary
Closed Captioning available in English, Japanese, Korean, Chinese (Simplified), Chinese (Traditional)
Overview
2.5 Hours of Video Training
Overview
In Test- Driven Development for React/Redux in an Isomorphic Application LiveLessons, Hany Elemary, Lead Consultant at ThoughtWorks, explains a paradigm shift in the testability of front-end code made possible with React/Redux. The video introduces isomorphic applications and their unique benefits and challenges, and then jumps straight into the architecture of React/Redux applications from a testability perspective. Hany follows test-driven development (TDD) principles while building a real-world example--a search application--to demonstrate effective end-to-end testing. Popular testing tools for React/Redux applications, including Enzyme, SinonJS, Expect, Nock and Mountebank, are highlighted.
Description
The need for building highly performant and maintainable user interfaces is now greater than ever. React, a library designed and developed by Facebook, can solve many of the existing problems users face today--including poor browser performance while handling dynamic interactions with high loads of data. React also solves a lot of challenges for front-end developers. Due to its popularity, other supporting frameworks, such as Redux, came into the picture to make applications more predictable, testable, and easier to debug. However, they come with a different approach to front-end development and testing.
Testability is key to maintaining the quality of any application while building confidence in the code as developers refactor their work. Writing proper tests can be a lengthy process, especially for newer frameworks such as React/Redux. Test-Driven Development for React/Redux in an Isomorphic Application LiveLessons quickly gets you up-to-speed on when to build isomorphic applications, how to effectively test your React and Redux code, and how to confidently refactor code while ensuring that business functionality is maintained.
Skill Level
Learning Objectives
Course Requirements
Who Should Take This Course?
Table of Contents
Introduction
Lesson 1: Isomorphic Applications
1.1 Isomorphic applications overview
1.2 Benefits of isomorphic applications
1.3 Challenges of isomorphic applications
1.4 When to build isomorphic applications
Lesson 2: React/Redux Overview
2.1 Paradigm shift in front-end development
2.2 Design motivation
2.3 Design principles
2.4 Uni-directional flow
Lesson 3: TDD with React/Redux - Simple Components
3.1 TDD overview
3.2 Testing pyramid: unit tests, mock integrations, contract tests, and E2E tests
3.3 Testing frameworks: Mocha, Mochawesome, Enzyme, Sinon, Istanbul
3.4 Testing simple components: display logic and behavior
3.5 Testing simple components: refactoring
Lesson 4: TDD with React/Redux - Async Operations
4.1 Async operations with Redux Sagas
4.2 Testing frameworks: Nock, Mountebank
4.3 Testing async operations with component integration
4.4 Testing failure modes
Summary
The LiveLessons Video Training series publishes hundreds of hands-on, expert-led video tutorials covering a wide selection of technology topics designed to teach you the skills you need to succeed. This professional and personal technology video series features world-leading author instructors published by your trusted technology brands: Addison-Wesley, Cisco Press, IBM Press, Pearson IT Certification, Prentice Hall, Sams, and Que. Topics include: IT Certification, Programming, Web Development, Mobile Development, Home and Office Technologies, Business and Management, and more. View all LiveLessons on InformIT at: http:// www.informit.com/livelessons
Overview
In Test- Driven Development for React/Redux in an Isomorphic Application LiveLessons, Hany Elemary, Lead Consultant at ThoughtWorks, explains a paradigm shift in the testability of front-end code made possible with React/Redux. The video introduces isomorphic applications and their unique benefits and challenges, and then jumps straight into the architecture of React/Redux applications from a testability perspective. Hany follows test-driven development (TDD) principles while building a real-world example--a search application--to demonstrate effective end-to-end testing. Popular testing tools for React/Redux applications, including Enzyme, SinonJS, Expect, Nock and Mountebank, are highlighted.
Description
The need for building highly performant and maintainable user interfaces is now greater than ever. React, a library designed and developed by Facebook, can solve many of the existing problems users face today--including poor browser performance while handling dynamic interactions with high loads of data. React also solves a lot of challenges for front-end developers. Due to its popularity, other supporting frameworks, such as Redux, came into the picture to make applications more predictable, testable, and easier to debug. However, they come with a different approach to front-end development and testing.
Testability is key to maintaining the quality of any application while building confidence in the code as developers refactor their work. Writing proper tests can be a lengthy process, especially for newer frameworks such as React/Redux. Test-Driven Development for React/Redux in an Isomorphic Application LiveLessons quickly gets you up-to-speed on when to build isomorphic applications, how to effectively test your React and Redux code, and how to confidently refactor code while ensuring that business functionality is maintained.
Skill Level
- Intermediate
Learning Objectives
- Learn the benefits and challenges of isomorphic applications li>
- Apply the testing pyramid in a React/Redux application
- Think effectively about designing testable applications
- Write end-to-end tests without the overhead of browser-driven tests
Course Requirements
- A simple, yet powerful editor: Visual Studio Code or Atom
- NodeJS
Who Should Take This Course?
- Software developers and architects who are working on React (or React/Redux) applications
Table of Contents
Introduction
Lesson 1: Isomorphic Applications
1.1 Isomorphic applications overview
1.2 Benefits of isomorphic applications
1.3 Challenges of isomorphic applications
1.4 When to build isomorphic applications
Lesson 2: React/Redux Overview
2.1 Paradigm shift in front-end development
2.2 Design motivation
2.3 Design principles
2.4 Uni-directional flow
Lesson 3: TDD with React/Redux - Simple Components
3.1 TDD overview
3.2 Testing pyramid: unit tests, mock integrations, contract tests, and E2E tests
3.3 Testing frameworks: Mocha, Mochawesome, Enzyme, Sinon, Istanbul
3.4 Testing simple components: display logic and behavior
3.5 Testing simple components: refactoring
Lesson 4: TDD with React/Redux - Async Operations
4.1 Async operations with Redux Sagas
4.2 Testing frameworks: Nock, Mountebank
4.3 Testing async operations with component integration
4.4 Testing failure modes
Summary
Source code repository: GITHUB Download
About LiveLessons Video TrainingThe LiveLessons Video Training series publishes hundreds of hands-on, expert-led video tutorials covering a wide selection of technology topics designed to teach you the skills you need to succeed. This professional and personal technology video series features world-leading author instructors published by your trusted technology brands: Addison-Wesley, Cisco Press, IBM Press, Pearson IT Certification, Prentice Hall, Sams, and Que. Topics include: IT Certification, Programming, Web Development, Mobile Development, Home and Office Technologies, Business and Management, and more. View all LiveLessons on InformIT at: http:// www.informit.com/livelessons
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Watch now
Unlock full access
More than 5,000 organizations count on O’Reilly
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.Julian F.
I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.Addison B.
I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.Amir M.
I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.