Archivo de la categoría ‘Desarrollo Web’

Videotutorial: Diseños flexibles con CSS3 media queries

martes, 19 de octubre, 2010

Con la llegada de los tablets y el aumento de uso de los smartphones con distintas resoluciones y tamaños de pantalla, nos surge el problema de crear versiones móviles diferentes para cada dispositivo.

CSS3 nos trae una nueva herramienta para atacar este problema: los media queries. El funcionamiento de los media queries consiste en disponer de un único documento html para todas las versiones, y seleccionar una u otra hoja de estilo CSS dependiendo de algunos parámetros del dispositivo, principalmente la resolución de la pantalla. De esta manera eliminamos la necesidad de redireccionar a una versión móvil diferente de nuestro sitio, sino que cada dispositivo leerá un bloque de reglas CSS según su anchura.

En este videotutorial voy a enseñaros cómo utilizar los media queries mediante un sencillo ejemplo de diseño de tres columnas de contenido y un menú. Veremos cómo las columnas se reordenan según disminuimos el tamaño del navegador, y por lo tanto cómo se mostraría en dispositivos de ese tamaño.

Ver Demo CSS3 media queries
Leer el resto de la entrada »

Videotutorial – Patrones de diseño en PHP – Chain-of-command

viernes, 23 de julio, 2010

Para terminar la serie de screencasts sobre patrones de diseño en PHP, os enseñaré en qué consiste el chain-of-command pattern (cadena de mando), también llamado patrón cadena de responsabilidad. En él creamos una serie de objetos receptores y un objeto emisor que les envía una petición, estableciendo una cadena en la que el comando de petición recorre todos los posibles objetos receptores hasta que uno de ellos responde ejecutando el comando.

De esta manera el emisor no tiene conocimiento de qué receptor va a ejecutar el comando, favoreciendo el acoplamiento débil.
Leer el resto de la entrada »

Videotutorial: Patrones de diseño en PHP – Observer Pattern

lunes, 3 de mayo, 2010

En este screencast voy a explicaros el patrón de diseño Observer (observador) en PHP, que consiste en crear objetos observables que mantienen una lista de observadores y les notifica a éstos de cualquier cambio en su estado, normalmente llamando a uno de sus métodos. Este patrón suele utilizarse para implementar un sistema de manejo de eventos distribuido, por ejemplo construir un sistema de logging en el que registramos el observador (clase que se ocupa de escribir el log) en cada objeto que queramos que envíe mensajes al log.
Leer el resto de la entrada »

Videotutorial: Patrones de diseño en PHP – Factory Pattern

viernes, 9 de abril, 2010

Continuamos la serie de videos sobre patrones de diseño en PHP con el patrón creacional Factory, que consiste en un método para crear objetos cuando no sabemos la clase exacta del objeto que va a ser creado. De esta manera encapsulamos clases en una clase general de la que heredarán distintas subclases. Aunque el ejemplo utilizado es muy sencillo, este patrón es bastante interesante si tenemos en cuenta que podemos redefinir métodos en cada subclase, así como automatizar la creación de objetos utilizando variables (que podemos obtener de un fichero de settings).
Leer el resto de la entrada »

Videotutorial: Patrones de diseño en PHP – Singleton Pattern

martes, 30 de marzo, 2010

Hoy os traigo el primero de una serie de videos cortos en los que voy a explicar algunos de los patrones diseño OOP más comunes en PHP. Un patrón de diseño consiste en una solución a un problema común en el desarrollo de software. En el caso de PHP, estos patrones son los que nos permiten aprovechar realmente toda la potencia de orientación a objetos de PHP5. Estos videos no pretenden ser tutoriales exhaustivos, sino simplemente una visión general y rápida de en qué consiste cada patrón, para aquellos que no estén familiarizados con esta metodología.

Empezaremos con el patrón Singleton, ya que es el más fácil de entender y utilizar. Hay varias maneras de implementar una clase singleton, pero aquí os voy a mostrar la forma más sencilla.
Leer el resto de la entrada »

