Matt Crowder

Testing React

If you had to rewrite your tests when writing a hook in your React application, then you’re writing tests wrong.

react-testing-library is what it sounds like, but more importantly, it encourages writing tests in the way that your end users will be using your components.

In this talk, I will first introduce react-testing-library, what it is, what it encourages, and what it does best. I’ll then dive into how to effectively test a react component, first a smaller component, then a “larger” component with redux, i18n dependencies, etc., then I will show all of the different APIs that react-testing-library provides, and how to effectively use them. Then, I’ll show how to write effective tests across an entire application (writing reusable, effective tests that are not brittle).

Intro to GraphQL and how to architect a JavaScript GraphQL application end to end

Learn what, where, how, and why to use GraphQL, then learn practical advice on how to architect an application using the Apollo GraphQL library for React, Angular, or Vue.

You’ll first learn the basics: what is GraphQL, where should you use it, how to use it, and why to use it, then you’ll learn more “advanced concepts” such as file placement, how to manage types, where to do mutations, queries, when to use apollo-link-state, how to utilize Apollo’s caching, how to effectively utilize an existing GraphQL backend, and lastly how to efficiently test a GraphQL application written in React.

Learn Redux By Writing Redux

Attendees of this presentation will learn how to write their own global state management library (redux), which will then help them understand how redux works and how they can use it.

We will write a third party middleware library (redux thunk), higher-order-components (HOC) that connect to the redux store, a way to subscribe to the redux store via componentDidMount, a way to unsubscribe from the redux store via componentWillUnmount, and ensuring that no unnecessary re-renders occur via shouldComponentUpdate, a React context provider, and a React context consumer (the HOC).

React Hooks

Take a trip down memory lane to help understand why the React core team released hooks.

First, we’ll dive into higher order components, what they are, the problems they solve, and why they can be troublesome.

Second, we’ll do the same with render props.

And lastly, we’ll refactor our components to use hooks and we’ll all be happy because hooks are great.