Cybernomads

Damos un abrazo de código muy fuerte a proyectos Open Source que lo necesiten

@KoolTheba 👩🏻‍🎤

@Kom_256 👨🏻‍🎤

Hablar está bien... pero hacer ideas realidad es lo que realmente marca la diferencia

Guilders:

Canales Slack:

Patrocinadores:

+100

+20

Guilds/Proyectos: 

+20/+30

OSW Guilds

¿Qué es Bash?

Bash (Bourne-again shell) es un programa informático cuya función consiste en interpretar órdenes y un lenguaje de consola. Es una shell de Unix compatible con POSIX y el intérprete de comandos por defecto en la mayoría de las distribuciones GNU/Linux, además de macOS. También se ha llevado a otros sistemas como Windows y Android. Wikipedia

La comunidad

Source: The State of the Octoverse 2017

Bash es el 12º lenguaje de programación más popular de Github

La comunidad

Estado de la Documentación

• Documentación oficial
• Control de versiones con Git

🤦🏻‍♀️...estado de la documentación...

_. Enfrentarme a un proyecto grande y complejo

_. Hacer un proceso real de planificación y pasos a seguir

_. Poner en práctica lo aprendido estos meses

_. Estrellarme con errores y buscar soluciones

_. Gestionar un proyecto Open Source en equipo

_. Aprender SASS, BEM y ponerlo en práctica

_. Familiarizarme con herramientas y flujos de trabajo para equipos grandes (Gulp, postCSS...)

_. Hacer pair coding con un senior

¿Qué quería aprender y cómo?

15.510!!!!

Esquema pasos

_. Planificación y recursos

_. Diseño claro

_. Automatización y flujos de trabajo

_. Limpiar/eliminar el código obsoleto

_. Añadir funcionalidades extra

_. Tener estrategias y herramientas claras

_. Definir un Roadmap

Planificación

Planificación

_. ¿Cuántas horas necesito?

_. ¿Es realista este proyecto?

_. Necesito saber más cosas para llevarlo a cabo

_. ¿Existe alguien que ya haya creado lo mismo y además sea Open Source?

_. ¿Quién me puede ayudar?

_. ¿Tiene sentido lo que hago?

_. ¿Alguien lo necesita de verdad?

_. ¿Cubre una necesidad?

Diseño claro

_. ¿Tienen un branding decente

(vectorial, documentación...)?

_. ¿Existe una guía de estilos o similar?

Lo encontramos !!! (repo) 

Diseño claro

...que me ayuden con diseño??

Diseño claro

Automatización

_. ¿Cómo voy a trabajar (carpetas, ficheros...)?

_. ¿Qué pasos automatizar (transpilar, convertir...)?

_. ¿Qué herramientas puedo usar (Node, Gulp, etc...)?

_. ¿Puedo validar mis cambios automáticamente?

Gracias automatización!!!

Limpieza con criterio

Limpieza con criterio

_. Leemos todo el código original

_. Hacemos una copia del código completa

_. Buscamos etiquetas obsoletas, clases que no se usan, referencias rotas (links, etc..)

_. ¿Qué semantica tenemos?

_. ¿Cómo se adapta a los dispositivos?

_. ¿Se puede mejorar la accesibilidad?

Estrategias y tecnologías

Estrategias y tecnologías

_. Mobile First (responsive en pequeño primero)

_. BEM (arquitectura CSS mantenible)

_. SASS (reducir redundancia y mejorar la escalabilidad)

_. GULP+NodeJs (automatizar el flujo de trabajo)

_. Lintern - auditoría accesibilidad

Añadir funcionalidades extras

_. Responsive (menú desplegable, top button...)

_. PWA (Offline, home button)

Roadmap

• v0.1.0 - Hello World! 
• v1.0.0 - Responsive
• v2.0.0 - PWA

Antes

Despues

_. Tómatelo con calma

_. Pon en práctica lo que sabes

_. Contribuir al open source, hacer algo mejor que ya existe, etc....

_. Empieza en pequeño (no hagas como yo...)

_. Mejora el producto poco a poco

_. Recibe feedback

Con qué me quedo...