Qué necesitamos

Nos crearemos en nuestra carpeta de images de nuestro theme, una carpeta que se llame authors (o como queramos), de forma que nos queda algo así:

Bien, usaremos el id del autor como nombre de fichero, de forma que dentro de esa carpeta tendremos los ficheros 1.jpg, 2.jpg, como sea (como muestra la captura anterior). Obviamente, necesitaremos saber el id de cada autor (nos ponemos en el panel de administración sobre el nombre de un autor, y vemos el enlace. Ahí podremos ver la id del autor).

Luego, donde queramos poner la imagen del autor pondriamos un código como el que sigue:

Y ya lo tenemos.

Internet Explorer 9, el navegador de Microsoft, está en fase de pruebas. Desde la propia microsoft, podemos descargar la preview, para windows vista y windows 7. Vamos a darle un repaso a las novedades que trae, mientras cruzamos los dedos para ver si de una vez, Microsoft tiene en cuenta a los que vivimos del desarrollo web y nos hace el día a día un poco más fácil.

HTML 5 y CSS 3

La nueva versión de HTML, de la que tanto y tanto se está hablando (y se hablará). Curiosamente, a pesar de que muchos estamos esperando que HTML 5 se implante en todos los navegadores, la fecha de salida definitiva de HTML 5 es… el año 2022. Si, no es coña, 2022. Bueno, el esperado soporte a border-radius, multiples backgrounds, Canvas (ver más abajo), nuevas etiquetas, etc etc.

H. 264

Posiblemente, la próxima “guerra”, la de los formatos de vídeos en internet. Microsoft apuesta por h264 (como Apple, o el de Apple, según quien lo mire, o como lo quiera mirar).

Chakra, motor de javascript

Internet Explorer 9 incluirá un nuevo motor de javascript, chakra. Técnicamente, se comenta que correrá el motor de javascript en otro core, en un proceso paralelo al navegador, haciéndolo mucho más rápido. Ya veremos cuando salga y la gente empiece a hacer tests y comparaciones.

DirectX, aceleración de vídeo

Usará directX para mejorar la experiencia de usuario a la hora de reproducir vídeos. Se comenta que, gracias a esto, el uso de recursos será mucho menor.

Etiqueta Canvas

Esto debería ir en dónde HTML5, por que es una etiqueta HTML5. Internet Explorer 9 incluirá la etiqueta canvas, que será una parte central de HTML5 (de hecho, diría que es la más esperada), y que es el corazón de todos los que dicen que HTML matará a flash. Básicamente, en canvas podremos renderizar lo que queramos en 2d, e interactuar con ellos mediante javascript en tiempo real. Obviamente, ya han salido mil experimentos para todo esto, motores para juegos que utilizan canvas, 3d, etc.

¿Cambiará esto algo?

No. Internet Explorer 9 no es la panacea de nada, y que salga Internet Explorer 9 no quiere decir que al día siguiente todo el mundo lo vaya a tener instalado en su equipo. El mayor problema que veo, es que no soportará windows XP, con lo cual, el navegador más moderno por parte de microsoft en windows xp será Internet Explorer 8.

¿Entonces? Pues Internet Explorer 9 será un paso más en la transición de las tecnologías actuales a HTML5 y CSS3, que bajo mi punto de vista debería haber empezado con internet explorer 8. El hecho de que no vaya a funcionar en windows xp, nos va a dejar bastante igual, ya que windows xp es el sistema más usado en la actualidad, y algo de tiempo le queda aún.

Más por leer y probar

Podéis pasaros por la página de Microsoft para Internet Explorer 9, en la que podéis ver todo lo nuevo que traerá el navegador, y varias pruebas.

En principio, no hay fecha de salida oficial, pero se espera que esté disponible a finales de este año, o a principios de 2011 (es decir, medio año aproximadamente).

Tal y como el anterior capítulo, es una colaboración para Blog and Web, y está publicado integramente en su blog.

Visita el capítulo dos de CodeIgniter, las Vistas, desde aquí.

