Curso Intensivo de Laravel es una publicación de Código Adicto.

Guía de Buenas Prácticas para Programar en PHP es una publicación de Código Adicto.

En lugar de escribir sobre como desarrollar un tema de WordPress creo sería mejor compartir aquellos recursos que necesitamos a mano para mejorar nuestro flujo de trabajo, así que porque no compartir algunos consejos y técnicas para ayudarles a mejorar y perfeccionar el proceso de diseño y desarrollo de un tema.

Y estaría perfecto comenzar por:

Desarrollar Local

Hay bastantes requisitos para ejecutar un sitio con WordPress localmente como son: un servidor web como Apache, un lenguaje de programación como PHP y una base de datos como MySQL, creo que esa es una de las causas de porque algunas personas siguen trabajando con su sitio en internet en lugar de hacerlo local y es que quizás eso se deba a que no se tienen lo conocimientos necesarios para manejar esas herramientas. Pero eso debe cambiar, así que si no estás desarrollando de forma local, entonces es el momento de que empieces a hacerlo. Estas son algunas de las cosas que puedes aprender de Chris Coyier:

Configurar MAMP

¿Abandodar FTP?

El desarrollo local tiene muchos beneficios. Serás capaz de hacer lo siguiente:

• Es más rápido para hacer todo tipo de pruebas.
• Es más fácil deshacer errores.
• Se es más eficiente usando un editor de texto cuando buscas un archivo en particular.
• Trabajas sin la preocupación de cargarte el sitio web por completo.

Herramientas Alternativas para un Servidor Local:

• XAMPP (Windows, OSX, Linux)
• App Server (Windows)
• WampServer (Windows)

Usar Live Reload

En un articulo que escribrí explico la importancia que tiene refrescar los cambios en el navegador de forma automática y como hacerlo usando herramientas como Live Reload.

Usar Git

Y es que usar un cliente FTP para actualizar tu sitio, ya eso es cosa del pasado. Git es un sistema de control de versiones distribuido que es popular entre los desarrolladores de todo el mundo. Lo bueno sobre Git es que puedes crear rápidamente una rama (branch), realizar cambios dentro de esa rama y luego probar esos cambios sin afectar la versión principal del código fuente. Si no eres un amante a la consola aquí hay algunas alternativas visuales para usar Git:

• SmartGit
• Github for Windows
• tryGit, aprende los comando
• TortoiseGit
• Tower

Usar las Herramientas del Navegador

Muchos de los navegadores de hoy en día tienen herramientas integradas para mejorar, afinar y depurar un diseño o desarrollo de un tema. Y la verdad es que editar un código CSS en un tema complejo puede ser molesto, especialmente si no sabes la estructura del código.

Cada navegador popular moderno, si incluyendo Internet Explorer , poseen "Herramientas de Desarrollo", las cuales te ayudarán a encontrar rápidamente un código CSS de un elemento determinado o un código Javascript el cual quieres analizar.

Todos los cambios de CSS, HTML y JS que haces son automáticamente visible en el sitio. Ahora bien, ninguno de estos cambios se guardan en el archivo, si fuese así podrías hackear fácilmente a amazon ¿o no?. Una vez que refresques la página esos cambios se perderán. Es muy útil solo si necesitas probar rápidamente algunos cambios en CSS o encontrar un elemento determinado en el código, herramientas alternativas que puedes usar son:

• Firebug
• Opera DragonFly

Usar un Preprocesador

Un preprocesador compila el código que has escrito en el lenguaje por defecto. Esto optimiza el flujo de trabajo y puedes ahorrarte muchas horas de desarrollo. También extendiende las funcionalidades de CSS, como el uso de variables, reglas anidadas, funciones, importar librerías, etc.

Para ilustrar un ejemplo de lo que digo, suponiendo que usamos SASS como preprocesador para CSS:

// variables
$color: blue;
$backg: yellow;

body {
  color: $color;
  background: $backg;
}

Declaramos dos vaiales, que luego se la pasamos como valores a las propiedades del body. Por lo que se compilará a la forma estándar de CSS:

body {
  color: blue;
  background: yellow;
}

Aquí listo algunos enlaces que te ayudarán a conocer más a fondo los preprocesadores para CSS.

• LESS
• SASS
• Stylus

Utilizar un Tema Base

