Diciembre 10th, 2008

Hacer miniaturas de Imágenes

Miniaturas

Quien no ha tenido alguna vez que crear una miniatura (Thumbnails), de sus imágenes automáticamente. Una opción puede ser añadirle el tamaño por css, o en la misma etiqueta <img, pero las imagenes se verían mal, puesto que están redimensionadas a tamaño completo.

Una opción muy buena, sin usar php y sin hacerlo manualmente, sería usar JQuery u JThumbs. Mediante el siguiente script tendremos las deseadas miniaturas:

<script type="text/javascript">
$(document).ready(function() {

// aquí realmente hacemos la miniatura
$("a.thumb, img.thumb").jThumb();
// Posicionar imagen (opcional)
$("a.thumb img, img.thumb").jThumbImg();
});
</script>

Lo unico que necesitamos es en enlace previo a nuestro framework favorito jquery:

<script type="text/javascript" src="jquery.js"></script>

Ventajas:

  • No sobrecargamos el servidor con otro script php.
  • Es un proceso automático.

Desventajas

  • La imagen carga entera (aunque visualmente satisfactoria).

Descarga | JQueryJThumb

Diciembre 10th, 2008

Oxite, el Gestor de contenidos de Microsoft

Logo Oxite

Microsoft ha lanzado Oxite, una gestor de contenidos de código abierto (como joomla, wordpress, oscommerce, etc) de producción propia. Las fuentes las podemos conseguir en la web de CodePlex bajo Microsoft Public License.
Este Gestor de Contenidos (GMS), está desarrollado C#, y se puede integrar con algunas herramientas de desarrollo tales como ASP.Net o Visual Studio. Todavía se encuentra en un estado alfa, por lo que por el momento, está destinado todavía a programadores interesados en depurarlo.
Oxite esta pensado para albergar tanto blogs, como sites más complejos como MIX Online, y pese a no estar finalizado, permite a los usuarios ya realizar comentarios, disponer de RSS y también permite a los los webmasters realizar pingbacks y trackbacks. También posee editores WYSIWYG.

Link | Oxite
Descargar | CodePlex - Oxite

Octubre 17th, 2008

Cajas de Igoogle

Llevo bastante tiempo intentando lograr hacer el efecto de arrastrar y soltar de las cajas de igoogle, hay poquísima información en la red respecto a cómo se consigue crear este efecto, a pesar de que es algo muy interesante a nivel de diseño.

Cajas Igoogle

¿Como he conseguido lograr el efecto? La base de todo es la clase prototype que podeis descargar desde ese link. Prototype es un framework hecho en JavaScript que se sirve para ayudar a un desarrollo sencillo y dinámico de aplicaciones web (como cualquier framework) con el uso de técnicas Ajax.
Luego mediante CSS, y definiendo las capas en el init() de javascript (se encuentr todo en el fichero index.html) podremos adaptarlo como queramos.

Enlaces |Demo - Prototype

Octubre 13th, 2008

Estructurar una web con css

Cuando maquetamos una web, lo primero siempre es tener una estructura definida bien sólida 2 columnas -3 filas, 4 filas- 2 columna,.. etc. Siempre he defendido el trabajo sin tablas, y si eres iniciado y crear estas filas y columnas te cuesta, puedes optar por descargártelas desde  este link. Los chicos de IronMyers se han molestado en crear una serie de plantillas con muchas combinaciones.

estructuras

Como verás, el código quedará más limpio y estructurado, con la consecuente perdida de peso en nuestro site que nos ayudará a que cargue más rápido.

Octubre 2nd, 2008

Vuelta a la ciudad

Fry FuturamaDespués de 3 meses en órzola, he vuelto de nuevo a Arrecife, y con mi vuelta he decidido retomar el trabajo en mi blog. Lo había dejado aparcado debido a que en el pueblo del norte de Lanzarote no poseía ninguna conexión a internet. Realmente esto de que no me conecté es una verdad a medias puesto que aunque allí no tenía conexión si me conectaba en diversos lugares, como el trabajo, los días que bajaba a arrecife para ir al cine, etc.

En toda mi semi-ausencia del mundillo de la red, el principal cambio que he encontrado ha sido el navegador google chrome, y es que google nos deja caer que está trabajando, a largo plazo eso si, en un sistema operativo, ya que detalles como su ya consolidado gmail, el desarrollo de un s.o. para dispositivos portátiles (android), un nuevo navegador cuya novedad es el campo es un administrador de tareas, y el anuncio de que la próxima versión de ubuntu se hará en instalaciones de google,  denotan el objetivo de futuro que tiene la empresa con sede en California.

