Entradas

Sobreviviendo sin jQuery

Imagen
La archiconocida libreria jQuery es ampliamente usada alrededor del mundo. Es muy util ya que simplifica muchas tareas. Sin embargo, de un tiempo a esta parte, en mas de una ocasión me he encontrado utilizando la libreria para aprovechar tan solo un par de funciones (normalmente AJAX). Esto puede suponer un pequeño exceso en la pagina creada, sobretodo en proyectos pequeños, cuando muchas de dichas funciones tienen un equivalente sencillo en VanillaJS (una forma coloquial de llamar a Javascript puro, sin dependencias). Por ejemplo: /* AJAX POST */ //jQuery $ . ajax ({ type : 'POST' , url : '/my/url' , data : data }); //vanillaJS var request = new XMLHttpRequest (); request . open ( 'POST' , '/my/url' , true ); request . setRequestHeader ( 'Content-Type' , 'application/x-www-form-urlencoded; charset=UTF-8' ); request . send ( data ); En ningun caso pretendo desalentar el uso de dicha libreria, pero s...

Descargando tablas en CSV

Imagen
Este es un pequeño ejemplo, que me ha resultado util varias veces, por el cual podemos descargar una tabla HTML en formato CSV a traves de Javascript. El codigo se divide en dos partes: la primera que lee la tabla y la devuelve en forma de array; y la segunda que crea un CSV a partir de dicho array y lo "lanza" como una descarga. Espero que os sirva. <script> function table_array ( table ) { var result = [] var rows = table . rows ; var cells , t ; for ( var i = 0 , iLen = rows . length ; i < iLen ; i ++ ) { cells = rows [ i ]. cells ; t = []; for ( var j = 0 , jLen = cells . length ; j < jLen ; j ++ ) { t . push ( cells [ j ]. textContent ); } result . push ( t ); } return result ; } function download_csv () { var data = table_array ( document . getElementsByTag...

App hibrida con Android - parte 2

Imagen
En la primera parte se veia el ejemplo de creación de una web app sencilla. Al ser este caso una aplicacion sobre un blog, la conexion a internet es obligatoria. Sin embargo, en muchos otros casos no es necesario de dicha conexion, como por ejemplo si almacenamos el codigo web en la propia aplicacion. Ademas no se aprovachaba el potencial de una aplicacion hibrida, como el poder llamar desde el codigo web a codigo nativo de la aplicacion/sistema. En esta segunda parte, he ampliado un poco el ejemplo anterior convirtiendolo en una autentica aplicacion hibrida. He añadido una pagina almacenada localmente, que se mostrara en caso de que no disponer de conexion a internet. Esta pagina a su vez tienen dos funciones en Javascript que llaman a una parte del codigo "nativo" de Android. Primero creamos la carpeta de "assets" en el proyecto Despues incluimos los siguientes archivos en dicha carpeta. Estos seran los que conforman la pagina local: una pagina que nos ...

App hibrida con Android - parte 1

Imagen
Una app híbrida (o web app, según criterios)  es una aplicación desarrollada utilizando tecnologías web como HTML, CSS y Javascript; y que a su vez funciona bajo el entorno nativo del sistema operativo en el que se ejecuta. El ejemplo mas básico de una app híbrida en android seria un webview que carga una url, como muestran en Android Developers . De ahi mismo sale este ejemplo, el cual he decidido mostrar por si sirve a alguien. Para empezar, Comenzamos creando un nuevo proyecto con Android Studio, ponemos el nombre que queramos a la aplicación, seleccionamos la API mínima (en mi caso he utilizado la API 16: Android 4.1) y en el ultimo paso escogemos "Empty Activity". Después modificamos los siguientes archivos: En activity_main.xml : <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android= "http://schemas.android.com/apk/res/android" xmlns:tools= "http://schemas.android.com/tools" an...

Aprendiendo un poco: Laravel, React, ...

Imagen
Estas ultimas semanas, para refrescar conocimientos y aprender un par de cosas nuevas, he estado probando algunos tutoriales de tecnologias web como Laravel, ReactJS y Vue.js. De entre todos los que he visto, he encontrado unos cuantos que me han parecido bastante didacticos para quienes pudieran empezar de cero, asi que he pensado compartirlos por si alguien tiene interes y no sabe por donde comenzar: Laravel Tutorial for Beginners , creación de una aplicacion de lista de tareas, paso a paso (con login y registro de usuarios incluido) y con explicacion de cada una de las partes de una aplicacion realizada con Laravel. Tutorial Intro to React , tutorial de la pagina oficial de React, en el que se explica como crear un proyecto, asi como el porque y el como se hacen determinadas cosas con este framework. Todo ello usando de ejemplo la creacion de un 3 en raya con la posibilidad de "volver" a jugadas anteriores. Tutorial de introduccion a ReactJS , otro tutorial, mas s...

Nuevo diseño

Imagen
Tras un año sin mucho tiempo, le he hecho un lavado de imagen a la página (tan solo he reseteado a una plantilla de blogger con un par de retoques míos, el diseño anterior me daba algun problemilla) y en las próximas semanas iré haciendo algunos cambios mas. También un nuevo nombre, coincidente con la nueva web desde donde podré ir probando cosas y hospedando viejos (y nuevos) proyectos e ideas.

Obtener provincia a traves del codigo postal con Javascript

Imagen
Hoy quiero compartir un pequeña utilidad que hice, en Javascript, para obtener la provincia española de un determinado codigo postal. Es muy util para formularios de contacto. Por ejemplo, puede utilizarse para confirmar que la provincia y codigo postal introducido se corresponden correctamente o, como en este ejemplo, para rellenar automaticamente el campo de provincia introduciendo tan solo el codigo postal. Ejemplo: Introduzca un codigo postal valido: Codigo postal: Provincia: Código: <form> Codigo postal: <input type= 'text' id= 'entradacp' > Provincia: <input type= 'text' id= 'salidaprovincia' > </form> <script type= "text/javascript" > function darProvincia ( cpostal ){ var cp_provincias = { 1 : "\u00C1lava" , 2 : "Albacete" , 3 : "Alicante" , 4 : "Almer\u00EDa" , 5 : "\u00C1vila" , 6 : "Bada...