"How to Write a React App that (Almost) Writes Itself” by Sua Yoo

“A dream of artificial intelligence is to build systems that can write computer programs.” - "DeepCoder: Learning to Write Programs"

The more you code, the more you’ll find yourself re-implementing something that you or another developer has built before. You might start to feel a bit robotic — How many more times do I need to handle “isLoading” in my component state? Do I really need to write another reducer that just filters a list of stuff? How did I implement this before, and should I just copy-paste what I did then?

In this talk, we’ll revisit what it means to write declarative code in React, and see how a declarative approach to your entire system can reduce repetitive code. Whether you’re just getting started by copying and pasting React code samples, or you’re a seasoned developer looking to refactor an application, thinking critically about declarative systems can optimize how you write code by helping you write programs that write themselves.

We’ll cover examples in specific tools and APIs like Redux, Hooks and Create React App to highlight methods for reducing repetition like:

• Abstracting away reusable logic
• Using libraries that reduce boilerplate
• Using code generators to automate away writing boilerplate

And finally, we’ll touch on when it’s okay to leave in some repetition — in other words, how to find the right balance between abstraction and the developer experience. After all, we don’t have robot colleagues writing React apps (yet.)

Sua is a software engineer at Telnyx, a cloud communications platform enabled via API that makes it easy for you to embed voice and messaging capabilities into your app. Outside of the Telnyx Chicago office, you can find her at the ceramics studio or cruising around the city on her bicycle.