ReactFoo 2019

The React framework allows you to shape the Component tree in a variety of different ways. The community has been exploring several ways to simplify the management of various tasks and have discovered a set of patterns, now prevalent in libraries such as React Router, React-Motion, Downshift, etc. These are the patterns that really make React fun to use.

Grounded in principles such as...

• Separation of concerns between components
• Uni-directional data flow
• Crisp communication via callbacks.

...we will explore a bunch of patterns and their practical use cases. These include:

• Higher Order Components
• Function as Child Component
• Domain and Service components
• React Context for data propagation
• Notification callbacks
• Delegation for passing multiple callbacks
• Container and Presentation Components

The combination of these patterns gives you a powerful toolbox to solve a vast variety of problems in React. We will use real-world examples that will help you assimilate these patterns in your own projects.

Outline

• Starts with a quick intro to the foundations of a Component in React
• Leads into the core principles of Component Driven Development
• Explores the above list of patterns with a concrete example to tie it together
• All examples are based on building an “Apple Watch Face”. The examples show how to tackle the various parts of the Component tree using the above patterns
• Closes with further references

Speaker bio

Pavan Podila has been building Frontend applications since 2001. In this time he has used a variety of technologies, tools and platforms ranging from Java, .Net/WPF to iOS/macOS and of course the Web platform.

For the past 10 years he has been building large scale financial apps for some of the big names on the Wall St. Most of his focus these days is on Angular (1.x, 2.x), React, Node.js and a variety of client-side tools and libraries.

Pavan is a Google Developer Expert (GDE) for Web Technologies. He is a published author of WPF Control Development Unleashed, was Microsoft MVP for Client App Dev (2008 - 2011) and is the creator of QuickLens, a Mac App for UI Designers/Developers. He also likes to write articles and create videos courses at Tuts+. Current side project is to finish up a Packt Book on MobX and build courses on theuidev.com.

He loves to spend his free time playing Ping Pong or sketching on his iPad Pro.

When time permits, he also blogs at blog.pixelingene.com

• Twitter
• LinkedIn

Links

• Talk on State of Statement in React at Charleston, SC for SyntaxCon 2017: https://www.youtube.com/watch?v=LWuOj0etYBQ
• Talk on ngrx/Store at Google Office, NYC: https://www.youtube.com/watch?v=CdY5RkMAPAA&t=328s