Espero que os guste.

En dicho artículo, comentaba todos los programas que uso a diario en mi flujo de trabajo, así como alguna alternativa. La parte más importante de dicho tutorial, la de montar un servidor web, la pasé bastante por encima, ya que no era el propósito de dicho artículo. En este, entraremos un poco más en detalle sobre como instalar desde cero MAMP (Apache, MySQL y PHP). Y creedme, es bastante fácil.

¿Qué es MAMP?

MAMP no es más que una recopilación de software (en realidad son servicios), que instalará de forma rápida. Si nos dedicamos (o queremos hacerlo) o simplemente por hobbie, al desarrollo web, tener un servidor web montado en casa o en la oficina va a acelerar todo el proceso de manera enorme. Así que, manos a la obra.

MAMP está formado por:

• Apache: Es el servidor web más usado del mundo, por su velocidad, por que es seguro,  y por que es open source (osea, no hay que pagar ninguna licencia). Aquí tenéis su sitio oficial.
• MySQL: Es un servidor de base de datos, también open source. La gran mayoría de las páginas web que visitáis a diario, almacenan sus datos en mysql. Digamos que es la base de datos más extendida en los servidores web. Aquí su página oficial.
• PHP: Es un lenguaje de script interpretado con el cual programaremos páginas web. Tienes más información en su página oficial, y si te das una vuelta por mi blog, verás que hay bastantes posts al respecto.

Las dos primeras aplicaciones, corren como servicios del sistema. Es decir, una vez arrancados, no veremos nada, simplemente están a la escucha, esperando que les llegue una petición. El tercero, será el encargado de realizar tareas de lado del servidor, generar una respuesta, y mandársela al cliente que ha realizado la petición. Imaginaros que entráis en una página donde tenéis que introducir vuestro usuario y contraseña. Apache sería el encargado de mandaros la página que solicita el usuario y contraseña. Una vez los rellenemos, son devueltos de nuevo al servidor web, que mediante lo que hayamos programado en PHP, consultaremos la base de datos (mysql) y permitiremos o denegaremos la entrada.

Por ejemplo, el sistema de blogs mas usado del mundo (wordpress) usa estos tres sistemas. Al igual que el CMS más extendido (joomla), o que uno de los paneles de administración de servidores (Plesk).

Descargando e instalando MAMP

Bueno, que me enrollo, y seguro que si queréis instalar MAMP es por que todo lo de antes ya lo sabéis. Vamos a su página oficial, y descargamos la versión gratuita (a fecha de escribir este tutorial, se incluyen la gratuita y la profesional, pero tranquilos, usaremos sólo la gratuita). Ahora vamos a por un café, por que son 160 megas….

Una vez descargado, moveremos la versión gratuita a nuestra carpeta de aplicaciones…. y ya está instalado. Así de simple, Apache, PHP, y MySQL.

Poniéndolo todo en orden

Por defecto, Apache escucha en el puerto 80, y MySQL en el 3306. En los servicios que instala MAMP, estos puertos están cambiados. Apache está en el puerto 8888 y MySQL en el 8889. Esto es un engorro, ya que cuando queramos entrar a nuestras webs, lo tendremos que hacer mediante http://localhost:8888 y conectar a la base de datos por el 8889. Vamos a ponerlo como en cualquier sitio, en sus puertos de toda la vida. Tenemos dos opciones:

1. La fácil, el modo visual

Vamos a nuestra carpeta de aplicaciones, entramos en el directorio MAMP y ejecutamos el fichero MAMP.

Se nos abrirá un pequeño panel de configuración en el que podremos iniciar los servicios, detenerlos, o cambiar la configuración (opción “preferencias”). Pinchamos en preferencias, vamos a la pestaña puertos, y pinchamos sobre “Usar los puertos por defecto de Apache y MySQL“. Ya de paso, vamos a la pestaña Iniciar/Detener, y desactivamos la cuarta opción “Abrir página de  inicio al arrancar” (yo al menos, la encuentro engorrosa, pero esto es al gusto de cada uno….). Y ya, listo.

