En la entrada anterior, tratamos las propiedades ( this.props) que sirven para pasar información del componente padre a componentes hijos, pero esa información es inmutable, es decir, no se puede modificar. En esta entrada, vamos a ver el estado de un componente y los eventos. El estado de un componente es información del propio componente que se inicializa con un valor por defecto y éste es mutable durante la vida del componente. Si el estado cambia, el componente y sus hijos se volverán a renderizar automáticamente.
Aprende React.js
En esta serie vamos a tratar React.js desde 0.
Para ver el código completo de la serie: https://github.com/fullstackseriescom/aprende-reactjs
React.js #3: Propiedades y aplicar estilos a los componentes
En esta tercera entrada de la serie sobre React.js vamos a ver las propiedades. Básicamente, las propiedades sirven para pasar información de un componente padre a un componente hijo. En cuanto a la sintaxis, desde el padre sería como un atributo de HTML (propiedad=»valor») y para acceder desde el hijo, se hace a través del objeto props. Como nota, es importante saber que las propiedades son inmutables, es decir, no se deberían modificar ni actualizar. También hay que tener en cuenta que React tiene reservadas ciertas propiedades ( className , onClick , onChange , etc.), por tanto, nosotros no podremos ponerle ningún nombre de estos a nuestras propiedades.
Continuar leyendo «React.js #3: Propiedades y aplicar estilos a los componentes»
React.js #2: Primer componente y JSX
React.js, como ya vimos en la entrada anterior, es una librería para crear SPA (aplicaciones de una sola página) basadas en componentes. Los componentes nos permiten dividir nuestra app en elementos independientes más pequeños. Los cuales, podremos reutilizar en cualquier otra parte de la app.
React.js #1: Introducción e instalación
Con esta entrada, damos comienzo a una nueva serie de artículos en el blog, en la que trataremos React.js desde 0. React.js es una librería que nos permite crear interfaces de usuario para desarrollar SPA (aplicaciones de una sola página). Por tanto, podemos decir que una de las competencias de React.js es Vue.js que ya se ha tratado en una serie y varios tutoriales en el blog, puedes echarle un vistazo. Por si no lo sabías, React.js fue creada por Facebook.
En esta serie, veremos desde el principio como por ejemplo, cómo crear un componente y qué son, cómo funciona el estado en los componentes, las propiedades, etc. También, veremos cosas un poco más avanzadas como, por ejemplo, la gestión del estado de una aplicación con Redux o cómo crear una aplicación con rutas con React Router, entre otras muchas cosas.
En esta primera entrada, vamos a ver como instalarlo. Vamos a ello!