Una de las características más destacadas de todo sistema GNU/Linux es el gran entorno de programación que ofrece y que posibilita trabajar con todo tipo de lenguajes y módulos.Contamos con diferentes editores cada uno con sus características y plugins instalables para personalizarlo como lo necesitemos. La mayoría de estos programas se caracterizan por ser libres, es decir, totalmente gratis para el que quiera acceder a utilizarlos.

Al momento de investigar cual queremos, tenemos que saber que hay dos grupos. Tenemos los editores minimalistas y los IDE’s. Vamos a nombrar los mas usados y que recomendamos.

Editores minimalistas:

Estos editores se caracterizan por no ofrecer prácticamente ninguna funcionalidad compleja (de hecho lo promocionan como una ventaja), son rápidos, no necesitan una buena maquina para funcionar.

El mas famoso:

VI y VIM son unos magníficos editores de textos basado en terminal, probablemente, de los más utilizados en todo el mundo. Reconoce una gran cantidad de lenguajes de programación y cuenta con una gran cantidad de características y funciones (numerado de líneas, autocompletado, resaltado de sintaxis, reemplazo de texto mediante expresiones regulares, etc.) que los hacen uno de los editores preferidos por programadores y administradores de sistemas. Vim te ayuda mas con colores en el codigo y Vi es blanco y negro.

Es open source (GPL) y suele estar disponible para cualquier distribución GNU/Linux, sin embargo, también está disponible para sistemas como Mac o Windows, incluso con interfaz gráfica: gVim

URL | Vim

Editores IDE’S:

Geany es uno de los  IDE mas ligeros y con excelentes herramientas que nos van ayudar a llevar a cabo un proyecto. Tiene como principal objetivo disponer de un IDE con funciones básicas, con una curva de aprendizaje muy sencilla y por último, aunque no menos importante, que no sobrecargue el sistema.

URL | Geany

NetBeans es tambien un IDE bastante ligero, soporta el desarrollo para entornos en los que se utilice Java, PHP, C/C++, Groovy o HTML5. Ofrece soporte para bases de datos,control de versiones, minify de los archivos y muchas características más.

URL | NetBeans

Aptana Studio es un IDE creado expresamente para tecnologías web como AJAX, PHP, Ruby, Python, HTML, CSS, etc. Ofrece al programador la misma interfaz de NetBeans, adaptada a las necesidades del desarrollador front-end, como estructura de etiquetas HTML, acceso a una terminal, control de versiones y algunas características más.

URL | Aptana Studio

SlimText es una extensión para el navegador Chrome que permite disponer de un editor de textos para programar, sencillo y cómodo, con soporte para múltiples pestañas, que recuerde los archivos abiertos y con soporte para tareas básicas como reemplazo de textos (con expresiones regulares), gestor de temas y soporte para combinaciones de teclas tipo Vim o Emacs.

URL | SlimText

Como vemos, existen varias herramientas para programar en GNU/Linux. Solo es cuestión de ver cuál es la que mejor se adapte a nuestras necesidades y a nuestro estilo de programación.

En esta entrada vamos a ver 5 funciones que tal vez no sabías que se podían hacer con PostgreSQL pero que al saber cuándo y dónde utilizarlas nos puede simplificar el desarrollo de nuestras aplicaciones.

1. Un único query que retorne datos asociados de otra tabla.

Por ejemplo, listado de usuarios y los intereses de cada uno (que se encuentan en otra tabla)

Funciones: array_agg y array_to_string

select u.nombre, u.apellido
,(select array_to_string(array_agg(intereses),’,’) from usuario_interes where usuario_id = u.usuario_id) as intereses
from usuario u

Retorna los intereses como: “futbol,basket,tenis”

2. Obtener la cantidad total de registros afectados en un LIMIT sin necesidad de realizar otro query count(*).

Ideal para paginación de resultados, pudiendo colocar el total general de registros, más allá del total de cada página.

Función: OVER()

select nombre, apellido, count(*) OVER() as total
from usuarios
limit 10 offset 30

3. Obtener un valor determinado sobre un listado de elementos separados por un caracter común.

función: split_part

select split_part(‘a,b,c,d’, ‘,’ , 2);

Resultado: “b”

Ideal para parsear campos en donde se mantiene alguna normalización que permita obtener algún dato en particular. Por dar un ejemplo, un número telefónico separado por “-“, se puede obtener por un lado la característica y por otro la numeración.

