En este Meetup veremos algunas herramientas para que seas mas productivo como desarrollador, sin importar si trabajas con HTML, CSS, Javascript, .Net, Ruby, Java… puedes mejorar cada día aprendiendo "buenas prácticas" de programación. Conoce algunas de estas buenas practicas y con ayuda de algunas herramientas y de tu editor de desarrollo favorito, practícalas día a día. Meetup: https://www.meetup.com/TODO1-Colombia/ Event: https://www.meetup.com/TODO1-Colombia/events/239454766/

1. BUENAS
PRÁCTICAS PARA TU
CÓDIGO FUENTE
MEJORANDO DÍA A DÍA

2. GABRIEL
PORRAS
Desarrollador Full-Stack, amigo
del Diseño de UX y de Interacción

3. LA ÚNICA
MEDIDA VÁLIDA
de la calidad
de tu código
http://www.osnews.com/story/19266/WTFs_m
“The only valid
measurement of code
quality: WTFs/minute”
Thom Holwerda

4. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
¿BUENAS
PRÁCTICAS?
Crear programas que
funcionen correctamente
y con buena calidad,
robustos, eficientes…

5. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
¿BUENAS
PRÁCTICAS?
Escribir código limpio,
entendible, mantenible y
documentado.

6. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
¿BUENAS
PRÁCTICAS?
Facilitar la comprensión
del código tanto para
nuestro futuro yo como
para otros.

7. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
¿BUENAS
PRÁCTICAS?
“La mejor manera de hacer que
nuestros sitios web se vean y funcionen
correctamente [...] es escribiendo
código limpio y que respete los
estándares”. Eduardo Briceno

8. SIEMPRE
CODIFICA
“Siempre codifica como si la persona
que va a terminar manteniendo tu
código fuera un violento psicópata
que sabe dónde vives”.
Jeff Atwood
https://blog.codinghorror.com/coding-for-violent-psychopaths/

9. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
BUENAS
PRÁCTICAS
Escribe código
limpio
Ejemplo...
Capture Moment

10. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
BUENAS
PRÁCTICAS
Evita el código duplicado.
Ejemplo...

11. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
BUENAS
PRÁCTICAS
Escribe código
simple
Ejemplo...

12. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
BUENAS
PRÁCTICAS
Utiliza nombres
descriptivos

13. BUENAS
PRÁCTICAS
Dejar el campo más limpio que cuando
llegamos. El código siempre puede
mejorar. Si podemos,
refactoricemos/documentemos el
código para dejarlo mejor que antes.
Aplicar la Regla del
Boy Scout

14. BUENAS
PRÁCTICAS
• Comenta bien tu código
• Usa convenciones
• Evitar escribir funciones largas

15. Hay
muchas
buenas
prácticas
Aprende leyendo
y….
Utilizando
LINTERS

16. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
HÁGASE LA LUZ
Lo primero que
utilizamos fueron
los validadores.

17. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
VALIDADORES
Un validador verifica que el
código se adhiera a las
especificaciones de lenguaje.
Ejemplo de validación con
https://validator.w3.org/

18. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
¿VALE LA PENA?
http://www.canalrcn.com/ https://www.grupobancolombia.com/
http://www.eltiempo.com/ http://www.dian.gov.co/
H T M L C S S
H T M L C S S

19. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
¿Por qué crees que se llaman
buenas prácticas?
¿Vale la pena hacer mejor tu
trabajo?
¿Vale la pena mejorar cada día?
¿VALE LA PENA?

20. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
PERO HAGÁMOSLO
MÁS FÁCIL POR
MEDIO DE LINTERS
Originalmente lint fue el nombre de una herramienta utilizada
para detectar código sospechoso, confuso o incompatible en C
en 1979… En la ACTUALIDAD:
Cualquier
lenguaje de
programación
Complementos que,
en tiempo real,
revisan el código
Aplican reconocidas
buenas practices
y ¡estandarizan!

21. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
HTML
LINTER
https://github.com/SublimeLinter/
SublimeLinter-html-tidy
SublimeLinter-html-
tidy
https://github.com/twbs/bootlint
Bootlin
t

22. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
CSS Linter
https://stylelint.io/
StyleLi
nt

23. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
JAVASCRIPT LINT
http://eslint.org/
E S L I N T
J S L I N T J S H I N T

24. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
TYPESCRIPT
LINT
https://palantir.github.io/tslint/
TSLint

25. WebStorm
Trabaja
fácilmente con todos
los linters

26. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
JAVA LINTERS
Hay más de 40 gratuitos (y sin
contar los comerciales):
Verlos en Java Code Quality
Tools – Overview

27. IntelliJ
NUESTRO
RECOMENDADO

28. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
SonarLint
(Free):
http://www.sonarlint.org/
PVS-Studio analyzer
(Commercial)
https://www.viva64.com/en/pvs-studio/
ReSharper (Free for
Students):
https://www.jetbrains.com/resharper/
C# LINTERS

29. ReSharper
NUESTRO
RECOMENDADO

30. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
OTROS LINTERS
https://www.pylint.org/ http://tools.android.com/tips/lint
http://www.sonarlint.org/ https://github.com/realm/SwiftLint
P Y L I N T A N D R O I D S T U D I O L I N T
S O N A R L I N T S L I N T

31. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
EN TODO1
Servidor de revisión permanente de
código (para equipos y empresas).
Más de 20 Lenguajes.
SonarQuebe
https://www.sonarqube.org/

32. Para tu equipo Para ti

33. GRACIASPOR SU ATENCIÓN

34. B U E N A S P R Á C T I C A S P A R A T U C Ó D I G O F U E N T E
CONTACTO
Gabriel Porras
@gabrielporras @gabrielizalo ghporras@gmail.com