2019 - Ultimos articulos

  • Webpack transpilando javascript es6 con babel 7

    Seguimos con la guía de Webpack, en este articulo aprenderemos a configurar nuestro entorno de desarrollo con Webpack para que pueda transpilar código es6 (también transpila código de es7) a Javascript convencional (ES5), para lograrlo utilizaremos la librería Babel, pongamos manos a la obra. Este articulo forma parte del Curso...

  • Webpack anulando la entrada y salida por defecto

    [MicroPost] Siguiendo con la guía básica de Webpack en esta micro entrada vamos a aprender a anular los puntos de entrada y salida que tiene Webpack por defecto, recordando que no necesitamos generar un archivo de configuración para lograrlo. Este articulo forma parte del Curso de Webpack, puedes acceder al...

  • Webpack modo de producción y desarrollo

    Seguimos con la guía de configuración de Webpack, en esta parte hay un punto a destacar, aunque su ultima versión no requiere un archivo de configuración, te habrás dado cuenta que al ejecutar Webpack nos muestra un mensaje de advertencia en el cual nos indica que debemos seleccionar un modo...

  • Trabajando con formularios en ReactJS

    Crear formularios con RectJS es muy sencillo, solo hay que poner atención en una sola cosa, los elementos de formularios HTML funcionan de forma un poco diferente a otros elementos en el DOM con React, ya que los formularios normalmente mantienen algún estado interno de los datos, en este articulo...

  • Webpack Instalación y primeros pasos

    Webpack es un paquete de módulos estáticos para nuestras aplicaciones JavaScript modernas. Cuando el Webpack procesa nuestra aplicación, genera internamente un gráfico de dependencia que mapea cada módulo (como lo muestra la imagen de abajo) que nuestro proyecto necesita y genera uno o más paquetes según nuestra configuración. Este articulo...

  • Webpack extraer CSS a un archivo

    Seguimos con la guia de Webpack, en este articulo aprenderemos a configurar nuestro entorno de desarrollo con webpack para que pueda extraer el css de los archivos Javascript, para lograrlo utilizaremos mini-css-extract-plugin, su configuración es muy parecida al componente de HTML. Extracción de CSS en Webpack Si vienens utilizando Webpack...

  • Webpack crear un servidor local

    Seguimos con la guia de Webpack, en este articulo aprenderemos a configurar nuestro entorno de desarrollo con webpack para poder crear un servidor local y poder correr nuestra aplicación sin ningun problema, realmente es muy sencillo hacerlo, pongamos manos a la obra. Webpack dev server Si seguiste la guia, notaras...

  • Configurar webpack con react

    Seguimos con la guia de Webpack, en este articulo aprenderemos a configurar webpack para poder trabajar con React, si aun no tienes configurado el transpilador de es6 para webpack, es necesario que lo hagas ya que es esencial para trabajar con React. Webpack transpilador de es6 Configurar React para Webpack...

