El patron de diseño Fluent es un patron muy util y versatil que no permite encadenar varias llamadas o metodos de una misma clase y luego una vez este todo completado ejecutar otro codigo que realizara la accion final, en muchos casos un builder o una simple llamada a un api.
Sigue leyendoArchivo de la etiqueta: js
Promise Resolve vs Reject – JavaScript
Trabajar con promesas en javascript es cosa del dia a dia, y en mas de una ocacion nos tocara trabajar con promesas y callbacks en el mismo codigo, pero para bien de nuestro codigo es necesario tratar de eliminar esos callbacks lo antes posibles.
Sigue leyendoComponent vs PureComponent
El elemento principal del desarrollo con react son los componentes, ya sean componentes funcionales o sean basados en clases, todas las aplicación en React hacen uso de estos y conocer las diferencia de uno y del otro nos hara sentir bastante seguridad y confianza a la hora de programar nuestras aplicaciones web y/o mobiles.
Sigue leyendoPromises All – Typescript
El poder trabajar con procesos asíncrono (Async) es una de las cosas mas usadas hoy día en el desarrollo, no importa si es algo web o un api con node, o incluso una llamada a un backend desde una aplicación móvil con React-Native las promesas son útiles y nos ayudan a encadenar nuestro código para que funcione de forma magnifica sin tener que estorbar en el main thread de nuestra aplicación.
Para todo eso, Javascript tiene una API bastante fácil de usar y flexible al mismo tiempo «Promises», el cual consta de varios métodos, podríamos pasarnos la vida entera solo con Then y Catch pero podríamos sacarle mas provecho aun si conocemos las funciones de Race o All
Fuente personalizada utilizando React-Native
El propósito de este tutorial sera el utilizar una fuente personalida a nuestro proyecto móvil, eso surge casi siempre por que el cliente o el equipo de diseño tomo la decisión de utilizar una fuente no por defecto del sistema operativo.
El poder utilizar una fuente en los proyecto es bastante fácil, pero para que este tutorial no sea tan corto le agregare varios puntos donde este proceso puede ser caótico y para que no les pase a alguien mas.
Sigue leyendoAnimación infinita con React Native
El crear animaciones Loop con React Native es cosa de niños y aquí les traigo un ejemplo de un pulso utilizando esta API.
Para poder trabajar con animación es necesario utilizar los componentes de Animated
React Provider – Patron de diseño
Los patrones de diseño son una super herramientas a la hora de desarrollar alguna funcionalidad en nuestras aplicaciones si son usados con sabiduría al igual que pueden ser un gran problema si lo implementamos simplemente por usarlo y no por necesitarlo, en este tutorial estaremos implementando el patron Provider junto a React.
Recientemente mientras trabajaba con react-redux, me hice la pregunta cómo funcionaba la función connect que me permite acceder al store de la aplicación mediante dicha función, y quise ver como funcionaba, al final me gusto mucho y lo encontré bastante útil así que me decidí a escribir para que demás personas pueda ver la magia detrás de esto.
Sigue leyendo
WebSockets (SocketIO & Express)
SocketIO una vez salió a la luz revoluciono la forma en la que las aplicaciones se realizaban, y nos brindo a los desarrolladores una herramienta bastante poderosa en cuanto al desarrollo de aplicaciones web se refiere. Brindándonos la capacidad de poder comunicarnos con nuestros clientes de forma directa en tiempo real.
Aprovechando la acogida de las apis de HTML5 socket.io nos brinda una interface para poder utilizar WebSockets y ademas a eso nos abstrae de usar metodos alternativos a WebSockets para navegadores que no lo soporten y aun así brindar a todos nuestros usuarios aplicaciones en tiempo real. Esta libreria cae perfecto para aplicaciones como Chats, Juegos, Analitica y demás, se puede ser bien creativo cuando tiene una comunicación bi-direccional con nuestros usuarios.
Service & Factory Angular
Como todo proyecto organizado no podemos tener toda la logica y/o funcionalidades core en controladores y mucho menos en vistas, AngularJs tiene el concepto de Servicio esto lo implementan de 2 formas, Service y Factory, ambos podrian ser usados del la misma manera pero es bueno tener en cuenta como funcionan para así sacarles el mas provecho.
Antes de hablar de service y demás cosas es bueno saber que AngularJS maneja el concepto/funcionalidad de inyección de dependencia (dependency injection), Angular utiliza esto a la hora de requerir cierto componente desde cualquier parte de la aplicación este es inyectado a nuestro controlador (Digamos). Este concepto lo usamos desde el principio, un ves decimos en nuestro controlador:
Sigue leyendo
Compartir data entre controladores AngularJS
Algo que sucede bastante mientras se esta usando AngularJS es querer que 2 controladores interactuen con la misma data, esto se puede hacer de varias maneras, o con un servicio o una factoría (La verdad es la misma forma de hacer digamos).
Ejemplo:
Digamos que tenemos un template con su app test con 2 controladores main y main2 y ambos estan pintando la variable service.message.
HTML
<div ng-app='test'> <div ng-controller='main'> {{ service.message }} </div> <div ng-controller='main2'> <p>{{ service.message }}</p> <input type="text" ng-model='service.message'/> </div> </div>
JavaScript
var app = angular.module('test',[]) app.controller('main',function($scope,ServiceTest,serviceFactory){ $scope.service = ServiceTest.data; }) app.controller('main2',function($scope,ServiceTest,serviceFactory,){ $scope.service = ServiceTest.data; }) app.service('ServiceTest',function(){ this.data = { message : "From service init" } }) app.factory('serviceFactory',function(){ return { message:"nice" } });
Para ambas formas funcionara de la misma manera, una vez inyectemos el service o la factoría tendremos la referencia de la misma variable y si cambiamos el valor de dicha variable sera reflejado en ambos lugares por que es la misma referencia.