Developing and deploying production applications with React is one thing, but being confident that you're not shipping a hidden bug is something else! Knowing how to configure and use testing tools is critical to your success in shipping with confidence, and React's model opens up testing productivity most of us couldn't even dream of before.

I have personally written tens of thousands of tests for production applications and my open source modules. Hundreds of developers have improved their testing knowledge from this workshop.

Topics:

• Learn the fundamentals of what a test is and what role testing frameworks play
• Configure Jest for a client-side React project
• Learn what Code Coverage is and how to properly use that metric
• Write unit tests for JavaScript utilities and React components
• Learn what snapshot testing is and how to use it effectively
• Write integration tests for a React application
• Configure Cypress for a web application
• Write E2E (end-to-end) tests with Cypress

Advanced React Patterns with Hooks is an ADVANCED workshop. Making React components that can be used in multiple places is not hard. What is hard is when the use cases differ. Without the right patterns, you can find yourself with a highly complex component that requires a lot of configuration props and way too many if statements.

With this course, you'll not only learn great patterns you can use but also the strengths and weaknesses of each, so you know which to reach for to provide your components the flexibility and power you need. If you're already experienced with React, you'll enjoy the fact that this is all using React's latest "Hooks" feature which makes these patterns even better and even introduces some new ones.

With the massive improvements to function components in React via hooks and suspense, you may be interested in seeing how to refactor a typical class component to a simpler class component that uses React Hooks features. In this course, we'll take a modern React codebase that uses classes and refactor the entire thing to use function components as much as possible. We'll look at state, side effects, async code, caching, and more!

Want a primer on hooks and suspense? Watch my React Hooks and Suspense Playlist!

React has two new upcoming features that will blow your socks off making writing applications much easier. In this extremely hands-on workshop, you'll be able to play with these new features and have the skills you need to take them to your own applications.

React Suspense has been released in React 16.6.0 and React Hooks is currently in alpha! Let's see how we can use these and more features of React together to write simpler React components.

This course is for React newbies and those looking to get a better understanding of React fundamentals. With a focus on React fundamentals, you'll come out of this course knowing what problems React can solve for you and how it goes about solving those problems. You will have a good grasp on what JSX is and how it translates to regular JavaScript function calls and objects.

Each lesson in this course is just a single index.html file which will help you keep your focus on learning React and not distracted by all the tools that make production applications work. The course wraps up with a lesson on how to move from these index.html files to a more production ready development environment and even how to deploy your app to a great service like Netlify.

Enjoy!

NOTE: This content is pre-hooks, but 80% of it is still super relevant.

Making React components that can be used in multiple places is not hard. What is hard is when the use cases differ. Without the right patterns, you can find yourself with a highly complex component that requires a lot of configuration props and way too many if statements. With this course, you'll not only learn great patterns you can use, but also the strengths and weaknesses of each so you know which to reach for to provide your components the flexibility and power you need.

I have contributed to and published some of the most successful React components in the React ecosystem. Through that experience, I've learned and taught patterns that enhnace flexibilty, usefulness, and simplicity.

Topics:

• Use the Compound Components Pattern to write React components that implicitly share state while giving rendering flexibility to the user
• Share code and enhance your components with the Higher Order Components Pattern
• Give full rendering power to users with the Render Props Pattern
• Improve the render prop API with the Prop Collections and Prop Getters Patterns
• Provide total logic control with the Controlled Props and State Reducer Patterns
• Take advantage of React's Context API to share state throughout the application with the Provider Pattern

The goal of a test is to increase your confidence that the subject of your test is functioning the way it should be. Not all tests provide the same level of confidence (some provide very little confidence at all). If you're not doing things correctly, you could be wasting your time and giving yourself a false sense of security (even worse than having no tests at all).

I have personally written tens of thousands of tests for production applications and my open source modules. Hundreds of developers have improved their testing knowledge from this workshop.

Topics:

• The fundamentals behind tests and testing frameworks the distinctions of different forms of testing
• How to write Unit tests
• How to write Integration tests
• When and how to mock dependencies
• How to use test driven development to write new features
• How to use test driven development to find and fix bugs
• Core principles of testing to ensure your tests give you the confidence you need

Have you ever needed to change the API to a widely used function in your JavaScript application? Find and replace can really only take you so far. What about the frustration of iterating over and over again on pull requests because of simple code mistakes developers keep making? These are only some of the problems that you can solve with a basic understanding of Abstract Syntax Trees and the tools you can use to inspect and manipulate them.

Join Kent C. Dodds and learn invaluable skills you can take back to improve the developer experience in your JavaScript applications.

Building and deploying web applications with confidence is challenging. Verifying that what you're deploying to production actually works requires a solid suite of automated tests. Knowing how to configure tools and write tests that enhance your development experience is vital to your success.

