Slide 1

Slide 1 text

Hello.

Slide 2

Slide 2 text

Why do UI devs change frameworks so often?

Slide 3

Slide 3 text

Why do UI devs change frameworks so often? A. Because we constantly want to learn new stuff B. Because web browsers have evolved a lot in the last years or...

Slide 4

Slide 4 text

C. Because a change in the old framework feels like this:

Slide 5

Slide 5 text

So you found a new framework... "This time it's going to be different."

Slide 6

Slide 6 text

Things are going great... ● Trying & learning new stuff every day ● No technical debt and haunting hacks ● No need to refactor with every feature

Slide 7

Slide 7 text

This (framework) might be the one.

Slide 8

Slide 8 text

2 years later...

Slide 9

Slide 9 text

Why do we have so many bugs?

Slide 10

Slide 10 text

Why is writing code so hard to debug?

Slide 11

Slide 11 text

Don't be naive. React is not your soulmate.

Slide 12

Slide 12 text

What makes a codebase go bad in time?

Slide 13

Slide 13 text

No content

Slide 14

Slide 14 text

No content

Slide 15

Slide 15 text

How to understand an implicit codebase: 1. Grep the entire project for that entity 2. Grep the entire project for the file name 3. Ask a friend, or... 4. ...read the entire source code.

Slide 16

Slide 16 text

You have to understand the entire project to figure out something in a module. This is not scalable.

Slide 17

Slide 17 text

A maintainable codebase is explicit and intuitive.

Slide 18

Slide 18 text

How do you write explicit code? ● Dependencies should be expressed inside- out ● Every module should expose a standalone, testable API ● Every UI component should be an entry point.

Slide 19

Slide 19 text

Maintainable React UIs using Cosmos.js Bear with me...

Slide 20

Slide 20 text

ComponentTree Serialize and reproduce the state of an entire tree of React components.

Slide 21

Slide 21 text

ComponentPlayground Minimal frame for loading and testing React components in isolation.

Slide 22

Slide 22 text

Demo.

Slide 23

Slide 23 text

Thank you! // Ovidiu Cherecheș // Leading the Analytics UI at Hootsuite // [email protected] // twitter.com/skidding // github.com/skidding