Start Building Your Own JavaScript Tools

JS Nation

JSNation 2023

Will Klein

Testing Our Way to a Better Developer Experience

React Day Berlin

React Day Berlin 2024

What Makes a Design System Win

JSNation US

JSNation US 2025

Pragmatic 101 on Custom JS Tooling for Your Project

DevTool Wars: Across the Browser-verse

Most developers use Chrome DevTools, but what about Firefox, Safari, and Edge? Venture off the well-traveled path, and we’ll find each browser hiding its own set of overlooked tools. We’ll explore how they uniquely tackle accessibility, design, debugging, and more. Let’s follow the firefox, dive beneath the chrome on a cross-browser safari, and discover where each dev tool has the edge!

Let’s demystify the secrets of modern JavaScript tooling. In this workshop, you will learn how linters, compilers, and code transforms work. You will take your first steps building your own developer tools, writing an ESLint rule, a compiler plugin, and a code transformation. Learn these skills to help your team and deepen your understanding of computer languages.Workshop Plan:<ol><li>A preview of how ASTs can be used</li><li>A brief walkthrough of how compilers work</li><li>An intro to working with an AST</li><li>The secret to making thousands of changes in seconds</li><li>How to apply this skill</li></ol>

Are our UI tests a chore, or do they help us move faster? Let’s examine what makes testing great and not so great. We’ll focus on test strategies that help us code with confidence and clarity, and where they can cost us time and energy. The secret to good testing lies in how it shapes our developer experience. Do our tests give us useful feedback in a timely manner? How quickly can we tell what is wrong when a test suite fails? Do they document our features and explain our past decisions? We’ll answer these questions with better tests that give us joy.

How does a design system win over product developers and designers? Everyone wants to ship new features, but they don't know why they should adopt your components and follow your guidelines. Let’s solve this, and turn apathy into excitement. We’ll explore the many ways to attract attention to your design system, elevate its place in your product, and build a thriving community around your work.

Your first JavaScript tool might not be the next Babel or ESLint, but it can be built on them! Let's demystify the secret art of JavaScript tools, how they work, and how to build our own. We'll discover the opportunities in our everyday work to apply these techniques, writing our own ESLint rules to prevent mistakes and code transforms to make breaking changes easy to apply. We’ll walk through the fundamentals of working with an abstract syntax tree, and develop our understanding through a live-code. You will be amazed at what you can build, and together we’ll explore how to get started.