Desarrollo Web

Actualización a WordPress 2.6.2 por fallo de seguridad

Jueves, 25 Septiembre 2008 en Desarrollo Web, Noticias Tecnológicas

Recientemente se acaba de publicar una nueva versión de wordpress, la 2.6.2. Esta vez para corregir un fallo de seguridad que ocurre en aquellos blogs que tienen permitido el registro en abierto. Stefan Esser ha detectado que un usuario podría resetear la password de otro usuario con una  password generada aleatoriamente. La password generada no es descubierta por el atacante y por tanto es posible que no pueda ser utilizada para nada. A pesar de todo, desde WordPress recomiendan su actualización a modo de prevención. De paso también se han corregido unos cuantos  fallos adicionales.




Comparativa de software para redes sociales

Jueves, 4 Septiembre 2008 en Desarrollo Web, Sistemas de Información

Aunque sitios como Flickr, Meneame, Youtube y Myspace han liderado la denominada web 2.0 en los últimos años todavía hay una necesidad de crear comunidades reducidas orientadas a sectores más específicos. Aquí entran en juego las redes sociales temáticas, redes orientadas a sectores como el deporte, el trabajo o el senderismo por sólo citar unos pocos ejemplos.

Sin duda, las redes sociales han sufrido un auge impresionante. De sólo tener algunas redes como MySpace y Facebook copando el mercado a nivel global, hemos pasado a tener redes temáticas e incluso pequeñas redes sociales privadas, para amigos o grupos de usuarios.

Si bien montar una red social es algo más que construir la infraestructura, existen suficientes opciones libres y comerciales listas para instalar y ahorrarnos bastante tiempo. Aquí realizaremos un análisis de algunos de los numerosos sistemas de redes sociales, para que escojáis la que mejor se adapte a vosotros. Son aplicaciones que tienes que instalar en un servidor para que corran debidamente. Si a la vez tienes manejo en programación podrías a adaptarlo a tus propios intereses ya que muchos de ellas son de código abierto.

Elgg es un motor de creación de redes sociales de codigo abierto realizado en php que acaba de llegar a su versión 1.0, la cual ha mejorado muchísimo respecto a anteriores versiones, soporta plugins e incluso OpenID y OpenSocial con lo cual las posibilidades de ampliación son inimaginables, además de contar con una de las comunidades mas activas, realmente de lo mejorcito que he probado.

AROUNDME es un motor realizado por Barnraiser, es libre y tiene múltiples opciones como la posibilidad de crearnos un servidor personal de OpenID, no parece tener soporte de plugins y tampoco parece contar con demasiada comunidad detrás.

Dolphin está desarrollada por la empresa Boonex, es un sistema muy completo pero que no da sensación ni de integración ni de organización, además de mezclar sistemas ajax muy web 2.0 con marcos y ventanas flotantes del estilo web 1.0. Es Open Source pero al usarlo tenemos la obligación de mantener el enlace hacia la web de los creadores o pagar una licencia (39$ una licencia anual y 99$ una de por vida).
PHPizabi es otro motor con soporte de plugins, es muy potente pero apenas tiene comunidad detrás. Anteriormente tenía una licencia restrictiva pero ahora se ofrece como software gratuito con licencia de uso (EULA) y tiene varios módulos tanto gratuitos como de pago.
Community Builder es una suite/módulo para extender joomla! para que soporte usuarios y otros conceptos adaptados a las redes sociales, la encuentro como una muy buena opción si ya tienes un sitio montado en joomla y quieres aplicar algunos conceptos de las redes sociales, pero para nuevos proyectos no lo recomendaría.



Control de versiones en la empresa

Martes, 13 Marzo 2007 en Desarrollo Web

El control de versiones es una tecnología que permite a una persona o un grupo de personas colaborar y el elaborar un proyecto de forma ordenada. Imaginemos dos personas trabajando en un mismo documento y cada una escribiendo una parte del mismo. Al terminar de redactar, sería necesario que alguna de las dos mandase a la otra sus modificaciones por correo, para que la otra las añadiese al documento todo el texto, ¿cuantas horas debería dedicar a esta tarea?. Pocas, probablemente si el documento es corto, pero ¿si fuesen varias decenas de hojas? y los textos se intercalaran unos con otros?, el numéro de horas sería bastante mas elevado, por no decir la probabilidad de que dicho usuario cometiera algún fallo.

Para ayudar en este tipo de labor existen varios sistemas similares denominados control de versiones que básicamente lo que hacen es automatizar todo este trabajo. En Abartia Team hemos probado varios de ellos, y finalmente hemos implantado Subversion (SVN). Este es su sitio en Internet:http://subversion.tigris.org/

Es un sistema moderno de control de versiones que utilizamos para sistematizar el control de nuestros proyectos y que además es Software Libre. Podeis leer mas al respecto en su sitio oficial (el enlace anterior), o en la Wikipedia: http://es.wikipedia.org/wiki/Subversion




