Siddharth Kshetrapal

This is a meta talk about building design systems and all the angles you can approach it from. 

""Design systems are for people"", not just dev and design people, all the people. There are so many angles that you can approach design systems from and all of them are valid. I’ve been doing this for more than 2 years now, and I’m still discovering new ideas and patterns. 

Here are some of my thoughts on a system for designing design systems.

2019

React Advanced

Design Systems Design System

Learn how to identify code smells in your React app and how to improve it.

This is a talk about code quality for people already working with React. Learn how to identify code smells in your React app and how to improve it. Let’s pair program to refactor some okay-okay code to make it great code.

React India

Refactoring React

React on it’s own has a very small API surface. Most of the magic happens in user-land.

But, there's a lot out there: Higher order components, Render props, Compound components? Provider methods? Learn which component pattern will make your codebase better in which use case.

React Amsterdam

At the core of using React is writing components.

In it’s early days, React got popular because of it’s composition model. The contract with the framework is that we’d write good components and React will take care of the rest.

This is a collection of evergreen tips/advice that I’ve learned over the course of 3 years working with React - building products for users, a design system and a few open source libraries.

ReactFoo

Writing good components

Most of us work with designers and other developers on a daily basis. It isn’t always easy to maintain quality and consistency across teams or even features. Collaboration isn’t always easy with spec handovers, component states, achieving pixel perfection, etc.

Design systems have become really popular in the design world in the past couple of years and for good reason. React’s methodology of thinking in components along with recent tools like react-sketchapp make it feasible for designers and developers to work on a single system.

2018 Mumbai

We need to talk about our frontend workflow

2018 Hyderabad

Building high quality interfaces that are consistent across products is hard. Fear not, Design Systems with React is the solution!

2018

ReactFest

We Need To Talk About Our Frontend Workflow

React on it’s own has a very small API surface. Most of the magic happens in user-land. It feels like every month, someone from the community finds an innovative way of writing components. This is the best part about React, the creative community.

Our team obsessed over code quality and maintainability but we didn’t always know the right way as we’re all learning together.

I’m going to be honest, this stresses me out. I have a constant fear of missing out on the cleanest/prettiest/smartest way of writing React components.

So, I sat and learnt all of them, so that you don’t have to.

2018 Pune

Advanced React Component Patterns

Fiber release brought with it some pretty cool features but the best is yet to come!

First, let’s talk about array children, error boundaries and renderToStream. Then, I’ll give you a sneak peak into one of the upcoming features that might change the way you build your React applications. Portals open up a lot of opportunities and traps!

Let’s explore 2 of them: reducing client bundle sizes and easier state management.