In this class, we'll explore the merits and tradeoffs of different forms of testing and get into configuring and using specific tools to increase confidence in deploying our applications. Join Kent C. Dodds and learn invaluable skills you can take back to improve your JavaScript applications.

The ECMAScript standard is now on a yearly release cycle. Keeping up with the latest features can make you more productive and your code more expressive and maintainable. In this workshop, we'll learn about the features from ES6 to today that you're likely to use and benefit from on a day-to-day basis.

Kent has been using and teaching the latest features of JavaScript with Babel for years. He represents PayPal on the TC39. Kent has taught thousands of developers the new and useful features of JavaScript.

Topics:

• Simple ES6 features like let, const, and template literals
• New object and array operators and syntax like destructuring, rest and spread, and object literal syntax enhancements
• New function syntax and operators like arrow functions and rest/spread
• Data structures like Map/Set and their weak counterparts
• How to use Promises effectively
• How and when to use async/await
• Really useful new APIs on built-ins like Object, String, Array, and even new syntax for RegExp
• How and when to use public class fields to avoid issues with "this" bindings

TODO 😅

Participating in open source has been one of the most rewarding experiences of my career. The feeling of sharing something I've created, and hearing that others are using it in their applications is incredible. But writing and managing an open source project is challenging. I want to help you get started with open source or improve your current projects with some of the things I've learned by publishing and maintaining over 60 npm packages.

• Learn how to set up a new project locally and on GitHub for development
• Learn how to configure npm for publishing the project to the npm registry
• Learn how to transpile the source with babel
• Learn how to add unit tests and code coverage
• Learn how to add CI (with Travis CI) to run tests automatically and report coverage stats to codecov.io
• Learn how to automate releases with semantic-release
• Learn how to distribute a browser build with webpack

Building and deploying complex frontend applications can get complicated quickly. Webpack simplifies this with a huge list of features that cater to all kinds of JavaScript apps. In this class, we'll explore these features to optimize an application for performance and simplicity. In this workshop, you'll learn:

• The role of webpack and fundamental concepts like loaders and plugins
• How to setup a webpack file (and use webpack-validator to save yourself hours of debugging typos)
• How to setup a unit testing environment for a webpack project
• How tree-shaking works and how to leverage it for smaller bundles
• How to maintain sane file sizes with webpack code splitting
• How to leverage hashing for long term caching
• How to group vendor/common files with the CommonsChunkPlugin to save bytes in the code that changes regularly
• The latest features of Webpack 2!

NOTE: I no longer recommend using AVA in React Projects. Instead I recommend using Jest. Incidentally, I have a workshop for that too: react-jest-workshop.

"Feel free to submit a PR!" - words often found in GitHub issues, but met with confusion and fear by many. Getting started with contributing open source is not always straightforward and can be tricky. With this series, you'll be equipped with the the tools, knowledge, and understanding you need to be productive and contribute to the wonderful world of open source projects. Much of this series speaks about GitHub, but most of the concepts are generally applicable to contributing to any open source project, regardless of where it's hosted.

So enjoy the course and start contributing to the projects you use and love today!

How much work would it take for you to move all of your directives and their templates to several different new directories? You'd have to update the templateUrl, script tags, etc., etc. With webpack, this can be trivial. For example, you don't need to worry about loading your templates in the $templateCache ever again. Webpack will help you modularize your css and tests. All of these things and more in this series so you can start using webpack with Angular today.

AngularJS is one of the most popular frontend frameworks out there right now. If you haven't tried it yet, prepare to be amazed! Here's what we'll cover:

1. Templates/Expressions - Your View
2. Module - Your app's namespace
3. Directives - DOM Interface
4. Filters - Display utils
5. Scope - What on earth is this thing!?
6. Controllers - The View Model
7. Services - Common utilities
8. Working with third-party modules
9. Routing - Single Page App with state in the URL
10. Firebase & AngularFire - A full web application with no server setup required!

We'll be following through a repository hosted on GitHub. There's a branch for each concept, so you can play around with the code and then catch right back up with the next branch. So come on, and let's learn AngularJS!

JSON Web Tokens (JWT) are a more modern approach to authentication. As the web moves to a greater separation between the client and server, JWT provides a terrific alternative to traditional cookie based authentication models. For more information on JWT visit http://jwt.io/

In this series, we'll be building a simple application to get random user information from a node server with an Angular client. We'll then implement JWT to protect the random user resource on the server and then work through the frontend to get JWT authentication working.

By the end, we'll have an application which has a single username/password combination (for simplicity) and uses tokens to authorize the client to see the random user information. You'll be able to login, get random users, and logout.