Presentación de la web de comercio electrónico RedCom

Martes, 13 Febrero 2007 en Desarrollo Web, Noticias de Abartia Team, Soluciones Empresariales

La empresa de telefonía RedCom ha presentado la nueva web de comercio electrónico desarrollada por Abartia Team.

Su intención es competir desde la web, promoviendo una página …




Como localizar tu empresa con Google Maps

Jueves, 6 Julio 2006 en Desarrollo Web, Soluciones a medida

¿Quién no conoce Google Maps hoy en día? Un servidor Web que ofrece mapas desplazables, ampliables y personalizables, compuestos tanto por imágenes de callejeros como por imágenes de satelite.

Se trata de una tecnología que ha calado hondo en internet y que, entre otras cosas, permite su uso de manera completamente gratuita en todo tipo de Webs, incluidas las comerciales, siempre y cuando el acceso a la página donde se muestra sea gratuito.

Una de las ventajas que Google Maps ofrece al entorno empresarial es que la localización mediante esta tecnología permite la inclusión de iconos personalizados para la identificación de la empresa en el mapa, de manera que el propio logo puede indicar la localización exacta de la empresa y no romper así con la imagen corporativa.

Este tipo de mapa es realmente facil de manipular, por lo que expondremos como ejemplo lo que hemos hecho para nuestra Web:

  1. Para utilizar Google Maps, lo primero que hay que hacer es crear una cuenta en Google (con una cuenta de Gmail también nos vale)
  2. Una vez obtenida la cuenta, necesitaremos pedir una clave (key), que nos permita utilizar el API de Google Maps desde nuestro dominio. Necesitaremos una clave distinta para cada dominio donde vayamos a insertar el mapa.Una vez tengamos la clave, el uso del API para crear un mapa con la localización de nuestra empresa es relativamente sencillo:
  3. Creamos un documento HTML con sus partes fundamentales:
    <html>
    <head>
    <title>Ejemplo Mapa Abartia</title>
    
    </head>
    <body>
    <h1>Localización de Abartia</h1>
    </body>
    </html>
  4. Añadimos la llamada al API de Google, mediante una etiqueta <script> dentro del campo <head> de la web. En el parametro key de la URL, se deberá introducir la clave facilitada. Por ejemplo, para el dominio www.abartiateam.com esta será: ABQIAAAAOZ___lY-aPqjpyQwGsqqVRTgWyDm2t_NAnmiqOBiWP0tgX-Y9BQ0tr2Kd9p2zS-cFD68A_UMMtfGxg
    <head>
    [...]
    <script xsrc='http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAOZ___l…‘
    type=’text/javascript’></script>
    […]
    </head>
  5. Añadimos las funciones load() y GUnload() a los eventos onload y onunload de la etiqueta <body> respectivamente para que se muestre el mapa una vez cargada la página.
    <body onload='load()' onunload='GUnload()'>
  6. Dentro del cuerpo de la página, añadimos la capa (div) donde se mostrará el mapa, indicando también su anchura, altura y margenes. Es importante añadir un identificador para el div. En este caso lo identificaremos como “map”.
    <div id='map' class='mapa' style='width: 44em; height: 35em; margin: 0.5em auto;'></div>
  7. Una vez preparada la página, se debe añadir un script a la sección <head> donde configuraremos los atributos del mapa (coordenadas, iconos, texto a mostrar, etc.). En el caso de Abartia Team, el script es el siguiente:
    <script type='text/javascript'>
    
    //<![CDATA[
    
    function load() {
    if (GBrowserIsCompatible()) {
    
    var icon = new GIcon();
    icon.image = 'logo_abartia.gif';
    icon.shadow = 'map_shadow.png';
    icon.iconSize = new GSize(105, 42);
    icon.shadowSize = new GSize(101, 30);
    icon.iconAnchor = new GPoint(0, 30);
    icon.infoWindowAnchor = new GPoint(0,20);
    
    var direccion = "
    <address>
    Avenida Enekuri 4, Entreplanta Dcha, Dcha<br />
    48014 - Bilbao<br />
    Bizkaia<br />
    Tel: +34 94 475 88 16<br />
    
    Fax: +34 94 475 96 45<br />
    E-mail: <a xhref='mailto:info@abartiateam.com'>info@abartiateam.com</a><br />
    </address>";
    var marcador = new GMarker(new GLatLng(43.272253,-2.947941), icon);
    GEvent.addListener(marcador, 'click', function(){marcador.openInfoWindowHtml(direccion);});
    var map = new GMap2(document.getElementById('map'));
    map.setCenter(new GLatLng(43.272253,-2.947941), 15);
    map.setMapType(G_NORMAL_MAP);
    map.addControl(new GSmallMapControl());
    map.addControl(new GMapTypeControl());
    map.addOverlay(marcador);
    marcador.openInfoWindowHtml(direccion);
    
    }
    }
    
    //]]>
    </script>

    A continuación trataremos de explicar el script parte a parte:

    1. Lo primero que se hace en la función load es comprobar si el navegador es compatible con el API de Google Maps:
      if (GBrowserIsCompatible()) {
    2. Se configuran los iconos y sus posiciones en el mapa:
      var icon = new GIcon();
      icon.image = 'logo_abartia.gif';
      icon.shadow = 'map_shadow.png';
      icon.iconSize = new GSize(105, 42);
      icon.shadowSize = new GSize(101, 30);
      icon.iconAnchor = new GPoint(0, 30);
      icon.infoWindowAnchor = new GPoint(0,20);
    3. Creamos una variable con la dirección o texto que nos interese mostrar en el bocadillo. Se permiten etiquetas HTML :)
      var direccion = "
      <address>
      Avenida Enekuri 4, Entreplanta Dcha, Dcha<br />
      48014 - Bilbao<br />
      
      Bizkaia<br />
      Tel: +34 94 475 88 16<br />
      Fax: +34 94 475 96 45<br />
      E-mail: <a xhref='mailto:info@abartiateam.com'>info@abartiateam.com</a><br />
      </address>";
    4. Configuramos un marcador para la coordenada que deseamos, y le añadimos el evento “click” para que al pulsar sobre él se muestre un bocadillo con la información descrita en el paso anterior.
      var marcador = new GMarker(new GLatLng(43.272253,-2.947941), icon);
      GEvent.addListener(marcador, 'click', function(){marcador.openInfoWindowHtml(direccion);});
    5. Añadimos un mapa dentro del elemento que identificamos anteriormente con el nombre ‘map’, lo centramos en las coordenadas que nos interesan, y lo configuramos con un nivel de zoom de 15.Indicamos que el tipo de mapa es el callejero (G_NORMAL_MAP), aunque también existen las opciones de foto de satelite (G_SATELLITE_MAP) e híbrido (G_HYBRID_MAP)

      Añadimos los controles de zoom y movimiento (addControl).

      Insertamos el marcador en el mapa, y hacemos que se muestre el bocadillo al iniciar la página.

      var map = new GMap2(document.getElementById('map'));
      map.setCenter(new GLatLng(43.272253,-2.947941), 15);
      map.setMapType(G_NORMAL_MAP);
      map.addControl(new GSmallMapControl());
      map.addControl(new GMapTypeControl());
      map.addOverlay(marcador);
      marcador.openInfoWindowHtml(direccion);