Iniciar con un tema base es importante porque te brinda todo lo que necesitas para comenzar con el desarrollo de un tema, mejora tu flujo de trabajo y te ahorra tiempo. Normalmente un tema base viene con stilos basicos ya definos, como los CSS Resets, templates de páginas, etc. En mi cuenta de Github he creado un repositorio con mi propio tema base el cual utilizo llamado WP-Theme-Scratch, ya que cada vez que inicio un nuevo proyecto para desarrollar en wordpress siempre tenía la necesidad de reutilizar código que ya había usado en otros temas porque me resultaban beneficos, como los loops, funciones, etc.

Aquí dejo una lista de los temas base más populares:

• HTML5 Boilerplate
• Bootstrap y Bootstrap WP
• Bones

Consejos Finales

Otro de los consejos es siempre diseña con contenido de verdad. El habitual "Lorem Ipsum", sólo contaminará tus conceptos y la elegancia de lo que diseñas.

Pensar en el concepto Mobile First y Responsive Design.

Conclusión

El diseño y desarrollo de un tema puede tomar mucho tiempo, y se basa en mucho aprendizaje. Estas son algunas técnicas y consejos que te ayudarán a refinar tu flujo de trabajo, ahorrándote tiempo y haciendo que seas más eficiente. ¿Tienes algo que agregar?.

Recursos para Desarrollar un Tema de WordPress es una publicación de Código Adicto.

Repositorio de Plugins para jQuery es una publicación de Código Adicto.

Prepros la Alternativa a CodeKit para Windows es una publicación de Código Adicto.

Es una efectiva herramienta que hace que encuentres esa combinación de fonts que quieres lograr en un sitio web.

El Combinador de Fonts Online es una publicación de Código Adicto.

Se trata de la diversidad de conocimientos que posees, se trata de mantenerse al día con las últimas tecnologías y estándares. Tal vez solo es seguir con lo estás haciendo mejor y practicar más para hacerte llamar un buen desarrollador.

Todo el mundo tiene su propia opinión sobre cómo ser un mejor desarrollador o diseñador. En este artículo quiero compartir algunas de las cosas que han funcionado para mí y espero que sea útil para ti.

Mantenerse al Día

Hace unos meses atrás, Chris Coyier escribió en su blog un artículo donde muestra sus ultimas presentaciones y una de ellas me llamó mucho la atención, es tanto así que fue lo que me motivó a escribir este artículo, la cual es Como Mantenerse al Día con la Tecnología de la Web (How To Stay Up To Date on Web Technology). Hay muy buenos recursos en esa presentación.

Esta lista definitivamente te ayudará a estar al día con las ultimas tecnologías y estándares mordernos, de seguro que te quedarás con algunos de estos sitios en tus favoritos.

• JavaScript Weekly
• HTML5 Weekly
• CSS Weekly
• Responsive Design Weekly
• Web Design Weekly
• Sidebar.io uno de mis favoritos.
• La red de blogs de Tuts+: Net.Tutsplus, WP.Tutsplus, Web Design Tuts+, Mobile Tuts+.
• Smashing Magazine
• .NetMagazine
• Codrops
• Cats Who Code
• 1st Web Designer

La Mejor manera de Aprender es Enseñar

Alguien una vez me preguntó que me motiva a escribir artículos aquí. Mi respuesta fue simple: porque lo disfruto y me gusta compartir. No escribo sobre ciencia o las últimas tendencias de la moda, pero me gusta aprender cosas para compartirlas en el blog y eso es una buena motivación para mí.

Se parte de la Comunidad

¿Eres diseñador? entonces debes estar en Dribbble (estoy deseando una invitación). Es una gran comunidad de diseñadores, donde si estas falta de inspiración puedes inspirarte viendo el trabajo de otros y es increíble las cosas que comparten además de que es un gran lugar para aprender de los mejores.

¿Eres desarrollador? entonces debes estar en GitHub, BitBucket, y es que Git y otros Sistemas de Control de Versiones están de moda, hay muchos grandes proyectos a los que puedes contribuir y de los cuales puedes aprender.

¿Te gusta diseñar tanto como programar? entonces debes estar en CodePen.io, CSSDeck, TheCodePlayer, son comunidades para desarrolladores front-end y diseñadores, puedes inspirarte y aprender viendo el trabajo de otros.

