Building the Right Product and Building It Right: A Glimpse into Extreme Programming, Atomic Design

How do you ensure you're building the right product, and building it right? This talk reveals a holistic framework using Extreme Programming, Atomic Design, and Micro-frontends.

#1about 2 minutes

Defining how to build the right product right

A product is built right when it is user-driven, has a clear vision, and is developed with practices like test-driven development.

#2about 3 minutes

The five core values of extreme programming

Extreme programming is founded on five values: communication, simplicity, feedback, courage, and respect, which foster a healthy and productive team environment.

#3about 2 minutes

Applying pair programming and test-driven development

Key practices of extreme programming include pair programming for collaborative coding and test-driven development (TDD) using the red-green-refactor cycle.

#4about 4 minutes

Discovering user pain points to drive product creation

User interviews revealed that car dealers struggled to track orders, leading to the development of a new car tracker product to solve this specific problem.

#5about 3 minutes

Integrating applications using a micro-frontend architecture

A micro-frontend architecture allows autonomous teams to build and deploy independent applications that are composed into a larger, cohesive user experience.

#6about 2 minutes

Structuring code with the atomic design methodology

Atomic design organizes UI components into a hierarchy of atoms, molecules, organisms, templates, and pages to create a more maintainable and consistent codebase.

#7about 3 minutes

Building atoms and molecules with test-driven development

Simple UI components like buttons (atoms) and icon-text pairs (molecules) can be built reliably by first writing a failing test and then implementing the code to make it pass.

#8about 3 minutes

Navigating the trade-offs of mocking in component tests

When testing complex components, teams must decide whether to mock dependencies for isolation or use real components to better simulate the actual user experience.

#9about 4 minutes

Writing readable tests for a complete user journey

By combining templates and pages, you can write end-to-end tests that clearly describe a user's entire workflow, from viewing a dashboard to navigating to a details page and back.

#10about 1 minute

Combining methodologies for high-quality software delivery

The combination of extreme programming, atomic design, and micro-frontends enables teams to independently deliver high-quality, consistent software at a faster pace.