Intro: Responsabilidades

En las últimas lecciones nos hemos encargado de separar la información de las categorías y de los productos a sus correspondientes stores. Tenemos un store para categorías y un store para productos. Esto es bueno porque anteriormente la data se encontraba como parte de los componentes. Por ejemplo, este componente “productList” tenía aquí la definición de los productos. Los productos se estaban creando dentro de un componente. Si nosotros definimos los productos dentro de un componente y luego queremos acceder a esta información desde muchos otros componentes, entonces nuestro proyectoempieza a complicarse. Por eso es importante el uso de “stores”. Usando un store podemos acceder al estado fácilmente de esta manera, y no sólo aquí, sino en cualquier otro componente que lo requiera. El store nos permite acceder a la información y a modificar también esta información. Incluso nos permite acceder a valores calculados a partir del “state”. Entonces, para organizar nuestro proyecto, un primer paso fue separar la data de los componentes y situarla en el store. Hicimos lo mismo para las categorías. Anteriormente teníamos la definición de las categorías dentro de “componentes”. Teníamos por un lado los “list-items” y en la parte superior teníamos la definición de las categorías. Ahora, en cambio, es parte del store de categorías y aquí cuando queremos acceder, simplemente hacemos uso de “mapState” para acceder a cada variable de estado que nos interesa. Este es un primer paso para organizar nuestro código. Si queremos dar un paso más allá, tenemos que separar el store de la data, porque el store debe estar encargado de leer datos y de modificar los datos, pero no de la definición de los datos como tal. Los datos deberían ser obtenidos de una fuente de información. En el desarrollo de software en general. Siempre se recomienda separar la responsabilidad de nuestras clases y de nuestros archivos. Mientras más carpetas tengamos, mientras más archivos tengamos, vamos a conseguir un mayor orden para nuestro proyecto. Por ejemplo, nosotros tenemos varios componentes. En un inicio el menú de la izquierda era un solo componente, ahora ese componente incluye otros dos. Incluye a las “categorías” e incluye a las “opciones para ordenar”. Mientras más componentes tengamos, mientras más archivos tengamos, será mucho mejor, porque cada uno tendrá una responsabilidad más específica. Y de esta manera, cuando queramos hacer cambios, vamos a poder hacerlos más rápidamente. Por ejemplo, queremos cambiar alguna lógica relacionada al carrito de compras. Lo haremos en el store correspondiente. Aquí nosotros tenemos “getters”, tenemos “actions” que modifican al “state”. Si queremos modificar algo sobre las categorías, lo haremos aquí. Si queremos modificar algo sobre los productos, lo haremos aquí y mantenemos un orden. Los componentes acceden a la información a través de los stores, salvo que se trate de una información que es sólo para un componente. Si tenemos datos que sólo un componente necesita, y esta información no va a ser consumida por otros componentes, entonces no es necesario poner ello en el store, sino que quedaría como parte del estado del mismo componente. Pero generalmente, mientras más podamos separar, mucho mejor. Entonces, ¿qué es lo que vamos a hacer en este módulo? En este módulo vamos a ir un paso más allá y vamos a separar la data del store. Supongamos que nuestro proyecto ya se encuentra en producción y nosotros queremos modificar los datos de nuestro proyecto, idealmente no deberíamos modificar el store de “categorías”, porque si modificamos el store de categorías podríamos introducir algún “bug”, es decir, algún error en la lógica, y no solo para las categorías, también para los productos. Por ejemplo, qué pasa si yo quiero modificar la información de mis productos, Por ejemplo, qué pasa si yo quiero modificar la información de mis productos que sólo debería ser aquí, pero por equivocación podría borrar algún carácter como alguna llave, y esto podría causar que todo el store deje de funcionar. En cambio, si nosotros separamos la data de los productos a un nuevo archivo, si hacemos esa separación y queremos modificar la data de los productos, ya no hay riesgo de afectar al store porque la data se gestiona en un archivo independiente. Entonces, al estar en un archivo independiente podemos validar que tenga el formato adecuado. Podemos fácilmente manipular este archivo que sólo contiene data. Independientemente de la lógica de cada store. Dicho de otra forma, vamos a crear un archivo json con la data de las categorías y vamos a crear un archivo json con la data de los productos.

Crea una cuenta y continúa aprendiendo 🚀

Intro: Responsabilidades