Richard Moss
Richard Moss
An avid technologist, Richard has worked on a variety of projects with a diverse range of people, crossing technologies, languages, and continents. With a particular focus on the front end space, he is currently working across teams to help build and develop the tech function at Sainsbury’s. Passionate about teaching and sharing, he’s also a co-organizer of JavaScript London and was previously a senior coach at React GraphQL Academy helping professional devs take their skills to the next level.
Rapid UI Development in React: Harnessing Custom Component Libraries & Design Systems
React Advanced Conference 2022React Advanced Conference 2022
118 min
Rapid UI Development in React: Harnessing Custom Component Libraries & Design Systems
Workshop
In this workshop, we'll take a tour through the most effective approaches to building out scalable UI components that enhance developer productivity and happiness :-) This will involve a mix of hands-on exercises and presentations, covering the more advanced aspects of the popular styled-components library, including theming and implementing styled-system utilities via style props for rapid UI development, and culminating in how you can build up your own scalable custom component library.
We will focus on both the ideal scenario---where you work on a greenfield project---along with tactics to incrementally adopt a design system and modern approaches to styling in an existing legacy codebase with some tech debt (often the case!). By the end of the workshop, you should feel that you have an understanding of the tradeoffs between different approaches and feel confident to start implementing the options available to move towards using a design system based component library in the codebase you work on.
Prerequisites:
- Familiarity with and experience working on large react codebases
- A good understanding of common approaches to styling in React
by

Incrementally Adopt Modern React Patterns in a Legacy Codebase
React Summit Remote Edition 2021React Summit Remote Edition 2021
130 min
Incrementally Adopt Modern React Patterns in a Legacy Codebase
Workshop Free
In this workshop, we’ll look at some of the approaches and techniques that can be applied when making refactors or adding new features to a legacy React codebase to bring it inline with the latest approaches. We’ll cover topics such as how to use React Hooks to share component logic in a way that will allow reuse in class components; how to incrementally introduce other patterns to a React Redux app; and how to build in flexible UI components via abstractions where we are tied to some global CSS or a component library. Along the way, we’ll touch on many React patterns and state management approaches with the ultimate aim of being able to evaluate these options and let our requirements drive the architecture in moving towards a more robust and maintainable codebase.