Programación para Estudiantes

Hoy vengo a presentar la nueva serie que estoy haciendo en twitch y próximamente en Youtube: The Binary Theory. En esta serie abordaremos diferentes conceptos de Estructuras de Datos y Algoritmos, ¡para poder superar cualquier entrevista que lo requiera! Comenzando por array y listas enlazadas (linked list), hasta acabar con charlas de diferentes ámbitos como puede ser QA o DevOps. En esta serie abordamos de forma teórica y práctica estas estructuras de datos que a veces no entendemos lo suficiente o que incluso se obvian en nuestra formación. Sin embargo, en muchas entrevistas nos encontraremos con preguntas de toda esta temática: Arrays. Listas enlazadas o Linked List (singly and doubly). FIFO y LIFO, pilas y colas. Estructuras jerárquicas como árboles binarios. Grafos. Y mucho más.

Puedes leer mi artículo original en:  https://medium.com/@FerCortesF/gen%C3%A9tica-y-computaci%C3%B3n-qu%C3%A9-son-los-algoritmos-gen%C3%A9ticos-208e0e91bb86  Existe un tipo de computación que basa su forma de trabajar en analogías con sistemas biológicos. ¿Si la naturaleza tiene mecanismos para resolver problemas, por qué no inspirarnos en ellos? A este tipo de computación, inspirada en lo biológico, la denominamos: computación bio-inspirada. La forma en la que la naturaleza ha llegado a resolver los problemas ha sido mediante la evolución biológica , la cual posee unos mecanismos muy potentes, que son los responsables de la biodevirsidad en todos los niveles . Por lo tanto, era cuestión de tiempo aplicar esto a la computación para la resolución de problemas. Por lo tanto tiene sentido aprovechar los mecanismos de la evolución, de una forma simplificada, para resolver problemas. Como una gran simplificación, la naturaleza se encarga de optimizar individuos a s...

Lo primero que hay que tener claro es lo siguiente: React de por sí NO es un framework y Angular 2 SÍ . Pero, entonces, ¿por qué compararlos? son dos formas de trabajar y de hallar soluciones con un nexo en común: un modelo de interfaces basado en componentes. NOTA: Este artículo lo publiqué originalmente en:  https://medium.com/@FerCortesF/el-empate-en-las-caracter%C3%ADsticas-de-react-y-angular-2-c18f9c0c9247 Comodidad vs Libertad Para mí, este punto es un empate . Angular  2 aporta la comodidad de tener un framework completo que dispone de todas las herramientas necesarias para llevar a cabo una aplicación, permitiendo que te despreocupes de tener que buscar la forma de implementar funcionalidades, lo que hace que todo tengas que hacerlo "a su manera". Mientras que React aporta la flexibilidad y la libertad de seleccionar las herramientas con las que deseas trabajar, aumentando así la carga de decisiones tecnológicas que tomar. Esta filosofía permite ir reemplazando ...

A partir de un caso de uso real me surge la necesidad de descargar PDFs y visualizarlos en una aplicación multiplataforma llevada a cabo con Apache Cordova y AngularJS. Para probar cómo podía llevarlo a cabo realicé un pequeño ejemplo en el que se descarga y almacena un PDF en la aplicación y su visualización. Puedes descargar el código aquí  Objetivo Aplicación de Apache Cordova junto con AngularJS que permita descargar al dispositivo un PDF y visualizarlo. Plugins necesarios InAppBrowser -  https://github.com/apache/cordova-plugin-inappbrowser File -  https://github.com/apache/cordova-plugin-file FileTransfer -  https://github.com/apache/cordova-plugin-file-transfer Device -  https://github.com/apache/cordova-plugin-device Utilidad InAppBrowser - Permite la apertura de nuevas ventanas del navegador, incluso permite la llamada al navegador del sistema. File - Rutas del sistema de archivos. FileTransfer - Descarga del PDF. Device - Co...