2.- La consola, la de toda la vida

Nos dirigimos a Aplicaciones/MAMP/conf/Apache, y en el fichero httpd.conf podemos cambiar el puerto en el que escucha apache (recordamos, por defecto en MAMP 8888). Una vez guardado el fichero, será necesario reiniciar el servicio.

Mas cositas…

Pero pocas. Primero, en la carpeta Aplicaciones/MAMP tenemos un fichero que nos va a servir para agregarlo al dashboard como widget. Para mí, es supercómodo abrir el dashboard, pinchar en el widget del MAMP y ya está todo arrancado. La otra opción es poner  en el dock la aplicación de MAMP que hemos ejecutado antes, de forma que la tengamos siempre a mano (en este caso, quizá os resulte útil desmarcar la opción “Detener Servidores al para MAMP” en Iniciar/Detener).

Por defecto, Apache va a mirar el contenido de Aplicaciones/MAMP/htdocs. Supongamos que queremos que también sirva las páginas que tenemos en otra carpeta de nuestro disco duro, o mejor aún, en una carpeta de nuestro dropbox (no me cansaré de decirlo, si no lo usas ya, instalalo). En mi caso, con el siguiente comando

ln -s /Users/jesus/Dropbox/webs /Aplications/MAMP/htdocs/dropbox

Obviamente, tendréis que cambiar la orden y adecuarlas a vuestras rutas.

Con eso, cuando acceso a http://localhost/dropbox veo todas las webs que tengo en mi dropbox (lo tengo así en casa, en la oficina, y en el portatil, de forma que modifique lo que modifique, lo tengo en todos los sitios actualizado).

Otra forma de hacer esto, es mediantes VHosts (Hosts Virtuales, Virtual Hosts). Esto require crear una entrada en nuestro archivo hosts local, y tocar el archivo de configuración de apache (httpd.conf). Pero esto, ya lo veremos más adelante, si no, de que voy a escribir?

Para realizar estas pruebas, he usado Snow Leopard con las últimas actualizaciones disponibles. No obstante, es posible realizar todo lo anterior en cualquier sistema Linux, y también en windows (ver WAMP o XAAMP)

Espero vuestros comentarios, dudas y sugerencias.

A la vez que han solucionado el bug, han agregado algunas pequeñas mejoras a la Clase Upload, ahora puede renombrar el fichero. Anteriormente, debíamos “apañarnosla” un poco en el controlador para cambiar la extension. Ahora, usando el parámetro de configuración file_name se puede proporcionar el nombre completo, incluyendo la extensión, ignorando el nombre proporcionado por el navegador.

Después e aplicar el parche, necesitarás ajustar el code de acuerdo con la clase si usas la variable file_name en la Clase Upload. Los chicos de CodeIgniter comentan que no son partidarios de realizar este tipo de cambios entre versiones que pueden ser incompatibles con aplicaciones existentes, pero comentan que este cambio era una parte del parche de seguridad.

Fuente oficial.

Basta con darse una vuelta por themeforest para darse cuenta de la cantidad de temas que estos últimos meses hacen uso y abuso de cub3r, hasta el punto de que parece que si haces un tema que no tiene cub3r has hecho un tema que no está a la moda. A tu tema le falta algo.

Quizá escribo todo esto por que el uso y abuso de flash, hace unos años, me hizo huir de él, hasta el punto de practicamente ignorarlo (no, no me llamo Steve ni mi apellido es Jobs, en serio). Y cada día estoy más convencido de que hice lo correcto.

Algunos ejemplos

No hace falta decir que los diseños me gusta, que no estoy criticando dichos themes (que sólo son dos ejemplos), pero sigo sin entender, a día de hoy, el uso de flash para estas cosas. Los frameworks de javascript han dado un salto enorme estos últimos años, haciendo posible muchas cosas que antes veías y decias “eso es flash”, ahora tengas que hacer click derecho para ver si es flash o no. Los navegadores cada vez son mas compatibles con css3 y html5, haciendo que aparezcan nuevas formas de presentar el contenido, antes también sólo al alcance de flash.

