jump to navigation

Algunas cosas sobre desarrollo web 14.1.14

Posted by Migsar in Desarrollo Web.
Tags: , , , , , , ,
trackback

Poco a poco fui quedándome con PhpStorm como editor favorito, ofrece muchas funciones que me gustan para la edición, como envolver algo con tags o tener live templates(que hacen que sea más fácil programar al permitir shortcuts para escribir estructuras de programación) e integra muchas herramientas, tiene las partes para servidor y autoupload, git, vagrant, file watchers (que sirve para compilar automaticamente scss, less o coffeescript). Me considero desarrollador conceptual, pues muchas veces escribo el código mínimo indispensable y paso mucho más tiempo pensando ideas, es decir, no soy para nada un codificador notable, ni me divierto como algunos dicen escribiendo líneas y líneas, me divierto haciendo dibujitos y sitios y pensando en nuevas aplicaciones. En fin, todo esto sirve como introducción a emmet y una serie de herramientas que han surgido y que simplifican tanto el paso de lo creativo a la implementación que es difícil no ponerse a desarrollar las ideas. Lamentablemente creo que muchas de estas herramientas son bastante desconocidas en México, así que espero que el post que pongo despierte la curiosidad al respecto. Para muestra un botón.

Emmet

Cheat Sheet

Esto:
div#menu>(ul.lista>li.clase${Elemento $}*5)+footer>p{Hola mundo}

Produce:
<div id="menu">
<ul class="lista">
<li class="clase1">Elemento 1</li>
<li class="clase2">Elemento 2</li>
<li class="clase3">Elemento 3</li>
<li class="clase4">Elemento 4</li>
<li class="clase5">Elemento 5</li>
</ul>
<footer>
<p>Hola mundo</p>
</footer>
</div>

También existen distintos compiladores de CSS que ayudan mucho como:

  • Less
  • Sass (Me gusta más porque tiene herramientas como Compass y Susy pero no he usado demasiado Less y apenas empezaré con Myth)
  • Myth

En este caso no pongo como se utilizan, pero en esencia es lo mismo, permiten repetir menos código al usar agrupaciones y variables y crean un código más comprensible cuando está bien estructurado.

Anuncios

Comentarios»

No comments yet — be the first.

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión /  Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión /  Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión /  Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión /  Cambiar )

Conectando a %s

A %d blogueros les gusta esto: