Un sencillo ejemplo de como implementar jsonp para ajax cross domain en PHP:
No hay comentarios
Categoría: web
Introducción a flexbox
Flexbox 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
Empezar con AngularJS: tu primera app
Uno de mis tema pendientes es hacer alguna prueba con angularjs y la separacion entre frontend y backend. Este artÃculo para bastante interesante:
http://www.toptal.com/angular-js/a-step-by-step-guide-to-your-first-angularjs-app
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:
WebRTC: videoconferencia y más en HTML5
HTML5 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:
- SimpleWebRTC: http://simplewebrtc.com/ Es la liberÃa JS que usa para acceder a la capacidades WebRTC de navegadores modernos.
- Tenemos la parte cliente: https://github.com/HenrikJoreteg/SimpleWebRTC
- Y la parte server: https://github.com/andyet/signalmaster
- Para el server vamos a necesitar: http://nodejs.org/
- También puede interesar: http://socket.io/
- Otra opción: https://github.com/webRTC/webRTC.io
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;
}
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
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/
Crear versión mobile de una web sobre DJANGO
Buscando como hacer una aplicación django apta para escritorio y móviles encontré bastante info, como por ejemplo:
- http://mobiforge.com/developing/story/build-a-mobile-and-desktop-friendly-application-django-15-minutes
- http://stackoverflow.com/questions/1057252/django-how-do-i-access-the-request-object-or-any-other-variable-in-a-forms-clea
- http://stackoverflow.com/questions/164427/change-django-templates-based-on-user-agent
- http://sullerton.com/2011/03/django-mobile-browser-detection-middleware/
- http://opensource.washingtontimes.com/blog/2010/feb/17/loading-templates-based-request-headers-django/
Pero al final la que más me ha convencido la encontré a través de stackoverflow (como no!):
http://stackoverflow.com/questions/2321172/detect-mobile-browser-not-just-iphone-in-python-view
Se basa en el uso de un middleware, el minidetector. En su web hay una brevisima documentación, que además no es correcta 🙁 pero tampoco es tan difÃcil echarlo a andar:
- Nos lo bajamos al directorio de nuestro proyecto:
svn co http://minidetector.googlecode.com/svn/trunk/minidetector
- Lo añadimos a la lista de middlewares en el settyngs..py
'minidetector.Middleware'
- Y ya podemos jugar en las vistas con el parámetro mobile del objecto request, por ejemplo cambiando los templates
def my_mobile_view(request):
if request.mobile:
#do something with mobile
}}}
Ya solo nos falta usar nuetsra framework web mobile preferido (como http://jquerymobile.com)
Probando PhoneGap
Hace unos meses hablaba de varias alterativas para el desarrollo de aplicaciones para móviles. PhoneGap es una plataforma para el desarrollo de aplicaciones para móviles con html, que nos permite desarrollar aplicaciones para varias plataformas (Android, IOs, blackberry, symbian,…) sin tener que aprender los sistemas de cada plataforma. El desarrollo lo hacemos en HTML5+Javascript, si javascript no mola mucho, pero podemos usar la librerÃa JQuery y JQueryMobile.
La verdad es que desarrollar algo sencillo es bastante fácil. He probado el ejemplo dan de como consumir datos de un API a través de JSON y me ha gustado bastante. No he probado la parte de acceso a BBDD en local y demás recursos del sistema móvil (GPS, acelerometros, etc) y solo he probado a compilar para Android. Pero la impresión es bastante buena. Eso sÃ, no sirve para cualquier tipo de aplicación. Pero si tenemos una web en versión mobile no nos costará mucho el hacer de ella una aplicación nativa, disponible en el market, etc.