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

MAQUETACION RAPIDA CON EMMET, STYLUS Y SUBLIME TEXT

César Aquino Maximiliano - @jovenred

EMMET

DISPONIBLE EN UNOS CUANTOS NAVEGADORES

emmet.io/download

¿Los dos puntos?¿Las llaves?

¿El punto y coma?¿Una variable?

FuncionesCódigo organizado

Mixins

Un preprocesador es un programa que procesa sus datos de entrada para producir una salida que se

utiliza como entrada a otro programa.

VARIABLES

VARIABLES

MIXINS

MIXINS

FUNCTIONS, CONDITIONALS

FUNCTIONS, CONDITIONALS

FOR, INTERPOLATION

FOR, INTERPOLATION

@EXTEND

@EXTEND

@MEDIA

INSTALAR STYLUS

Instalar NodeJShttp://nodejs.org/

Ingresar al terminal y escribes:npm install stylus

Más información visitar:http://learnboost.github.io/stylus/

¿DÓNDE ESTÁ EL CÓDIGO?

AQUI TA!

Multicursor

Ctrl+P -> Goto Anything

Paleta de comandos(Que puedes cambiarlos si gustas)

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.

Package Control

SUBLIME TEXT Y WORDPRESS

♥

Search WordPress Codex:

Te permite revisar el codex (la biblia) de wordpress desde el mismo Sublime Text.

https://github.com/welovewordpress/SublimeWordPressCodex

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

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

¿Preguntas?

¿Preguntas?

Busquen en ;)

¿Preguntas?

Muchas gracias!

César J. Aquino Maximiliano (@jovenred)

Busquen en ;)