React: state para dummies con una analoga simple

Lastimosamente cuando estaba en la universidad estudiando la carrera no me ensearon ningn framework frondend, los conocimientos que tengo React los fui adquiriendo de manera autodidacta (irnicamente la pandemia ayud este aprendizaje por el tiempo libre excedente.)

Uno de los conceptos fundamentales para entender React es el estado. Personalmente me cost mucho entenderlo bien pese a que lei varias definiciones y vi varios tutoriales sentia que no entenda los conceptos del todo, lo que es muy normal al principio cuando nos enfrentamos a aprender algo desde cero y mas aun por cuenta propia.

En la pgina thinkster tienen un artculo pequeo donde realizan una analoga para recordar y entender el estado de un componente, en parafrasis, mas o menos dice lo siguiente:

LOS ESTADOS DE LA MATERIA
El agua, desde la primaria nos ensean que este elemento tiene 3 estados bsicos: lquido, slido y gaseoso. Qu factor es el que hace que el agua est en un estado o en otro? La respuesta es sencilla: la temperatura; si elevamos la temperatura el agua empieza a evaporarse y si por el contrario la reducimos el agua se solidifica convirtindose en hielo.

De igual manera podemos ir alterando el estado de nuestros componentes en React, para que en un momento dado acten y hagan ciertas acciones que deseamos pero en otro momento se desempeen de una manera distinta.

Recuerda que los estados y su manipulacin constituyen el corazn de todo componente React, un componente sin estado no hace la gran cosa, son muy estticos y poco prcticos.

Referencias

Si deseas leer el artculo original te el link directo
https://thinkster.io/tutorials/understanding-react-state

Este post lo encontre en el Curso Profesional de React de Cdigo Facilito, los respectivos creditos a ellos.

Si gustas, puedes leer otras entradas mas que podran ser de tu inters:

Desplegar app de React.js en Netlify (en menos de 5 min)

dux Nov 10 '20 1 min read

#javascript #netlify #deploy #react

App de clima con React 16 (API: OpenWeatherMap)

dux Nov 18 '20 1 min read

#javascript #frontend #react #webdev

Como crear un proyecto de React.js desde 0 | create-react-app

dux Jul 23 '20 2 min read

#javascript #react #spanish #webdev