Aterrizamos en el Planet Webdev

jueves, 25 de marzo, 2010

planetwebdevEs un honor anunciar que desde ayer (gracias a SigT) este blog pasa a formar parte del Planet Webdev, lo que significa que los artículos publicados aquí se mostrarán a su vez en la portada y el feed del Planet. Un Planet es una web que reune feeds de distintos sitios de una temática común, en este caso sobre desarrollo web.

Para los que acaben de conocer mi blog a través del planet, les recomiendo que le echen un vistazo a mis Videotutoriales, sobre todo si están interesados en el framework PHP CodeIgniter (aunque también hay alguno sobre CSS y jQuery).

Videotutorial: Cómo hacer un plugin jQuery – Menú acordeón multinivel

miércoles, 3 de marzo, 2010

Respondiendo a la multitud de peticiones en los comentarios del artículo sobre cómo crear un menú en acordeón, aquí os muestro cómo hacer el mismo menú pero con soporte para varios niveles.
Este menú está basado en el anterior, y como apenas necesitaba un pequeño cambio en el javascript para hacerlo multinivel, he aprovechado para convertirlo en un plugin y enseñaros en un screencast cómo hacer vuestros propios plugins en jQuery.

Ver Demo menú acordeón multinivel
Leer el resto de la entrada »

URLs amigables en CodeIgniter: Controlador ‘catch-all’

miércoles, 10 de febrero, 2010

Supongamos que estamos programando un CMS en CodeIgniter para integrarlo en nuestros proyectos, y queremos generar urls del estilo www.dominio.com/titulo-de-la-pagina. Una manera de enfocarlo sería por ejemplo crear un controlador Paginas con un método cargar, al que se le pasará como parámetro el título de la página en cuestión. De esta manera se llamaría a la url www.dominio.com/paginas/cargar/titulo-de-la-pagina. Para eliminar /paginas/cargar/ de la url editaríamos el fichero routing.php.

Esto supone un problema: si añadimos una regla genérica a las rutas para redirigir cualquier url al controlador paginas/cargar, no funcionaría el resto de controladores de nuestra aplicación. Deberíamos añadir una regla para cada página o bien para cada controlador que tengamos, con lo cual perdemos dinamismo y nos obliga a editar el fichero de rutas con cada cambio.
Leer el resto de la entrada »

Videotutorial: Mejora progresiva con CSS3

martes, 12 de enero, 2010

En este videotutorial voy a enseñaros algunas propiedades de CSS3 que nos servirán para mejorar visualmente nuestros diseños sin necesidad de usar imágenes o javascript, concretamente el manejo de sombras, gradientes y transformaciones sólo con CSS. Puesto que CSS3 aún no es un estándar, tendremos que usar las extensiones propietarias que implementan los navegadores más modernos, como las últimas versiones de Safari, Chrome y Firefox. Estas propiedades generalmente contiene el prefijo -moz para Firefox y -webkit para Safari y Chrome (webkit es que el motor utilizado en estos navegadores).

Ver Demo CSS3
Leer el resto de la entrada »

Videotutorial: Hooks y creación de librerías con Codeigniter

sábado, 2 de enero, 2010

codeigniter_screencast_hookA petición popular he creado un último screencast sobre CodeIgniter. En él os voy a enseñar un par de conceptos importantes para extender la funcionalidad del framework: los hooks y la creación de librerias. Como ejemplo crearé un sistema muy simple de autenticación, con una librería que contendrá una función para hacer login y otra para logout, y un hook que se disparará cada vez que se ejecute cualquier controlador. Los hooks son una utilidad que nos permite llamar a una función en determinadas fases de la ejecución del framework, por ejemplo antes o después de ejecutar cualquier controlador, el constructor de éste, etc.

Podéis encontrar el resto de screencasts en la página de videotutoriales, o suscribiros al podcast de iTunes.
Leer el resto de la entrada »

RSS iTunes podcast Twitter

Categorías

Enlaces

Archivos