4- Formateo de fechas y retornarlas en el uso horario correspondiente.

Cuando utilizar now() o current_timestamp para obtener la fecha del sistema, esta se va a guardar en el formato horario del servidor, que seguramente va a ser diferente al nuestro

select to_char(fecha_creacion AT TIME ZONE ‘-03:00′, ‘DD/MM/YYYY’) as fecha
from usuario

5- Como usar FullText Index, para realizar búsquedas ágiles y contextuales.

Útil para realizar un única búsqueda y que esta se realize en muchos campos, sin necesidad de utilizar un like por cada campo. Además la performance utilizando fulltext es muy buena y se puedan agregar lógica en las búsquedas.

Crear un campo en la tabla que contengan todos los valores por lo que se quiere ubicar el registro.

search varchar(512);

Crear un campo tsvector para poder indexar el contenido.

textsearchable_index tsvector;

Luego cada vez que se inserta o se actualizan los datos se debe realizar lo siguiente

UPDATE usuario set search = coalesce(nombre,”) || ‘ ‘ || coalesce(apellido,”) || ‘ ‘ || coalesce(email,”);

UPDATE usuario SET textsearchable_index = to_tsvector(search);

Para realizar las búsquedas se debe utilizar

select *
from usuario
where textsearchable_index @@ to_tsquery(‘Juan’)

select *
from usuario
where textsearchable_index @@ to_tsquery(‘Juan & Perez’)

select *
from usuario
where textsearchable_index @@ to_tsquery(‘Jua:*’)

Imaginemos por un momento que estamos en un aeropuerto. Aviones aterrizan y despegan con total coordinación. Los vuelos de decenas de compañías en ese aeropuerto se encuentran organizados y sincronizados con los de otros aeropuertos en el resto del mundo.

La torre de control aéreo recibe información de todas partes y toma las decisiones que le son entregadas a los pilotos para que todo se realice sin inconvenientes. Esto es mediator.js, una pequeña clase JavaScript que centraliza la comunicación y nos permite crear canales por los cuales se puede enviar o recibir información, sin tener que preocuparnos por el sincronismo del código que escribamos.

Cómo utilizarla

La forma de uso es muy sencilla: se crea un canal de datos con un nombre a nuestra elección. Luego, podemos elegir que parte del código va a utilizar ese canal, indicando si vamos a enviar datos (publicando en el canal) o sólo nos prepararemos a “escuchar” (suscribiendonos al canal) la información que pueda llegar a través de ese medio.

Para lograr esto, mediator.js nos provee de 4 métodos básicos en su API:

• publish: nos permite publicar información en un canal determinado, sin tener que preocuparnos por quién se encargará de hacer llegar esa información a los suscriptores.
• subscribe: a simples rasgos nos permite decir a qué canal de información nos suscribiremos y qué elegimos hacer con lo que recibamos allí.
• remove: nos permite eliminar un canal de información, para romper el lazo entre quien publica y sus suscriptores
• once: nos permite suscribirnos a un canal de información pero, esta vez sólo recibirá datos por única vez. Luego eliminará su suscripción.

Ejemplo

Para entender mejor el funcionamiento, podemos ver el ejemplo que propone Jack Lawson en la web oficial de esta clase:

var mediator = new Mediator();

// Muestra un alert box con los datos cuando el mensaje es publicado en el canal
// Subscribe retorna el objeto "Subscriber"
mediator.subscribe("message", function(data){ alert(data); });
mediator.publish("message", "Hello, world");

