Primeros Pasos con React

Por Cristian Barrientos.

Cristian Barrientos

Antes de comenzar todo acerca de React es importante entender que no es React. React no es un framework MVC que contenga todos los elementos necesarios para construir una aplicación frontend, en cambio React es, como definido por su mismo eslogan, React es una librería para construir interfaces de usuario. Esto por otro lado es lo que habilita a React a ser una herramienta muy robusta cuando es usada en complemento con otras librerías.

Componentes.

Un componente en React en la unidad primitiva de uso de la librería, un componente expresa usualmente una porción de la interfaz de usuario, ya sea gráficamente representando un título en HTML como también un comportamiento como comunicarse con un servicio web para obtener datos o incluso, una combinación de representación gráfica y comportamiento controlado, como ir a un servicio web por una lista de productos y luego representar gráficamente en la página web cada uno de estos productos con sus respectivos atributos. Es decir, puede pensarse de un componente si fuera una unidad independiente y aislada de trabajo.

Estado.

El estado en un componente expresa los valores cambiantes por lo que puede pasar a través de su ciclo de vida, estos valores son almacenados en un objeto javascript y es posible almacenar cualquier tipo de valor en este objeto.


El estado puede ser actualizado por medio de la función “setState” disponible como miembro de los componentes tipo clase y una vez el estado sea actualizado el componente ejecutará de nuevo su método de renderización “render” para determinar su nueva visualización en la página web.

Propiedades.

Un componente recibe elementos de entrada arbitrarios, estos elementos tiene el nombre de propiedades de un componente “Props”, y estos valores tienen la característica de ser de solo lectura. 

Ciclo de vida.

Un componente para por varios estados cuando está siendo manejado por React, estos estados describen el comportamiento por el cual está pasando un componente en algún punto en el tiempo, y dependiendo del comportamiento, existen unos métodos disponibles que se pueden sobrescribir para determinar qué debe pasar en ese momento, es decir, podemos sobreescribir el comportamiento cuando un componente ya está visible en la página web, cuando un componente va a recibir nuevas propiedades, cuando un componente va a dejar de ser visto en la página web y mucho más. 

Componentes en clases.

Un componente puede crearse por medio de una clase de javascript, dicha clase tiene que extender de React.Component y sobreescribir el método “render”.

Las ventajas que ofrece esta forma de hacerlo es que tenemos acceso a los métodos del ciclo de vida de un componente.

Componentes en funciones.

Un componente también puede expresarse como una función en la cual su comportamiento es similar al de una función “render” dentro de un componente tipo clase, es decir, no se tiene acceso a los métodos del ciclo de vida o al estado del componente, solo se tiene acceso a la propiedades de entrada.

Comparte este post 

 #IASSOFTWARE.