Charla de Rubén Bernárdez sobre los cambios de maquetador a componetizador en React del XVI Open Space de Biko, 19 octubre 2018

1. BIKO OPEN
De maquetador a
componentizador React
¿qué ha cambiado?
Octubre 2018

2. Lead Frontend Developer
Rubén Bernárdez
Construyendo software desde hace 15 años.
Responsable del desarrollo en React en Biko.
Profesor en el Master de Métodos Ágiles en La Salle.
ruben.bernardez@biko2.com
@rubenbpv

3. www.biko2.com
01.
maquetador
VS
componentizador

4. www.biko2.com
maquetador
HTML
componentizador
SASS
Jekyll
block--element__modifier BEM
Componentes visuales
JSX
styled components + polished
storybook
<no es necesario>
Componentes funcionales

5. www.biko2.com
maquetador componentizador
button.examples.html
button.scss Button.tsx
Button.stories.tsx

6. www.biko2.com
storybook
Entorno de desarrollo de componentes
/ Construye y prueba componentes de forma
aislada.
/ Despliégalo en cualquier servidor web.
/ Úsalo como catálogo de componentes
documentados.

7. www.biko2.com
02.
DEMO

8. www.biko2.com
¿Qué hemos ganado?
/ Componentes funcionales, no sólo visuales
/ Componentes muy reutilizables e independientes
/ Entorno de creación y pruebas de componentes aislados con Storybook
/ Compartir fácilmente configuración de CSS con Javascript
/ Disponer toda la potencia de Javascript, mayor que la de SASS
/ Estilos aislados
/ CSS crítico sin esfuerzo

9. MADRID · PAMPLONA · LIMA
www.biko2.com · +34 91 436 48 54