// Otro ejemplo de uso, con objetos JS:
mediator.subscribe("channel", function(data){ alert(data.Message); }
mediator.publish("channel", { Message: "Hey!", From: "Jack" }); //alerts

Uso en el mundo real

Nosotros utilizamos esta clase para nuestro cliente DataFactory donde necesitamos procesar gran cantidad de estadísticas deportivas y mostrarlo en varias pantallas de una aplicación. Con mediator creamos un canal por incidencia (pases, tiros al arco, tiros libres, goles, etc), luego cada módulo que necesitaba esta información solo tenia que suscribirse al canal correspondiente, esperando que le lleguen los datos ya procesados.

Resumen

Finalmente podemos destacar que mediator.js no es sólo una herramienta muy útil para utilizar en un navegador (tanto como JavaScript nativo o cargándolo modularmente mediante RequireJS), ya que también es compatible con Node JS, (descargando por NPM el paquete mediator-js). Sin dudas este pequeño código de 1kb se merece un lugar en nuestros proyectos web.

Para más información recomendamos leer:

El patrón Mediator – Por Addy Osmani

Sitio oficial de mediator.js

“Más de 800 millones de personas utilizan Facebook diariamente, pasando un promedio de 25 minutos al día. Ya tenés tu negocio y tu página de Facebook, con CM Commerce podés tener tu tienda virtual dentro de Facebook y poder llegar a millones de clientes en poco tiempo.”

En nuestro anterior post llamado ¿Debería tener una empresa presencia en Facebook? comentábamos cómo la manera de comprar en línea estaba cambiando gracias a las redes sociales y cuáles eran las ventajas de tener presencia en Facebook para una empresa.

El resultado de nuestro trabajo es CM Commerce, que te ofrece la posibilidad de tener una tienda virtual en tu página de fans (fanpage) de manera instantánea y completamente gratis.

Tu tienda virtual será un sitio de e-commerce completo, con carrito de compras, categorías, portales de pago, descuentos y muchas funciones más.

Pero lo más importante: tendrás las herramientas virales de Facebook en cada rincón de tu tienda, lo que te permitirá llegar no sólo a tus fans, también a los amigos y amigos de tus fans.

Si te interesa probar la beta, entrá a este link: http://www.cmcommerce.biz y hacé click en Crear tienda.

También estamos participando en el concurso Open App, tu voto nos ayuda a estar entre los finalistas. Poné Me gusta en el recuadro negro de este link: http://www.openapp.com.ar/Proyectos/Ver/B0AFC

Esta competencia trae aparejado en la euforia de salir victorioso la creación de sus propios estándares HTML para mostrar una clara diferencia con la competencia, dando un gran dolor de cabeza a los desarrolladores, ya que tenemos no solo que probar nuestro código en los diferentes browsers, sino que en muchas ocasiones adaptarlos por problemas de compatibilidad. FireFox es uno de los navegadores que más respeta la compatibilidad del código (salvo el recién salido Firefox 5 que ya nos hemos encontrado con diferencias en la visualización de algunos divs), así que diseñar y probar el código HTML en FireFox es una forma de asegurarse un código estándard. También el Chrome es un muy buen navegador que trae de forma nativa herramientas que ayudan a los desarrolladores a identificar los problemas.

En Braintive enfrentamos esta problemática basándonos siempre en los estándares HTML brindados por el W3C (The World Wide Web Consortium), una comunidad  internacional que trabaja para desarrollar estándares web, liderado por el ‘inventor de la web’ Tim Berners-Lee. La comisión además de brindar documentación y guías, posee una herramienta para realizar validaciones de nuestro código HTML e informarnos de las diferencias de compatibilidad, una herramienta muy útil para desarrolladores y diseñadores.

Cada desarrollo que realizamos es testeado no solo por el sector de control de calidad, sino también utilizamos una serie de herramientas que verifican la visualización del contenido HTML resultante en los diferentes navegadores, así como también como nos visualizarían los robots de búsqueda de Google, Yahoo, etc..

Un referente nuestro de usabilidad es Jakob Nielsen y citando su cuarta heurísticas de usabilidad dice:

Consistencia y estándares. Los usuarios no deben tener que preguntarse si las diversas palabras, situaciones, o acciones significan la misma cosa. En general siga las normas y convenciones de la plataforma sobre la que está implementando el sistema.

El futuro nos trae aún más problemas de compatibilidad y dolores de cabeza para los desarrolladores, el nuevo HTML5 y su soporte en cada navegador!.

La accesibilidad en un sitio web se refiere a la capacidad del mismo para ser accedido por cualquier persona independientemente de sus limitaciones físicas (por ejemplo la discapacidad visual), también hace referencia no solo al acceso, sino también al uso, donde toca ya cuestiones de ‘usabilidad’.

Prácticamente nadie toma en cuenta esta premisa a la hora de desarrollar un sitio web y suponen que las personas detrás podrán acceder sin problemas al contenido, sin darse cuenta el potencial que tiene un sitio que puede ser accedido por cualquier persona, ya que los accesos en definitiva se traducen de alguna manera a un valor de retorno.

Por ejemplo, suponemos que una persona podría estar viendo un determinado botón de acceso al contenido, de un color, forma o tamaño pensado para  alentar al usuario a hacer click, cuando en realidad esta persona podría estar trabajando con el monitor apagado, ya que es una persona ciega. ¿Cómo puede ‘ver’ entonces el botón?,  son utilizados programas que leen el contenido y avisan al usuario donde pueden hacer click, el botón como figura no genera ningún valor, ya que no puede ser visto, el valor aquí lo genera el texto.

Las personas ciegas o con disminución considerable de la vista utilizan programas que leen el contenido de la página web y de esta forma pueden navegar sin problemas, se sorprenderían observar como ellos trabajan con el monitor apagado y pueden perfectamente ‘visualizar’ cualquier contenido. Un software utilizado para esto es el JAWS

En muchos países ya existe legislación que obliga a determinas páginas de organismos públicos o de algunas empresas a brindar contenido accesible en sus sitios web. El WAI (Web Accessibility Initiative) grupo perteneciente al W3C (The World Wide Web Consortium) también creó pautas para ayudar a desarrollar contenido accesible.

No es necesario sacrificar el diseño a la  hora de hacer un sitio web accesible, simplemente hay que seguir una serie de pautas para guiar el diseño de páginas web a un diseño accesible. Algunas ideas que implementamos en Braintive a la hora de desarrollar un sitio web, para no limitar el acceso de nadie al contenido:

• Todas las páginas deben tener la etiqueta de cabecera TITLE, explicando lo que el usuario va a encontrar, por ejemplo: Página principal, Listado de productos.
• Usar correctamente las etiquetas h1, h2, .. donde debe informar la importancia que tienen los títulos y textos dentro de la página.
• No utilizar tablas para centrar textos o colocar secciones, las tablas deben ser utilizadas para grillas, el posicionamiento de texto se deben realizar por medio de estilos css.
• Utilizar la etiqueta ABBR para brindar detalles sobre abreviaciones, por ejemplo si el texto dice cant. se debe informar que el texto correcto es ‘cantidad’.
• Todas las imágenes deben tener el atributo ALT con el texto al que hace referencia la imagen, si el botón es una imagen que dice ‘Aceptar’, el atributo ALT debe tener el mismo texto. Si se requiere mayor detalle se debe utilizar el atributo LONGDESC
• Los links deben tener el atributo TITLE informando la acción que genera el click, más allá del texto, por ejemplo si link dice ‘compras’, el atributo TITLE debería contener ‘Listado de mis compras mensuales’.
• No utilizar palabras comunes para definir links, como ‘aquí’, utilizar frases más descriptivas dentro de los links.
• Definir atajos de teclado en los links, atributo ACCESSKEY.
• Si se utilizan FRAMES se debe colocar el titulo descriptivo en el atributo TITLE.
• Los listados de selección o navegación deben ser colocados dentro de las etiquetas UL y LI, luego por medio de los estilos css se brinda un correcto diseño.
• Dentro de los formularios se debe utilizar etiquetas standards que son interpretadas por todos los lectores web, que luego por estilos css se puede colocar el diseño acorde al sitio web. Estas son: LEGEND, FIELDSET, LABEL. Por ejemplo la etiqueta LABEL relaciona el texto con el elemento del formulario.
• Tener en cuenta los colores que se asignarán a los botones, existen programas para evaluar como un daltónico los visualizará.
• Dar la posibilidad de agrandar el texto de las letras, por default deben tener un tamaño correctamente legible.
• Si se utiliza javascript, tener un plan B que funcione con javascript desactivado, ya que es posible que algunos lectores no lo soporten.
• Evitar el uso de FLASH! aunque las versiones nuevas de flash y componentes que se agregan a la hora de desarrollar dicen poseer soporte de accesibilidad, existe la posibilidad de incompatibilidad en la lectura del flash por medio del navegador que utiliza el usuario que tienen inconvenientes de accesibilidad. El FLASH es un binario (plugin) que no tiene las etiquetas estándares de HTML por lo tanto imposibilita la lectura por medio de los programas utilizados por personas ciegas para interpretar el contenido web.

No hay que considerar pérdida de tiempo en implementar estas técnicas, es fundamental no limitar el acceso al contenido.