2018 - Ultimos articulos

  • Mostrar y ocultar elementos en Angular

    En el articulo pasado aprendimos a trabajar con servicios en Angular, y como como parte de este proceso borramos los sitios de interés que declaramos de forma manual para poder mostrar solamente los que añadimos mediante un formulario, al haber hecho este cambio y cargar la aplicación por primera vez,...

  • Servicios con Angular

    Los servicios son la mejor forma de compartir datos y funcionalidades entre componentes con Angular, ya sean datos propios (datos almacenados temporalmente en nuestra aplicación) u obtenidos desde una API Rest, en nuestra aplicación trabajamos con un objeto en donde almacenamos nuestros datos, pero este objeto esta declarado en un...

  • Formularios con Angular

    El uso de formularios es indispensable en cualquier tipo de aplicación (inicio de sesión, contacto, ayuda, etc), y con Angular no podría ser la excepción, si ya has trabajado con formularios utilizando Javascript puro (un trabajo un poco tedioso), te sorprenderá la diferencia al trabajar con formularios en Angular ya...

  • Mostrar datos de arrays con map y React

    Antes de comenzar debemos recordar que en Javascript todos los array (incluso todo los elementos) son considerados objetos, una vez aclarado este punto podemos seguir, una de las formas habituales de almacenar datos en Javascript es añadirlos a un objeto con sintaxis JSON y en React no es la excepción,...

  • Destructuring assignment es6 (javascript)

    Destructuring assignmen o asignación por destructuración es otro de los pequeños cambios del nuevo estándar de Javascript (ES6) pero que seguramente nos sera de gran utilidad al momento de programar, ya que nos facilitara la extracción de datos de los objetos de una forma sencilla. Recuerda que en Javascript los...

  • Interpolación, property y event binding con Angular

    Nuestra aplicación de Angular ya cuenta con un componente que nos va a permitir agregar y mostrar en pantalla enlaces de interés mediante un pequeño formulario, pero en este momento aun no realiza nada útil nuestra aplicación, es decir, aun no es funcional, en este articulo nos vamos a dedicar...

  • Manejadores de eventos con React

    El manejo de eventos en React es muy parecido a como lo hacemos normalmente con Javascript, aunque este ultimo suele utilizar oyentes como “addEventListener()” en elementos del DOM en espera de, como su nombre lo indica, ocurra algún evento, con React no funciona de esta forma, el oyente se incluye...

  • Plantillas y estilos CSS con Angular

    En este articulo aprenderemos a trabajar con plantillas (templates) y estilos CSS para nuestros componentes, Angular nos proporciona un poderoso sistema de plantillas basado en HTML que nos permite comunicarnos ya sea de la plantilla al componente o viceversa (este ultimo lo veremos en el siguiente articulo), además, Angular nos...

2017 - Ultimos articulos

  • Crear componentes en Angular

    En el articulo anterior explicamos en que consiste la arquitectura del componente principal de Angular (este componente lo obtenemos por defecto al crear nuestro proyecto), te recomiendo que le des una leída para que puedas tener los conocimientos sobre la función que realiza cada uno de los archivos delcomponente y...

  • El core (núcleo) de NodeJS

    En la introducción a NodeJS vimos las bases de las cuales partiremos para aprender a programar grandes aplicaciones entre las cuales destacamos el uso de callbacks y promesas para tener una aplicación asíncrona así como la importancia de aprender ES6, ya que la mayoría de ejemplos estará basada en este...

  • Template strings es6 (javascript)

    Seguimos ampliando nuestro repertorio de artículos de ES6 (el nuevo estándar de Javascript), en este articulo hablaremos sobre los template strings (plantillas de cadenas de texto) uno de los pequeños cambios que trajo con sigo ECMAScript 6, pero no por ello menos importante y que hace más agradable el trabajo...

  • Introducción a NodeJS

    Javascript es un lenguaje que en los últimos años ha tomado bastante peso en el desarrollo web gracias a los full Stack Developer Javascript, que no es otra cosa que un desarrollador que puede programar con Javascript del lado FrontEnd con Angular, del lado BackEnd con ExpressJS y su referente...

  • Clases, herencia y objetos en es6 (javascript)

    Con la llegada de ES6 (nuevo estándar de Javascript) se introdujo el concepto de clases y todo lo que conlleva trabajar con programación orientada a objetos, un cambio que necesitaba si o si Javascript desde hace tiempo, entre los temas que veremos en este articulo encontramos como trabajar con clases,...

  • Función arrow ES6 (javascript)

    Una de las novedades de Javascript en su estándar ES6 (ECMAScript 6) es el uso de las funciones arrow, entre las mejoras que incorpora este tipo de función es la mejora en la sintaxis del código (siendo más limpio y legible), así como el ámbito de las variables con las...

  • Introducción a ES6 (javascript)

    ECMAScript 6 mejor conocido por los desarrolladores como ES6 o ES2015 es el nuevo estándar para trabajar con Javascript, actualmente la mayoría de los navegadores modernos ya cuentan con un soporte bastante bueno para este estándar, es por eso que si te gusta trabajar con Javascript (que es lo más...