La Inyección de Dependencias(DI - Dependency Injection) es un pilar fundamental de AngularJSy es que la DI se relaciona con la forma en la que se hacen referencias desde el código, pero, ¿qué es?  La Inyección de Dependencias es un patrón de diseño orientado a objetos. Este patrón nos dice que los objetos necesarios en una clase serán suministrados y que por tanto no necesitamos que la propia clase cree estos objetos.  El framework de AngularJS  gestiona la inyección de dependencias, por lo tanto, nuestras dependencias, como por ejemplo de servicios, serán suministradas por AngularJS. Por ello, al crear un componente de AngularJS se deben especificar las dependencias que esperamos y será el propio framework el que nos proporcione los objetos que se solicitan . Por ejemplo, si necesitamos utilizar un servicio en un controlador, al crear el controlador debemos especificar nuestra dependencia del servicio y no intentar crear un objeto del servicio. En est...

En los lenguajes de alto nivel por lo general se tiene una característica muy importante: la modularidad (por ejemplo: namespace en C# o package en Java). Sin embargo, ¿qué ocurre en Javascript con la modularidad? No existe , Javascript mantiene un espacio global para todo. ¿Qué implicaciones tiene esto? Que a medida que crezca nuestro código más sencillo es que se produzca una colisión de nombres de variables, funciones... AngularJS pretende solucionar los problemas con la modularidad de Javascript. Para ello AngularJS implementa el concepto de módulos , permitiendo la asociación de recursos a cada uno de los módulos. De esta forma, el framework nos proporciona una herramienta para poder realizar un división lógica de responsabilidades. ¿Qué es un módulo?  Un modulo es un objeto de AngularJS que actúa como contenedor de recursos y partes de la aplicación : Controladores, servicios, filtros, etc. [ 1 ]. En la siguiente imagen, obtenida de un vídeo...

A menudo ocurre que al escribir código obviamos ciertas características del lenguaje con el que se trabaja. Más todavía en Javascript dado que tenemos muchos caminos diferentes para llegar a un punto , por ejemplo, definiendo funciones[1]. En estos casos cada uno tiene sus manías para determinadas situaciones, pero al hacerlo podemos obviar ciertas especificaciones o comportamientos del lenguaje. Debido a esto, el otro día me encontré con un problema en Javascript en el cuál se encontraban fechas, que no se habían modificado, con la fecha 1/1/1970 . Las fechas venían en String por lo que era necesario transformarlas a objetos Date. Tras mucho depurar llegué a ver que en un punto (una directiva de AngularJS para fechas) estaba creando el objeto fecha de la siguiente forma: " new Date(fchEnString) " ¿Problema? Que no se comprobaba si el parámetro era null , aunque sí que existía una comprobación posterior acerca de si el objeto creado era una fecha válida.   Sin embargo,...

La idea de AngularJS es mantener los controladores para el enlace de datos y reducir su carga lógica, es decir, AngularJS pretende separar responsabilidades . Por lo tanto, los encargados de tareas comunes y de la mayor parte de nuestra lógica de negocio con los datos serán los servicios. Formalmente, los servicios son objetos singleton que realizan tareas comunes a varias partes del sistema. Esto se puede ver fácilmente con un ejemplo. Necesitamos obtener información mediante una petición HTTP. La petición podría realizarse desde el controlador, sin embargo, esto consigue un código excesivamente acoplado y sin ninguna separación entre responsabilidades. Si la petición HTTP la sacamos del controlador y la encapsulamos en un servicio habremos conseguido separar las responsabilidades. Es más, si deseamos realizar la misma petición desde otro lugar de la aplicación simplemente debemos utilizar el servicio que hemos creado. En el siguiente ejemplo se puede ver un servicio que e...

¿Qué es un controlador? AngularJS emplea el concepto de controladores como el elemento que define la funcionalidad de una parte de la página . Como aproximación se puede decir que un controlador responde a las acciones sobre una interfaz de usuario, lo que permitirá modificar la salida final por pantalla.  Desde el controlador modificaremos el modelo de datos y gracias al enlace de datos que realiza AngularJS la interfaz de usuario se actualizará para responder al cambio del modelo. Es decir, el controlador utilizará el ámbito ( Ver ámbitos ) correspondiente para modificar los datos y de esta forma dar funcionalidad a la parte  de la página a la que afecte el controlador. Lo explicado se puede ver de forma más clara en el siguiente ejemplo: En un controlador se define la variable* "nombre" en el ámbito con un valor inicial y además se define una función que vacía el contenido de la variable "nombre". Desde el HTML se utiliza la variable del ámb...

El concepto de los ámbitos es muy importante y se deben entender para el empleo de AngularJS. La importancia de este concepto radica en qué los  ámbitos son   utilizados por el framework para comunicar controladores y vistas. Es decir, que los ámbitos son el componente que utilizamos para relacionar nuestros datos con las vistas, por tanto deberemos asignar los datos deseados a un ámbito para que este lo lleve a la interfaz. En un ámbito podemos declarar variables* para que estás sean accesibles desde la vista. Es decir, que desde un controlador podremos utilizar las variables del ámbito para establecer los datos que se envían a la parte de la página asociada al controlador. Para el acceso a los ámbitos desde el código se utiliza el objeto  $scope (este objeto representa un ámbito). AngularJS no posee un sólo ámbito, si no que por cada uno de los controladores se crea un nuevo ámbito** . Además los ámbitos están jerarquizados por lo que al anidar un controlad...

Antiguamente el desarrollo de software estaba muy orientado al escritorio de Windows. Esto se producía debido a que el mercado inclinaba la balanza muy a favor de este Sistema Operativo. Después de esto el desarrollo de software paso a estar muy centrado en la tecnología web, debido al boom de internet . Sin embargo, con la llegada de los móviles el panorama ha cambiado. Existen diferentes Sistemas Operativos móviles con un mercado diferente en función del país. ¿Qué podemos encontrar en el mercado móvil? En la actualidad, el mercado tiene una variedad de marcas de dispositivos muy amplia. Sin embargo, en lo referente a sistemas operativos dominantes no existen demasiados. Los sistemas operativos móviles dominantes en el mercado actualmente son: Android : 83% del mercado en España. 50.5% del mercado en Gran Bretaña. 67.3% del mercado en Italia. iOS : 12.9% del mercado en España. 42% del mercado en Gran Bretaña. 18.3% del mercado en Italia. Windows Phone: 3.8...

¿Qué son las directivas? Desde un punto de vista de alto nivel, las directivas son marcadores en elementos del DOM que permite especificar el comportamiento esperado para ese elemento DOM e incluso transformar el elemento y sus hijos [1] . Es decir, las directivas serán las herramientas que se emplean en AngularJS para trabajar con el DOM . Esto permite que el resto de nuestros componentes de AngularJS se centren en la lógica de la aplicación y no en la manipulación del DOM Gracias a las directivas se puede extender el conjunto de etiquetas de HTML disponible. AngularJS facilita un conjunto de directivas, podemos ver estás directivas en los atributos "ng-" que agregamos a los elementos del DOM. Es más, AngularJS nos permite crear nuestras porpias directivas, las cuales brindan la posibilidad de crear etiquetas y atributos propios exclusivos del programador, por lo que en AngularJS utilizaremos directivas por todas partes. Para entender mejor el concepto imagina qu...

¿Qué es y qué aporta AngularJS? Esta duda se resuelve en la primera entrada del blog acerca de AngularJS. Sin embargo, gracias a una comparativa se puede ver de forma mucha más clara su potencia a la hora de enlazar los datos. Por ello a continuación se muestra una comparativa de enlace de datos en Javascript puro, JQuery y AngularJS. Javascript puro JQuery AngularJS Como se puede apreciar en los diferentes ejemplos, el código de AngularJS es mucho más desacoplado del HTML que en los dos primeros ejemplos. Mientras que en los primeros necesitamos tener información de los elementos del HTML (como el ID del elemento), en AngularJS no. En AngularJS desde el HTML se está utilizando una variable del modelo de datos denominada "nombre" que es modificada por el elemento "input" y que se muestra en la capa de saludo. Por lo tanto, cuando desde el código de AngularJS deseemos modificar valores, sólamente necesitaremos conocer el modelo de datos y no n...

Aplicaciones Web Desde un tiempo a está parte la Web ha experimentado un cambio muy grande. Este cambio es consecuencia del estándar HTML5. En este estándar se agrupa un conjunto completo de especificaciones mediante las cuáles se pretende establecer la forma de construir las páginas Web. El objetivo principal que se persigue es una arquitectura Web abierta a cualquier dispositivo, de forma que sea independiente de la plataforma en  la que funcione. Sin embargo, otro de sus objetivos es dejar paso a la aplicaciones Web . Tanto es así que en 2011 la W3C (entidad que publica el estandar) hablaba así de HTML5: " HTML5 es la piedra angular de un conjunto de tecnologías y APIs para construir aplicaciones web [...] alrededor de HTML5, CSS, SVG, WOFF, API (para el acceso a los datos del usuario, tales como contactos y calendario, o las capacidades del dispositivo, como la geolocalización y la cámara) y más promesas para mantener un área de rápido movimiento de la normalizació...

¿Qué es la binarización de una imagen? La binarización consiste en una reducción de información en la que los únicos valores posibles son verdadero y falso (1 y 0). En caso de una imagen digital los valores verdadero y falso se corresponden a dos colores: blanco y negro. ¿Para qué sirve la binarización? La binarización es utilizada en el análisis de imágenes, mediante esta técnica se pueden separar objetos o regiones, que nos pueden interesar, del resto de la imagen. Es decir, que se puede separar el fondo de la imagen de la imagen de los objetos que deseamos analizar. ¿En qué consiste el proceso de binarización ? En el proceso de binarización de una imagen se utiliza normalmente un umbral de la escala de grises  para conocer qué es blanco y qué es negro. Las imágenes por lo general no se encuentran en una escala de grises, por lo que se debe calcular la tonalidad de gris durante el proceso. También se pueden especificar umbrales en base a otra tonalidades, si estamos buscando...

Continuando las entradas acerca de Google Maps (Javascript API V3) y Windows Forms, en esta ocasión veremos la forma de cargar marcadores en nuestro mapa en diferentes puntos. Ya sean diferentes puntos a partir de una lista de direcciones o diferentes puntos a partir de una lista de coordenadas. Direcciones Para comenzar nos basaremos en la técnica empleada en la primera entrada acerca de GMaps y Windows Forms para mostrar una sola dirección el mapa. Aunque en este caso, la diferencia consistirá en que en la etiqueta "[[ADDRESS]]" se reemplazará por un array de direcciones y en Javascript recorreremos este array para mostrar todas las direcciones. Esto se vería de la siguiente forma: A continuación, en el código de nuestro Windows Forms debemos generar un string con el que sustituir la etiqueta de HTML por nuestro array correctamente formado. Esto se realiza de la siguiente forma: const string txtAddr = "[[ADDRESS]]"; private void botCargar...

Continuando con la entrada anterior , en la que veíamos el inicio de la búsqueda de caminos en juegos. Comenzamos viendo el primer problema que se plantea en la búsqueda de caminos: representación del mapa. Después de ver las representaciones más sencillas como pueden ser mediante Grids o Hexágonos, en esta entrada pasamos a ver otras formas de representación más avanzadas que pueden ser utilizadas. En esta entrada veremos las siguientes formas de representación: Puntos de visibilidad Incluyendo Waypoints Dominios de Dirichlet Navmesh Jerarquica Estos son los métodos que podemos encontrar en la representación, podremos observar como la representación que elijamos puede perder optimalidad y naturalidad de las rutas de los personajes. Puntos de Visibilidad Está técnica consiste en definir puntos en las distintas "esquinas" que podemos tener en nuestro mapa. A continuación se deberá unir cada uno de estos puntos con los puntos que tiene a la vista. Es decir, ...