Instalar Cordova en Ubuntu 14.10 para programa aplicaciones Android

Apache Cordova es el framework de desarrollo de aplicaciones para móviles multiplataforma que está detrás de phonegap. Vamos a ver como instalarlo en la última Ubuntu para empezar a trabajar con el desarrollando una app para Android.

Lo primero es instalar node.js (el lenguaje en que el que está programado cordova) y npm (el gestor de paquetes que usa node)

sudo apt-get install nodejs npm

Necesitamos lincar el ejecutanel de nodejs con el nombre node para que luego no falle cordova

sudo ln -s /usr/bin/nodejs /usr/bin/node

Instalamos cordova con npm

sudo npm install -g cordova

Ahora hay que Instalar JAVA y el compilador ant

sudo apt-get install openjdk-8-jdk openjdk-8-jre ant

Nos bajamos el SDK de android

https://developer.android.com/sdk/index.html

Los descomprimimos y establecemos la variable de entorno ANDROID_HOME a donde lo hayamos descomprimido:

echo 'export ANDROID_HOME="/home/patataman/android-sdk-linux/"' >> ~/.bashrc ; . ~/.bashrc

Lanzamos el gestor del sdk para instalar la versión que queramos (la API 19 de Android 4.4.2 nos irá bien)

$ANDROID_HOME/tools/android

Después de instalar el SDK y si queremos emular un android tendremos que crear un emulador. Para ello en el gestor del sdk del paso anterior vamos a Tools>Manage AVDs y creamos una imagen con los parámetros que más nos convengan.

Y ya estamos listo para crear, compilar y ejecutar una aplicación cordova en Android y comprobarq ue todo funciona:

cordova create hello com.example.hello HelloWorld
cd hello
cordova platform add android
cordova run android

Introducción a flexbox

CSS3 logoFlexbox es un esquema de diseño CSS3 para que los elementos de una “caja” encajen de manera flexible ocupando toda la pantalla adaptándose a distintos tipos de dispositivos (caballo de batalla de hoy en día e el diseño web). Es un candidato a estándar en W3C así que habrá que seguirle la pista. Para empezar una buena guía es la que hay en css-tricks

http://css-tricks.com/snippets/css/a-guide-to-flexbox/

Aplicación Django para subida de ficheros

Buscando cosas para un proyecto he encontrado esta app/módulo para la carga de ficheros en una aplicación web usando las últimas técnicas de manera que la carga sea sencilla y visual.

http://blueimp.github.io/jQuery-File-Upload/index.html

Nos permite una carga archivos vía drag&drop, pre-visualizarlos, validar su carga y nos muestra una barra de progreso mientras sube. Y todo con un aspecto bootstrap muy agradable (o si lo queremos lquery ui).

El código está en github como no:

https://github.com/blueimp/jQuery-File-Upload

WebRTC: videoconferencia y más en HTML5

logo-webrtcHTML5 más que con un pan debajo del brazo trae una panadería completa! una de las cosas más golosas es las posibilidad de RTC  con WebRTC que trae las conexiones RTC, canales peertopeer para transmitir sin pasar por el servidor y getusermedia para capturar vídeo.

Hay varios proyectos por ahí que lo usan. Uno es https://talky.io/ que tiene liberado parte de sus componentes:

 

 

 

Solucionar probema usando googlemaps con Twitter Bootstrap

El framework de frontend Bootstrap es cada día más popular. Pero no todo son bondades y con Google Maps da un poco de gerra. Al poner un gmaps en nuestra web basada en bootstrap no vemos correctamente ni los controles del mapa ni los infowindows-s. Googleando es fácil dar con la solución. Está muy bien explicado en:

http://vuknikolic.wordpress.com/2012/04/02/twitter-bootstrap-and-google-maps-v3/

La solución pasa por añadir en nuestro css:

 


#gmap img {
max-width: none;
}

Vagrant: virtualización para desarrolladores

Durante el desarrollo de aplicaciones (sobre todo webapps en php y python) siempre nos encontramos con el problema de tener unificados los entornos de desarrollo y los de producción/preproducción. A los sysadmins siempre nos toca pelearnos con dependencias no contempladas o versiones de librerías que sí están en el los entornos de desarrollo pero no en los de prod. Vamos, un infierno. Para solucionarlo la virtualización nos da infinidad de opciones, pero a veces es un poco lío poner en marcha un entorno de desarrollo virtualizidado unificado. Valgrant nos da una capa de abstracción y de sencillez a todo el proceso:


$ vagrant box add base http://files.vagrantup.com/lucid32.box
$ vagrant init
$ vagrant up

Más información en su web: http://vagrantup.com/

web2py en una sub url

Si queremos que web2py funciones en una dirección del tipo:

http://midominio.com/web2py/

Es necesario que creemos (o copiemos del ejemplo) el fichero routes.py con un contenido similar a:

 

routes_in=(('/web2py/(?P<a>.*)','/\g<a>'),)
routes_out=(('/(?P<a>.*)','/web2py/\g<a>'),) 

Patrones de diseño en JavaScript

lego

Los patrones de diseño son soluciones reusables a problemas de programación comunes. Nos permiten ahorrar tiempo y aprender más sobre un lenguaje. JavaScript cada día tiene más usos (ahora con las plataformas multidispositivo para aplicaciones móviles por ejemplo) y la comunidad se está poniendo las pilas:

http://addyosmani.com/resources/essentialjsdesignpatterns/book/