Patada a cub3r?

Por ejemplo, el apartado cases de esta appear.dk vemos una galería de trabajos con una presentación impecable… y no está hecha en flash. Seguro que más de uno conoce algún ejemplo similar, de cosas que hace 3 años eran exclusivas de flash, y que ahora están al alcance de javascript.

Varias aclaraciones

He puesto themeforest como ejemplo por que es una de las galerías de plantillas que más visito. No tengo nada contra themeforest, no tengo nada contra los autores de las plantillas citadas, y no soy autor de plantillas de themeforest ni de ningún sitio similar.

No utilizo Cub3r, no conozco al autor/autores, y no tengo nada contra el o ellos.

Este post, es simplemente una crítica no a cub3r en sí mismo, si no a cómo cuando sale algo nuevo en este mundillo, el uso y abuso de dicha tecnología tal cual y como sale de la caja (es decir, sin personalizar, sin modificar, tal cual viene) puede llegar a cansar, y de como algo que viste hace unos meses te pareció impactante, ahora lo miras con una sonrisa en la cara.

Tampoco quiero criticar a usanza, sin base alguna, el uso de flash. Hay cosas que sólo se pueden hacer con flash, como un reproductor de video totalmente compatible (casi) con todos los ordenadores de escritorio, sistemas de videochat, webs con películas de fondo (otras que tan de moda se están poniendo de moda últimamente) y similares. Pero sí soy un defensor de, si puedes hacer una cosa sin flash, aunque te cueste un poco más de trabajo, no uses flash.

/usr/local/psa/bin/pleskbackup domains-name dominio.com –output-file=dominio -v

Nota: output-file va precedido de dos guiones.

function validarEmail(value) {
var filter = /^([a-zA-Z0-9_.-])+@(([a-zA-Z0-9-])+.)+([a-zA-Z0-9]{2,4})+$/;
return filter.test(value);
}

Le pasamos la dirección de email que queremos validar, y nos devuelve un boleano.

Esto nos sirves para validaciones rápidas sin tener que recargar la página completa, pero desde el lado del servidor tendremos que volver a validar los datos, ya que no es aconsejable nunca fiarse de las validaciones en javascript….

$(”#miInput”).val(”);

Pero si estamos trabajando con un formulario grande, con varios tipos de campos, algo tan simple nos puede tomar mucho tiempo.Buscando por internet y hechandole un ratillo, me he creado esta función (he comentado todas las líneas para que todo esté más claro):

function limpiaForm(miForm) {
// recorremos todos los campos que tiene el formulario
$(’:input’, miForm).each(function() {
var type = this.type;
var tag = this.tagName.toLowerCase();
//limpiamos los valores de los campos…
if (type == ‘text’ || type == ‘password’ || tag == ‘textarea’)
this.value = “”;
// excepto de los checkboxes y radios, le quitamos el checked
// pero su valor no debe ser cambiado
else if (type == ‘checkbox’ || type == ‘radio’)
this.checked = false;
// los selects le ponesmos el indice a -
else if (tag == ’select’)
this.selectedIndex = -1;
});
}

La función recibe un objeto de JQuery que representa el formulario que queremos vaciar. Supongamos que el formulario tiene como id “Formulario1″, lo haríamos de la siguiente forma:

limpiaForm($(”#Formulario1″));

… y todo el formulario limpio.

Incluso puede ser más fácil, si sólo tuviéramos inputs de texto, y algún textarea, podríamos hacer:

$(”#Formulario1 input, #Formulario1 textarea”).val(”);

Otra clara demostración de lo mal acostumbrado que nos tiene JQuery!

Pero aún más simple…

$(”#Formulario1″).reset();

Visita la Introducción a Code Igniter, y dinos que te ha parecido.