¿Necesitas respuestas a tus preguntas? entonces debes entrar en StackOverflow, es un lugar donde puedes encontrar muchas respuestas a tus dudas, yo personalmente lo visito a menudo. Es una excelente forma para aprender cosas.

¿Eres adicto a las redes y al móvil? entonces en Twitter puedes interactuar con tus desarrolladores favoritos, como Paul Irish, Addy Osmani, Jeffrey Way solo por mencionar unos cuantos.

¿Eres aficionado a resolver problemas? entonces debes entrar en CoCode, es un excelente sitio donde ponen retos para resolver problemas mediante códigos de programación, haciendo que aprendas a desarrollar tu lógica para ofrecer una solución viable a cualquier tipo de problema.

Google es tu Amigo

Como dice la frase en inglés "Google is your Friend". La verdad es que, cada vez que necesito un buen consejo o hacer algo de lo cual no tengo conocimiento alguno, Google nunca me decepciona.

Leer

Si "El arte de la Guerra" de Sun Tzu o la última novela de Paulo Coelho es tan importante como para leer, dedícale un poco de tiempo a un libro de CSS, HTML5, JavaScript, PHP, Python, Java, Ruby o en lo que sea que programes. Siempre hay algo que aprender al leer un buen libro.

Una duda que ronda mucho mi cabeza es si ¿tienes que conocer más tecnologías, más lenguajes de programación o simplemente tienes que centrarte en lo que mejor haces?. Siempre es importante tener un área donde eres bueno y seguir practicando para mejorar esa habilidad.

Conclusión

Comparto esto porque últimamente me siento como si estuviera obsoleto a veces. Siento que no estoy haciendo lo suficiente, de que no dedico suficiente tiempo para mejorar mis habilidades. ¿Te sientes igual o soy el único loco aquí?.

Como Convertirse en un Mejor Desarrollador es una publicación de Código Adicto.

Este método es factible si se tiene sólo uno o dos posts, los cuales se ven afectados, pero ¿qué pasa si tienes cientos, miles de posts? ¿Vas a eliminar cada campo personalizado de forma manual?. Eso sería un proceso muy lento y complicado. Por suerte en el mundo de las base de datos SQL las cosas no funcionan así, por lo que hay una opción más rápida para hacer este tipo de cosas y es interactuando de forma directa con la base de datos de wordPress para usar los comandos que SQL nos ofrece para seleccionar y eliminar registros de las tablas.

Cuando se eliminan estos registros indeseados de la base de datos nos ahorramos espacio en disco y hacemos que el motor de MySQL se esfuerze menos cuando se realizan consultas a la base de datos, nos ahorramos consumo de memoria, etc.

Lo primero que debes hacer es acceder a tu Cuenta de Hosting -> cPanel -> phpMyAdmin, para poder acceder a la herramienta de consultas SQL a menos que tengas acceso por SSH a tu servidor y quieras utilizar la consola, cosa que no creo.

Si lo que estas buscando es eliminar Campos Personalizados con el nombre meta_description u otro nombre, usamos el comando select. Por e.j. quiero seleccionar el meta_key con el nombre meta_description para ver una lista de todos los registros relevantes.

SELECT * FROM 'wp_postmeta' WHERE 'meta_key' = 'meta_description'

Después de haber seleccionado lo que quieres y estas seguro de que esos son los campos personalizados que quieres eliminar, con el comando delete puedes eliminar los datos de la siguiente forma:

DELETE * FROM 'wp_postmeta' WHERE 'meta_key' = 'meta_description'

Siempre es bueno asegurase de que todo va bien, así que selecciona otra vez para verificar que todos los registros se han eliminado con éxito.

SELECT * FROM 'wp_postmeta' WHERE 'meta_key' = 'meta_description'

Si no te devuelve ningún resultado, significa que se eliminaron correctamente los registros.

Eliminar Campos Personalizados de WordPress con SQL es una publicación de Código Adicto.

La guía ofrece trucos y consejos para minimizar, comprimir, renderizar, disminuir, todo tipo de archivo que se encuentre en una pagina. Como HTML, CSS, JS, Imágenes, Librerías como jQuery, configuraciones de lado del Servidor, etc. Si tu web se siente Pesada, Ayúdala a Perder Peso con esta Guía.

Como Perder Peso en el Navegador es una publicación de Código Adicto.

WordPress 3.6 Beta 3 es una publicación de Código Adicto.