En caso de ser una empresa con más de una delegación, es posible mostrar todas las delegaciones en un mismo mapa, aunque solo se puede mostrar un bocadillo en cada momento, por lo que probablemente la mejor opción sea no mostrar ninguno al principio y desplegarlos al hacer click sobre cualquiera de las delegaciones, como hacen por ejemplo en la Web de la Autoescuela Galdakao, aunque eso queda a elección del autor.

Por último recomendar el paso por la página oficial del API de Google Maps para comprobar todo lo que se puede hacer con esta magnífica herramienta.




Entorno de desarrollo: Eclipse

Martes, 4 Julio 2006 en Desarrollo Web, Soluciones Empresariales

Eclipse es una comunidad cuyo fin es elaborar una plataforma de desarrollo de software. Recientemente se ha publicado la versión 3.2. La cantidad y velocidad de desarrollo de distintos plugins hacen que Eclipse sea un proyecto muy importante y que ofrece un entorno completo de desarrollo.

En AbartiaTeam hemos integrado varios plugins para el desarrollo: subclipse para la integración con Subversion, wpt para desarrollo web, y PHPEclipse para trabajo con PHP, entre otros.




Uso de la tecnología Ajax en el desarrollo web

Viernes, 10 Febrero 2006 en Desarrollo Web

Interesante la utilización de la tecnología Ajax. Hasta hace poco la utilización de varios frames, uno de ellos oculto, mejor dicho con altura cero, era la única forma posible para simular una actualización de los datos sin el molesto paso a una página intermedia.

Los accesos a base de datos se realizaban en el frame oculto y su resultado se enviaba al frame que el usuario si que veía. Esta opción tenía un inconveniente, podía ocurrir que el frame oculto se cargase antes que el frame que se veía y diese un error de javascript al no encontrar donde enviar la información. Las páginas se formaban mal.

Así que era necesario realizar malabarismos y tener miles de controles para que todo funcionase perfectamente.

Con la llegada de Ajax, todo se simplifica notablemente. Por un lado, ya no es necesario tener frames, los buscadores lo agradecerán, y por otro no es necesario controlar que página se carga antes, puesto que sólo necesitamos una y el código javascript se ejecuta una vez se ha cargado la página en el navegador del cliente.

Realmente todo esto recuerda al Remote Scripting que se podía utilizar con el IIS de Microsoft y las active server pages (asp). Si alguien lo ha utilizado se dará cuenta de la similitud, lo bueno es que con la tecnología ajax ya se puede utilizar cualquier servidor web.