Maquetación rápida con Emmet, Stylus y Sublime Text

Charla para el Wordcamp 2014

Transcript

1. MAQUETACION RAPIDA CON EMMET, STYLUS Y SUBLIME TEXT César Aquino Maximiliano - @jovenred
3. EMMET
6. DISPONIBLE EN UNOS CUANTOS NAVEGADORES emmet.io/download
9. ¿Los dos puntos? ¿Las llaves? ¿El punto y coma? ¿Una variable? Funciones Código organizado Mixins
10. Un preprocesador es un programa que procesa sus datos de entrada para producir una salida que se utiliza como entrada a otro programa.
11. VARIABLES
12. VARIABLES MIXINS
13. MIXINS FUNCTIONS, CONDITIONALS
14. FUNCTIONS, CONDITIONALS FOR, INTERPOLATION
15. FOR, INTERPOLATION @EXTEND
16. @EXTEND @MEDIA
17. INSTALAR STYLUS Instalar NodeJS http://nodejs.org/ Ingresar al terminal y escribes: npm install stylus Más información visitar: http://learnboost.github.io/stylus/
18. ¿DÓNDE ESTÁ EL CÓDIGO?
19. AQUI TA!
20. Multicursor
21. Ctrl+P -> Goto Anything
22. Paleta de comandos (Que puedes cambiarlos si gustas)
23. Snippets Códigos guardados en archivos individuales que te permitirán insertar de forma fácil y rápida partes de código simplemente escribiendo una palabra y pulsando TAB, o bien asignándole una combinación de teclas.
24. Package Control
25. SUBLIME TEXT Y WORDPRESS ♥
26. Search WordPress Codex: Te permite revisar el codex (la biblia) de wordpress desde el mismo Sublime Text. https://github.com/welovewordpress/SublimeWordPressCodex
27. WordPress New Project Config: Este plugin puede crear una nueva carpeta con el nombre del proyecto, instalar la última versión de WordPress y descargar e instalar un tema. https://github.com/jeremycastelli/Wordpress-new-project-config
28. Sublime Text 2 WordPress: Este plugin tiene una colección de snippets precargados con códigos de WordPress. https://github.com/purplefish32/sublime-text-2-wordpress
29. ¿Preguntas?
30. ¿Preguntas? Busquen en ;)
31. ¿Preguntas? Muchas gracias! César J. Aquino Maximiliano (@jovenred) Busquen en ;)