Schedule

  • 8:00-9:00AM

    Registration and Breakfast

  • 9:00-9:15AM

    Introduction

  • 9:15-9:45AM

    Foundations of Design Systems

    Emma Wedekind - LogMeIn

    Design systems are in the world around us, from street signs to the layouts of grocery stores, and our products are no exception. In this talk we'll delve into the world of Design Systems and learn what they are and what it takes to build one.

  • 9:45-10:30AM

    A Guided Tour of React Hooks

    Dave Ceddia - Tiny Wins

    Hooks offer a simple, concise way to write stateful React components without classes.

    In this talk you'll learn about the "magic" behind how Hooks work and get to see a few examples of them in action. We'll cover the big four: useState, useEffect, useReducer, and useContext, plus how to write your very own custom hooks.

    You may never want to write a class again.

  • 10:30-11:00AM

    Accessibility in the Age of Components

    Ayesha Mazumdar - Optimizely

    We often build component libraries to improve consistency, collaboration, and customization for a given product. But what if a component library could also scale accessibility across the entire organization? Building accessible components can help distribute responsibility across all of design and engineering, without needing everyone to be an expert on the nitty-gritty details. In this session, we'll go through specific component examples and use cases to help you and your team contribute to a better, more inclusive web.

  • 11:00-11:45AM

    Break

  • 11:45-12:15PM

    Using react-testing-library to Write Stronger Tests

    Matt Crowder - Appian

    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).

  • 12:15-1:30PM

    Lunch

  • 1:30-2:00PM

    Case Study: React Monorepos at Scale

    Alistair MacDonald - Houghton Mifflin Harcourt

    Join us for an in depth case-study on how Houghton Mifflin Harcourt adopted a Monorepo architecture to serve multiple React projects in one Git repository. We currently serve 7 Create React Apps, 9 component libraries and 4 storybooks among 15 developers. Learn about the acceleration we achieved and where we discovered pitfalls. Learn how to get started with your own CRA Monorepo as we share our React Monorepo infrastructure with you: https://github.com/react-workspaces/react-workspaces-playground.

  • 2:00-3:00PM

    ⚡ Lightning Talks ⚡

  • 3:00-3:30PM

    Developer First: A New Leadership Mindset

    Kate Wardin - Target

    People don’t leave companies, the saying goes, – they leave managers.

    As a technology leader passionate about the people side of software development, I have always been captivated by the impacts of great and horrible bosses; on the individual, team, and organization.

    Organizations will continue to face an increasingly difficult uphill battle as we try to recruit top technical talent. The unfortunate reality is that there simply are not enough qualified candidates for the increasing demand.

    Therefore, there is a dire need to significantly change our approach to leadership if we want to continue building and retaining strong, empowered, motivated, and loyal teams.

    Enter Developer First leadership.

    Developer First leadership is the drive to focus on the growth and advancement of your team members before yourself.

    This approach is centered around the idea that developers should not work for their leaders. Instead, their leaders must work for them!

    Kate will demonstrate how developer-first leadership can translate directly to the daily lives of technical leaders.

    Participants will leave with tactical methods to truly embrace the human side of software development and serve your teams as intentional, respectable, and inspiring leaders.

  • 3:30-4:00PM

    From React to Native

    Laura González - The Guardian

  • 4:00-4:30PM

    Break

  • 4:30-5:00PM

    Why You Should Make All of Your React Apps PWAs and how

    Milecia McGregor - Flipped Coding

    Developers are usually familiar with the phrase, progressive web app (PWA), but aren't 100% sure of what it is. Most would be surprised to know that they are about 50% of the way there with most of their applications just through best practices. Once you have a checklist for creating PWAs, you'll be able to take any web application and apply it regardless of the framework you use.

    React in particular makes it incredibly easy to create PWAs or to update your current React apps and make them PWAs. In this talk, we'll cover the 8 necessary attributes of a PWA, some of the advanced PWA attributes, and how to create/update React apps to make them PWAs. By the end of this talk, attendees should have a concrete understanding of what a PWA is and how to make one with React.

  • 5:00-5:30PM

    I've Fallen Into a Large Codebase, and I Can't Get Up!

    Cameron Yick - Datadog

    Developers spend more time reading existing code than writing new code. Navigating codebases is especially important when joining new projects, or when investigating external libraries. Unfortunately, getting a full understanding of a system can be a slow process, especially in large codebases. Incomplete or inaccurate mental models contribute to bugs and slow development. Handmade architecture diagrams can help, but it is easy for these to drift out of sync from the code they originally described.

    Automatically generated visualizations can help to untangle this complexity, but they aren't mainstream (yet). This talk will share a few existing tools and techniques for visualizing relationships in source code developed for other languages, such as Smalltalk and Java. We’ll examine how these "old" techniques could benefit modern Javascript/Typescript codebases. Next, we'll explore techniques currently available to React developers beyond the standard devtools, including automatic code annotation, state charts, annotated code maps, and network analysis tools to make sense of a file’s dependency tree. I'll close by sharing ideas for visual analysis from other fields that can be applied to understanding concepts in frontend code.

  • 6:00PM

    Party 🎉