Otra de las novedades, es el 10º aniversario de lanzarote.com ( que coincide con el de google) la veteranía de estas webs, y el valor que google da a esto, es lo que hace que competir con ella a nivel de buscadores sea algo ya imposible. Para celebrarlo, hemos lanzado una nueva versión del site con novedades como rent a car en ajax, un sistema de rss por xml en todas las secciones importantes del site, integración de blogs con inserción de artículos  a las secciones del site, nueva cartelera de cine en ajax con visión de trailers oficiales, maquetación total con css y ninguna tabla :D, guía de viajes en ajax, etc.

Dejando el tema online, mi verano se ha centrado más que nunca en el deporte, hubieron buenos momentos para recordar, como las rutas órzola -  tabayesco - órzola (esa caída! edgar shh!).

Algo importante de este verano, ha sido descubrir mi afición por la carrera continua, llegando a pasar de 4 km en 28 minutos a los 10km en 58 de final de verano (esta cifra la dejamos en 50 en navidad ayo! el ritmo de cata pa verano xD). Esta afición por la carrera ha hecho que haya adquirido un Polar RS 200, compra que he realizado en sport area, cuando lo tenga en mis manos ya contaré que tal me va con el.

No quería terminar el artículo sin mencinar a el jodio mahoony, y a yeray y su propuesta de ruta del pingüino eso si es una ruta y no la de tabayesco de edgar. Mahoony a día de hoy me sigues debiendo un gym xD.

PS: ninguno de los personajes aquí descritos sabe de la existencia de mi blog jojo así que los podría haber puñalado un poco más. Un puñal que no sería por la espalda puesto que, ¡coño lo he publicado en la red!

PS2: La segunda parte de mi anterior post scriptum es una parida :S

Julio 22nd, 2008

Modelo Vista Controlador

Posiblemente, si te dedicas a la programación, habrás oido hablar del Modelo Vista Controlador (MVC), ese mismo que tus profesores te insistían en usar tanto. El objetivo de este tipo de modelos es de intentar repetirse lo menos posible y de tenerlo todo organizado o sea hacer una distinción entre la lógica de toda la aplicación y presentación.

Los Fundamentos básicos del MVC son los siguientes:

  • Modelo: Esta sirve como representación específica de toda la información con la cual el sistema va a trabajar. La lógica de datos nos puede llegar a asegurar la integridad de ellos y nos permitirá derivar nuevos datos. ¿Como lo hace?  Pues , no permitiendonos comprar un número de unidades negativas, y también calculando si hoy puede ser el cumpleaños del usuario/a o también los totales, impuestos o importes en un sistema de venta.
  • Vista: Presenta el modelo con el que va a interactuar el usuario, más conocida como interfaz.
  • Controlador: El controlador responde más bien a eventos, normalmente son acciones que el usuario invoca, implica cambios en el modelo y también en la vista (interfaz).

¿Cuáles son los origenes del Modelo Vista Controlador?

Buscando un poco de información historica, podemos decir que este fue descrito por primera vez en 1979 por Trygve Reenskaug (hace ya basante tiempo, para el sector que tratamos), trabajador de Smalltalk, en unos laboratorios de gran investigación de Xerox.

La implementación del modelo fue descrita en este documento.

Frameworks MVC

Los MVC cumplen perfectamente el fin particular de cualquier frameworks, (una estructura bien definida que da soporte a un proyecto web también nos ayuda a que nuestro proyecto sea organizado y bien desarrollado).
Diagrama de Flujo de un framework MVC

Modelo Vista Controlador
Modelo Vista Controlador

1. El index.php nos inicializa el nucleo de nuestra aplicación.
2. El enrutador nos examina nuestra petición HTTP y nos ayuda a determinar que se debe de hacer.
3. Si existe, la cache nos devuelve nuestro archivo HTML sin necesidad de pasar por el sistema , ahorrandos la carga que esto nos conlleva.
4. La Seguridad, ya que antes de que se cargue el controlador se filtran los datos enviados para que estos puedan resultar fiables.
5. El controlador nos carga el modelo, librerias, helpers, plugins y todos los demás recursos necesarios para satisfacer nuestra petición.
6. Finalmente, cuando la Vista está renderizada, esta es enviada al navegador, encontes si la cache se encuentra habilitada, se almacena el resultado para la próxima ocación que la URL sea servida.