¡Hola 👋!

Schibsted

User

Interface

Shared

User

Interface

Misión 🎯

Conocer las SUI Tools y la arquitectura que usamos en Schibsted Spain

Objetivo

Crear el 🐈 Pet Project de Schibsted Spain

🤔❓

Preguntas anytime

No dudéis en preguntar en cualquier momento

Miguel Ángel

Durán

@midudev

youtube.com/c/midudev

👨‍💻

Enabler Frontend en

🤔

y también fuera de 🇪🇸

QUE PARE YA EL

AUTOBOMBOOOO!!1!!

Un poco de historia 👨‍🏫...

Slides 🔗

Ejercicio 👷‍♀️

instala en cualquier de tus proyectos... 👇

@s-ui/linter ⚔️

y a tomar por saco los semicolons ;

🧰

👩‍🎨

🧰 sui tools

Unificar, acelerar, eliminar boilerplate, mejorar DX

https://github.com/SUI-Components/sui

👩‍🎨 sui components

Componentes visuales reutilizables

https://github.com/SUI-Components/sui-components

@s-ui/bundler 📦

una librería para empaquetarlos a todos

babel-preset-sui 🌀

transpilando con responsabilidad

Schibsted Spain Components

https://github.com/SUI-Components/schibsted-spain-components

@s-ui/studio 📖

creando catálogo de componentes

npm install -g @s-ui/studio-create
// or...
npx @s-ui/studio-create awesomeStudio

1. Create your own studio!

2. Start...

npm run start

3. Create your first component

npm run generate <category> <component>

npm run generate home search

4. Start AGAIN!

npm run start

5. Better DX

npm run dev home/search

6. Documenting our component!

7. Demo page

8. Theming

9. Build and deploy!

@s-ui/precommit 👮‍♀️

quieeeeeeeto ahí, ratilla

@s-ui/mono 🐵

monorepos made easy

Talking about sui stack

By Miguel Angel Durán García

Talking about sui stack

464

Miguel Angel Durán García