Crea una aplicación CRUD completa con un servidor falsificado de Redux-thunk y JSON | Saumitra Vishal | Skillshare

Velocidad de reproducción


1.0x


  • 0.5x
  • 0.75x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

Crea una aplicación CRUD completa con un servidor falsificado de Redux-thunk y JSON

teacher avatar Saumitra Vishal, Front End Developer

Ve esta clase y miles más

Obtenga acceso ilimitado a todas las clases
Clases enseñadas por líderes de la industria y profesionales activos
Los temas incluyen ilustración, diseño, fotografía y más

Ve esta clase y miles más

Obtenga acceso ilimitado a todas las clases
Clases enseñadas por líderes de la industria y profesionales activos
Los temas incluyen ilustración, diseño, fotografía y más

Lecciones en esta clase

    • 1.

      Introducción

      6:05

    • 2.

      Entiende el diagrama de flujo Redux, Redux-thunk

      3:59

    • 3.

      Proyecto de reacción

      1:31

    • 4.

      Instale paquetes y servidor JSON

      2:11

    • 5.

      Cómo configurar un servidor JSON en la aplicación reac.

      3:38

    • 6.

      Crear estructura de carpetas

      0:31

    • 7.

      Cómo configurar Redux

      8:10

    • 8.

      Cómo trabajar con tabla

      7:08

    • 9.

      Cómo escribir nuestro primer reductor y acciones en redux

      5:25

    • 10.

      Cómo hacer una acción para obtener datos de usuarios

      4:49

    • 11.

      Cómo agregar botón de eliminación y edición

      4:03

    • 12.

      Cómo trabajar en medidas y reductores

      2:09

    • 13.

      Acción de Dispatch para eliminar datos de usuarios

      4:11

    • 14.

      Cómo trabajar en un componente

      17:00

    • 15.

      Cómo agregar acciones y reductores para agregar usuarios a JSON

      2:05

    • 16.

      Cómo crear una acción para agregar datos de usuarios

      6:50

    • 17.

      Cómo trabajar en forma

      2:03

    • 18.

      Cómo llenar un valor existente en un formulario de edición

      9:28

    • 19.

      Cómo hacer una acción para actualizar detalles

      3:54

    • 20.

      Conclusión

      0:31

  • --
  • Nivel principiante
  • Nivel intermedio
  • Nivel avanzado
  • Todos los niveles

Generado por la comunidad

El nivel se determina según la opinión de la mayoría de los estudiantes que han dejado reseñas en esta clase. La recomendación del profesor o de la profesora se muestra hasta que se recopilen al menos 5 reseñas de estudiantes.

186

Estudiantes

--

Proyecto

Acerca de esta clase

Conviértete en un desarrollador de Frontend muy demandado y agrega la habilidad de Redux a tu conocimiento de React. Tendrás un poco de borde sobre aquellas personas que solo tienen conocimiento sobre React.

Este curso basado en proyectos te permitirá codificar inmediatamente. Crear aplicaciones con la ayuda de React y Redux mejorará tus habilidades en el desarrollo web moderno.

Con el middleware de Redux-thunk, podrás saber cómo trabajar con api en aplicación de react. Y estoy seguro de que después de tomar este curso te convertirás en maestro para implementar Redux en cualquiera de tu aplicación de React.

Requisito básico

  • Se requiere un conocimiento HTML, CSS y JavaScript.
  • Entender básico del módulo ES6
  • El conocimiento de React agregará una ventaja.
  • Conocimiento redux requiere poco pero te explicaré desde cero.
  • No se requiere experiencia laboral previa con un servidor JSON.

Requisito de software

Ahora vamos a adentrarte en React JS y Redux. ¡Y empieza a codificar!

Conoce a tu profesor(a)

Teacher Profile Image

Saumitra Vishal

Front End Developer

Profesor(a)

I am front-end Web developer, specialize in the area of React JS

I have a bachelor degree in Computer Science from KIIT University. 

Will be happy to share my knowledge and create great content for everybody who wants to join my classes.

You can also join me on my YouTube platform, I have more than 8k subscriber on my Youtube Channel.

Let's build awesome things together :)

Ver perfil completo

Habilidades relacionadas

Desarrollo Herramientas de desarrollo React
Level: Intermediate

Valoración de la clase

¿Se cumplieron las expectativas?
    ¡Superadas!
  • 0%
  • 0%
  • Un poco
  • 0%
  • No realmente
  • 0%

¿Por qué unirse a Skillshare?

Mira las galardonadas Skillshare Originals

Cada clase tiene lecciones cortas y proyectos prácticos

Tu membresía apoya a los profesores de Skillshare

Aprende desde cualquier lugar

Ve clases sobre la marcha con la aplicación de Skillshare. Progresa en línea o descarga las clases para verlas en el avión, el metro o donde sea que aprendas mejor.

Transcripciones

1. Introducción: Hola chicos, cómo va. Mi nombre es Michelle y estoy teniendo más de 50 años de experiencia laboral que Trenton y desarrollador en su industria de software. Y hoy te voy a enseñar que cómo puedes integrar al lector convertido en una aplicación React y realizar toda operación de lectura con la ayuda de regalos y para siempre. Entonces pasemos a la diapositiva. Entonces lo que vas a aprender en este puntaje. Por lo que estarás construyendo una aplicación React desde su cresta. Y estaremos construyendo un componente React con la ayuda de IU material. Y en esta aplicación React via ir a sobre toda la operación actual con la ayuda de adyacentes para siempre. Y no tienes que escribir ningún código back-end para trabajar con la API que se lee, elimina, actualiza y crea. Entonces absolutamente, geocodificación requerida para, para trabajar con la API. En esta aplicación. También estamos usando para administrar el estado de la aplicación. Y vamos a utilizar un, un middleware redex para hacer una solicitud API con nuestro JSON. Entonces, ¿qué habilidades se requieren para este curso? Por lo que debes tener una comprensión básica de HTML aquí y JavaScript. También necesitas una comprensión básica de ES6 y es bueno tener algún tipo de conocimiento de React. Pero de todos modos, voy a estar explicando cada cosa desde cero si no sabes nada del acto. Y también es bueno tener un poco de comprensión en redox. Pero de nuevo, voy a explicar todo desde cero. Y no necesitas ninguna experiencia requerida trabajando con el servidor JSON. Ahora, qué es enfría y tecnología que vamos a utilizar en este proyecto. Por lo que debes tener un código de Visual Studio para escribir todo el código relacionado con reactante, un redex. Y además de eso, debes tener instalado Node en tu sistema. Y una vez que hayas instalado ese nodo, tendrás acceso al NPM. Para que con la ayuda de npm, instalaremos algunas dependencias en nuestro proyecto. Porque proyecto de arte también va a apoyar al dom router reaccionar. Y vamos a instalar esta dependencia, tanque redox x aquí, material, UI, y router React, dom también, y Aacks, sí. Si no estás al tanto del exceso, el exceso es ayudarnos a hacer que el HTTP 2 a y material. ti, ya les he dicho donde el principio que vamos a construir un componente en esta aplicación con la ayuda del material USO. Y vamos a básicamente, él está escribiendo en esto, en este curso. Entonces por eso he usado material UI. Entonces vamos a hacer una demostración de la aplicación. Por lo que vamos a realizar todas las operaciones de lectura una por una con un trozo y adyacente, sin embargo, en nuestra aplicación React. Entonces, exploremos cada operación de lectura uno por uno. Por lo que indicar la operación más alta. Consciente soy capaz de cargar todo el presupuesto de la UE desde el servidor JSON. Y también estamos agregando el acento que se puede ver que estamos agregando la recolección de datos, olvida todos los datos de aquí desde el servidor. Ahora vamos a realizar la segunda operación llamada periodo agregando el, te metes en el lado adyacente de a. así que voy a dar a saber cambio en. Y luego leí gmail.com algo al azar número de contacto y dirección será un fracaso. Y lo admitiré en detalle. Y voy a conseguir tabla actualizada aquí con los actualizados y datos. Por lo que tenemos también sobre la operación crear como, como agregar la UE entrar en el adyacente para siempre. Ahora, la siguiente operación es eliminar al usuario. Por lo que voy a borrar este hola. Ahora, también somos capaces de hacer un borrar los datos de la tabla y leer un texto y también conseguir contratados con el fin de eliminar un ítem de la tabla. El siguiente es en vivo para actualizar el detalle. Entonces voy a dar click en actualizar y aterrizaré en la casa idiota, ¿de acuerdo? Y solo actualizaré el nombre aquí y solo pincharé en nuestra deuda por ahora. También somos capaces de sobre la operación de actualización con las inyecciones Harvard y ahí tendrías tiempo. Entonces te debo toda la funcionalidad con GFF harbor y un lector. 2. Comprende Redux, Redux-thunk y el diagrama de flujo: Entonces chicos, antes quería empezar a escribir cualquier código en React, y solo quería darles visión general sobre lector. Entonces, ¿qué es un redox? Redox? ¿Es predecible, es bueno y tenor, o una aplicación JavaScript, es básicamente administrar toda tu aplicación, el estado, y se usa comúnmente con una biblioteca llamada React o Angular snow, tres principios seguidos de un lector que es fuente única de verdad se afirma un solo lectura. Y cualesquiera cambios que realizamos en cada estado, Utilizamos su función y este es el componente de x y el reductor es para ver. Entonces para actualizar el reductor de estatinas, hemos acíclico crear una acción. Y la acción se despachan desde el componente y se almacena básicamente mantener todo el estado de la aplicación. Y la vista no es más que nuestro componente React. Entonces ahora entendamos qué redox. Entonces lee f, gracias. El middleware que te permite llamar a un creador de acento que devuelve una función es en lugar de objeto de acción. Y esa función recibirá el método de despacho de tienda, que luego se utiliza para despachar acción síncrona regular dentro de un cuerpo de función fue la operación asincrónica se había completado. Entonces, ¿por qué necesito esta vez? Porque el middleware extiende la disponibilidad en tienda y te permite escribir una lógica que interactúa con la tienda. Entonces, ¿cuál es el pivote tang aquí? Entonces un tanque, otra qué parte de la función, pero no es cualquier función antigua. Es un nombre especial para una función que es devuelta por otra. Y así obtendrás más comprensión sobre el tanque o una vez que empecemos a escribir el código en nuestra aplicación. Entonces vamos a entender el diagrama de flujo del redox general. Entonces chicos, este diagrama de flujo de datos, y se puede ver eso aquí. Por lo que aquí se puede ver que en, en lo siguiente, tenemos un componente. Un componente es un despachar una acción. Y aquí la acción no tiene lógica alguna para actualizar el término. Y es sólo actuar como mensajero. Por lo que es un alcance hacia el middleware. Pero aquí, el medio diverso opcional y middleware podría ser cualquier cosa como Hancock, saga. Y en este curso estamos usando la lengua redex. Después llegó a donde el reductor y actualizar el escapado. Por lo que reductor básicamente reemplazó la fecha más antigua con el nuevo estado. El recorrido de imagen inmutable. Por lo que aún tenemos centerline es turno donde almacenamos todo el patrimonio de aplicación y desde la tienda lo pasado el estado actualizado como los refs que el quejoso. Entonces 1 quinto después de la actualización, si eso frota su disparador, el re-renderizado de sus componentes de UI. Por lo que el componente notará contenido titular con el estado actualizado o L0. Por lo que dicen el concepto general de redex y su diagrama de flujo. Y espero que entiendas este concepto de redox y entiendas también el diagrama de flujo. Y en el siguiente video, vamos a reaccionar proyecto con el fin de empezar a trabajar en esta aplicación. 3. Proyecto de configuración de React: Voy a usar material UI para enterrar este cable Botón Inicio. Por lo que vamos a trabajar con IU material y hay que instalar también Jenkins jefe de un globalmente. Por lo que espero que estén al tanto del lado de la misma. Por lo que proporcionó pick a rate APA y sin codificación. que no tengas que hacerlo, así no tienes que escribir ningún código para ejecutar las inyecciones para siempre. Sólo tienes que volver a buscarlo todo. Por lo que tienes todas las diferentes npm install menos g, JSON iRobot. Entonces déjenme empezar a construir la aplicación. Por lo que entraré en mi directorio y abriré esta caótica parafernalia. Y voy a conseguir la aplicación. Por lo que voy a dar el nombre de la obligación y el campo de texto. Y el nombre de la aplicación será muy actor JSON que Rudolf, el nombre de la obligación federal. Por lo que tomará algún tiempo instalar todas las dependencias y volveré una vez toda la dependencia si se puede desinstalar. Entonces chicos, estoy de vuelta y parece que todo depende está instalado. 4. Instala paquetes y JSON: Entonces antes de hacer npm es instalaré algunos paquetes. Entonces entremos a la carpeta de proyectos que he creado, como UD, reaccionemos j, después leamos. Y antes de hacer n inicio timess, lo guardaré. Lo consigo aquí como React redux. Por lo que necesito construir esta aplicación. Ahora, apresurado. Después redactó tanque pesado de lava. Entonces necesitamos material nosotros con el componente en nuestro proyecto. En lo que va de ahora, esta cantidad de paquetes requeridos en nuestra aplicación para construir toda una aplicación spread en una reaccionar con j de Harvard. Leí f veces middleware. Esperemos la instalación. El paquete está instalado. Ahora, ustedes también tienen que instalar este tallador JSON. Por lo que ya he instalado el servidor JSON en mi máquina. Entonces solo te estoy mostrando cómo instalar el JDK en máquina. Entonces tienes que hacerlo. Tienes pintura en la inyección sin embargo evidencia. Entonces esperemos la instalación del paquete. Y también he abierto un proyecto en VS Code. Por lo que la década se abre en VS board adder. 5. Configuración de JSON Server en la aplicación React: Ahora necesitamos crear una variable para mejor db.json militar para trabajar con el JSON Haraway. Y aquí no. Eliminemos esto. Tenemos que crear un archivo aquí. Será db dot JSON y un archivo más, dot archivo ENV. Entonces vamos a obtener el complemento también, dot archivo ENV. Pero con Italia se nos dice la API aquí. Y no quieres este, Sin título. Ahora, vamos a iniciar el desarrollo de React, especie de curva de malla. Se encuentra en el directorio. Algo anda mal por reaccionar. Pero se llevan el nombre de la carpeta. Y lo haré y Tim estrella. Y mientras tanto, el mismo día que empieza, voy a sumar uno aquí. Para que empieces en Jacob para siempre. Añadiré aquí un derivado de carbono. Por lo que dentro de una, dentro esa aplicación Start es un inicio. Así que vamos al código VS y agreguemos el script aquí. A pesar de que será ver archivo db.json. Golpearon el hilio, que tenemos en dado aquí. Y correrá en la cancha. Yo 100 otra vez. Y yo sólo voy a pegarlos y la pestaña de medios aquí. Entonces dicen que datos ficticio, solo estoy editando en su lugar el archivo David y JSON. Entonces tenemos un registro re aquí, vale, en nuestro db.json, también puedes leer los datos en el navegador asic. Entonces para poder leer los datos en el navegador, hay que correr la altura de a, que hemos agregado justo ahora. Entonces solo iré aquí y correré el npm corriendo de nosotros. Y se puede ver que nuestro hardware se ejecuta en esta URL. Por lo que sólo voy a copiar esta URL. Y yo sólo entraré en el embriasure y lo pegaré aquí. Entonces esto es un uso más ahora. Pero se puede ver cualquiera que sea el dato que haya ahí en nuestro db dot. Yo se está cargando en el navegador ya que. Y también puedes leer la mentira de datos si falsifican ID. Por lo que también puedes hacer esto. 6. Crea la estructura de las carpetas: Entonces, empecemos a trabajar en la aplicación de la app. Entonces entraré en mi Código VS y añadiré algunos mayores aún. Entonces tendré las páginas. Entonces. Tendré cuatro sueltos. Y tú dices las páginas. Y tendré una carpeta más llamada redox. 7. Configurar Redux y la ruta: Entonces hagámoslo. Y tú lo levantas. En nuestra obligación. Voy a crear algún archivo aquí, Node.js y acción aquí. Y luego dot js. Entonces habrá un nodo raíz. Y al final es el dedo del pie un poco más grande. Entonces, en primer lugar, tenemos que encabezar la tienda. Por lo que importaría algunas cosas de los datos, realizaría en profundidad. Entonces vamos a importar desde redex, crear, almacenar, aplicar middleware. Y luego lo siguiente, vamos a importar el registrador, registrador. Logger para básicamente arrastrar el estado de la aplicación. Y siguiente estado. Entonces necesitamos importar. Y ya sabes, también necesitamos la lectura de raíces. Diga nuestra, vamos a importar la rúbrica, que tenemos que definir todavía. Ahora. Lo estaremos teniendo, middleware, middlewares. Y dentro de ella los pondré todos los días. Ahora. Voy a revisar en proceso JK, proceso, proceso punto a y a, guardia AN a y B, eso a Nebulosa. Y luego por esta lava en la zona. Ahora realmente voy a empujar logger. Ahora. Definido la tienda, su almacenamiento, pero creará una tienda. Lo reducirías. Aplicando middleware. Middleware en Ford default, lo siento, export default store. Ahora, volvamos al reductor radicular. Entonces necesitamos las lecturas que yo antes. Pero primero definamos el estado inicial básico del reductor. Ve. Aquí lo hará, nos ayudarás en cada pastilla. Estoy exigiendo la aplicación inicial. Entonces sería como YuJa. Por lo que vamos a tener mucho YuJa y también estaremos trabajando con el ángulo tú que. Tan soltero por lo general será justo en un objeto y habrá una carga de pierna más. Por lo que será un falso. Y pasaré raíz, no rotor. Dale el nombre como el tuyo. Reducir. Está bien. No. Voy a utilizar la función de flecha todavía. Y voy a asignar esto al estado inicial, será una acción. Escenario atrás. Y agrega que ahora, simplemente volveré, el defecto está muerto. Creo que lo complejo suman ahora. Y voy a exportar usuario predeterminado. Ahora. Iré a la raíz. Y aquí voy a combinar los tres, reducirlo desde la profundidad misma. Entonces estoy importando el combinado y está ahí. Entonces voy a definir las calificaciones viales y hacer hoy decir lectura experimental combinada Sara. Y lo haré, proporcionando la clave aquí, usuario para acceder. Toma la delantera por la hora, tú también la reducirás. Entonces sí, dijo, y estoy agregando la eugenesia al editor de UV está aquí. Entonces con la ayuda de ¿obtuviste p podré actuar como se almacena la tabla de páginas de los datos. Entonces deja puerto, no reduzca m Ahora tenemos rotor que decir aquí es importante en una tienda. Y déjame ir al índice, no en archivo JS. Entonces en el archivo index.js, necesitábamos proveedor en el libro React proporcionado directamente para publicar para básicamente proporcionar al estado en general la aplicación. Entonces de esa manera usamos proveedor para esa aplicación podemos acceder a una tienda estatal para eso por su nombre. Al igual que los proveedores aunque está proporcionando la aplicación se adapta a toda nuestra aplicación React y se almacena. Ahora, necesitaremos un router de navegador también para tener la aplicación de enrutamiento todos los días en nuestras obligaciones. Por lo que también voy a importante de React router dot I y creo que no hemos instalado el router de reaccionar dot o.Dejar que todo ese paquete, NPM instale React router, dom. Por lo que me olvido de instalar el invitado de Skype. Por lo que mientras tanto se está instalando, solo importaré router React en absoluto. Y el paquete será, estoy en la comparabilidad, el router del navegador. Y de nuevo, voy a envolver la aplicación con ellos El otro fuera con nuestra aplicación ahora tienen la capacidad de enrutamiento. Sí. Ahora, hemos proporcionado una ruta y una tienda en nuestra aplicación. 8. Trabajar con la tabla en la página de casa: Entonces déjame empezar aquí el PDF ancho, aunque lo llevaré Feist homepage, el home.html. Y usaré fragmentos reactivos para generar un n-bit. Entonces si no lo estás, si no estás al tanto de esto como fragmentos. Por lo que puedes instalar esa tensión o reactor redex y grok, pesar de que esto ha ayudado a generar un fragmento. Entonces estoy usando ese texto que puedo enviar en mi código VS. Entonces démosle tampoco. No es sólo todo. Y voy a registrar esta ruta aquí en nuestro archivo app.js. Voy a mover esto y voy a importar React router dom, voy a importar React no sólo cosa, hay algún problema. Entonces creo que no lo almacena en este parque. Entonces en realidad por error, se almacena en R, Así que tenemos que entrar en esta carpeta. Por lo que sólo puedo ir dentro de esta carpeta. Tú sí reaccionas. Sí. Pero lo habrías hecho y ahora voy a instalar el extremo todo reaccionar router abajo. Asegúrate de estar en esa carpeta para instalar la independencia adicional. Aunque. En tanto, voy a importar interruptor y ruta. I. Usaré pitch. Entonces el fuera, que un acto. Y voy a dar el camino que ahora estoy en casa. Y el componente será el hogar. Por lo que se importa automáticamente. Kilómetro de hidrógeno Vf Corp o para importar. Entonces esperemos a que la iteración exagere auto Dom instalado en nuestra obligación. Entonces, vayamos al navegador y actualicemos. Ahora, somos capaces de cargar la página de inicio. Aunque a partir de ahora, qué es lo que voy a referir la interfaz de usuario material fin de construir las tablas en nuestra aplicación. Por lo que sólo voy a ir al componente aquí y sólo averiguar dónde debe estar una tabla de tabla de acciones en la pantalla de datos. Sí. Entonces aquí está la mesa y estoy usando esta mesa. Te mostraré mediante el uso de esta tabla. Entonces cinco veces van a ser todas estas. Por lo que ustedes también solo abren este enlace y copian toda esta historia. Y voy a pegar en mi código VS. Entonces ese es el hogar. Entonces actualizé todo el archivo, sí, me refiero a toda la importación. Ahora. También necesito esto todo lo que necesito en realidad. Por lo que llamaré pico. Voy a copiar todos estos ahora. Entonces vayamos a la página de inicio. No tengo que copiar que me contraten aquí. Simplemente copiaré esta cosa fuera del componente. De acuerdo, Así que tengo aceite de amapola, esta cosa fuera componente de cabecera. Y luego voy a copiar toda esta cosa. Así que asegúrate de que también estes haciendo estallar conmigo. Entonces sí, estoy siendo una cosa relacionada. Por lo que Paige grabó en el Código VS. Bueno, voy a pegar eso ahí y sumar, no, no tengo los datos crudos. Por lo que sólo comentaré este. Y aplico alguna mina de estilismo por mi cuenta lo de alicatado. Entonces te di media con 900 y margen top ganga power play, un 100. De repente peinando y dando los míos y tenemos que copiar la firma tiene para poder aplicar el estilo. Sí. No. Entonces y ahora lo acabo de dejar. Y y solo p y luego la URL donde podemos ver la tabla o no. Por lo que somos capaces de ver que tienen mucho dinero para borrar fila. En nuestro caso. Lo que tenemos no tenemos ni un día sin realmente tener nombre. Después se pondrá en contacto y luego nombre, correo electrónico, dirección y la última. Y aquí estamos teniendo una acción. Y todo debe ser la línea estándar. Entonces solo te estoy dando un centro. Y vayamos al navegador. Por lo que ahora tenemos un rubro adecuado en la mesa. Y ahora para obtener los datos, aunque inicialmente ya tenemos datos y su archivo db.json, pero necesitamos los datos en la tabla. 9. Escribir nuestra primera acción y reductor en Redux para obtener datos de usuarios de JSON Server: Vamos a escribir una facción y redactar. Por lo que voy a estar dando la ceniza puede teclear aquí. Otra vez. Tú sólo estás bien. Y ahora ven, ven a trabajar aquí en archivo de inacciones. Voy a importar tiempos. Yo puedo teclear y voy a dar uno. Por lo general aquí, definiré qué acción aquí. Obtener usuarios. Y D Si por lo general tendrás habitable. Por lo que esta acción tendrá como argumento el presupuesto de la UE. Y ahora vamos a escribir un dividendo en cuota tecnológica o en realidad un poco tipos. Y luego teclea punto. Y la carga útil serás tú. Sí. Está bien. Por lo que dicen el acento. Ahora, tenemos que escribir una expansión de acento como la carga en vivo. Tú solo y será exportación realmente yendo por costo menor hacer sí. Entonces antes de escribir el despachador de acento, pero asegúrate de haber agregado APA. Sí. Ah, primero, voy a agregar la API de la app APA React. Y la API será ésta. ¿ De acuerdo? Entonces en esta API necesitamos aquí. Y de ahí he actualizado el entorno altamente. Entonces necesito hacer empezar con Herbert Eye, entonces. Voy a pasar por este nodo. Enseñé que el desarrollo tenía sobre y realmente aprovechar esta cosa que tenemos que hacer si estás trabajando con la variable de entorno. Ahora, ven al taxano. Y mientras tanto voy a estar escribiendo el accidente en una función de tiempo. Por lo que se está abriendo en el navegador. Por lo que mientras tanto sólo escribiré la imagen porque tardará algún tiempo en cargarla en el navegador. Y necesitamos ese kit también. Entonces si pongo a los niños estoy importando los Aacks. Sí. Ahora, vengamos aquí y hagamos X. Sí, lo hice. Y aquí estaré usando process y, o T y V dot PNG API. Después de eso, voy a hacer en el, entonces que sea eso como bar. Y después de eso, estaré desertando y se pondrá la acción. Obtén lo conseguirás como datos POME. Y yo también pondría un registro de consola aún que podemos tomar si somos capaces de obtener los datos desde el principio, sin embargo no lo son. Y si tienes aire, entonces vamos a coger aquí. Y tanto tiempo, no se dirige. Por lo que ahora ven a este expediente. Y aquí voy a añadir el tipo K. Pero también necesitamos importar los tipos aquí. Por lo que sólo copio este. Y yo voy a pegar aquí. Y los tipos punto llegar a todavía. Y a cambio, acabaré de extender el estado. Y el estado estará en carga útil Chandon y valor inicial, será el azul. Ahora. Será falsa hinchazón. 10. Dispatch una acción para los datos de usuarios en la tabla: Por lo que tenemos montar la acción a despachar. Ahora, vayamos a la página principal. Pero esto en la página de inicio. Y desde aquí vamos a despachar y puedo así que vamos a traer de React redux. Se selecciona U. Y tú lo hiciste padres, sin embargo. Estoy importando el personal de silicio estadounidense y del USDA. Y, y reventar este camino y acción. Y p, si somos capaces de almacenar el usuario puede hacer cola en el lector con eso no lo son. Bueno, lo mantendré en una variable de despacho. Y voy a usar un efecto enorme aquí. Tan importante para ti en la feria, entonces eso es realmente prevalente. Normalmente hacer una llamada API. Se mapeó. Y aquí estamos de vuelta para despachar baja Yuja. Entonces si las acciones automáticamente me identifiquen aunque escritorio importante y también me aseguro de que sea importante como la parte superior. Entonces sí, el importador , baja al usuario. Entonces tenemos esta prueba, el Señor. Ahora estamos en el navegador. Simplemente reemplace la aplicación. E incluso el próximo semestre, si podemos seguir contándole a nuestro narco. Y aquí estamos consiguiendo todo el usuario que tenemos en nuestro archivo db.json. Entonces este es el archivo db.json y todos los datos ahora, tenemos en nuestra carta ¿dices? Entonces vamos a mostrar todo el detalle aquí. Entonces lo que voy a hacer, el buscar el estado de la tienda. Tengo dos unidades un enorme selector dentro del componente home. Entonces voy a ser estructura y voy a usar era sanitaria. Y el estado es tomar la Artesia abajo ya que se puede adelgazar la raíz reducida y el agente reductor. Agregando la clave aquí. Entonces los voy a usar. Usuario de punto de Ted. Y a partir del data.txt, voy a estructurar a los usuarios. Entonces espero que no haga país y esfuerzo por hacer desparejado. Entonces sólo voy a cambiar este. Entonces solo estoy haciendo los datos aún si tienes alguna confusión. Entonces ahora lo que voy a hacer cada año puja es tf.data y todas las familias, ted dot data, te voy a describir, sí. Entonces aquí voy a dar textura. Y aquí lo que voy a hacer, sólo voy a comentar y descomentar. Y voy a hacer te vas a conseguir y te vas, no tenemos ninguna época haciendo la cosa. Entonces voy a cambiar todo todavía. Por lo que será exprimidor. Por llave. Te estoy dando un nombre de punto rho como usuario.name tidy lo estoy dando aquí. Y aquí estoy dando nombre de usuario dot, dot, ¿qué tenemos? Y entonces puedo llamarlo. Entonces tenemos correo electrónico, pero tenemos que simplemente mapear todo. Y aquí será el contacto, y aquí se verá el ancla. Y aquí tenemos que añadir básicamente el botón a la realidad, bueno, me iré como sé. Y y este va a conseguir un gran éxito. Y también asegúrate de que la alineación sea 1010 y todos los datos e ingresa. Entonces vamos al navegador. Recargar. Ahora somos capaces de cargar todos los datos de la tabla desde la tienda. 11. Agregar el botón Eliminar y editar en la tabla: Por lo que la siguiente operación que vamos a realizar, eliminar n. para eso, tenemos que sumar por 10 para poder agregar el botón. Y voy de nuevo a nuestra interfaz de usuario material, y voy a mirar hacia fuera las entradas de botones. Entonces esta es la entrada de botón. Y, y voy a usar este botón, ¿de acuerdo? Entonces en realidad voy a presionar el grupo de botones en realidad, así que voy a usar este. Sólo voy a copiar. Y yo iré al código VM. Y sólo lo pegas. Y déjame quitarle éste. Y nosotros dimos éste, borrar. Y lo hizo. Y voy a quitar el color de primaria aquí. Primaria será como ésta, y ésta será el segundo día. Bueno, le estoy dando el segundo cerebro. Yo y nosotros necesitamos importar también el grupo de botones. Entonces sólo lo abriré todo. Y voy a importar estas dos cosas. Entonces solo copiaré y solo pondré aquí. Y también necesitamos dio su estilo. Está bien. Entonces vamos a copiar esto y pegarlo en la parte superior. Y enorme cuenta el ya tomado. Entonces voy a estar dando aquí, usa un azulejo botánico. Y necesito este azulejo botánico y el fondo. Entonces aquí necesito mis diminutos azulejos y uso, pero en cualquier momento. Y ahora voy a usar este estilo de botones. Y tercero, sí. Vamos a entrar otra vez en cómo te tienen. Por lo que han agregado un día vía solo voy a copiar los archivos. Y supongo que cerrar esto otra vez aquí. Y no tenemos clase ni mesa donde tengamos azulejo bhutanés. Y tenemos algún tema. Entonces vamos a exhibir. Y tenemos creo que hemos importado reaccionar dos veces. Sí, Así que sí, ya conoces una importante. Ahora, ve al navegador. Ahora tenemos nuestro borrar cualquier beta1. Y lo siguiente que vamos a hacer es y también proporcionar algo de espacio en el medio. Pero yo sí, así que es agradable tener algún hueco entre diferentes pero sé lo que voy a hacer. No voy a escribir ningún archivo CIMP Thailand. Estoy todo dispuesto a proporcionar el estilo en línea. Será como de yo a j. e i. Y voy a dar mi píxel que podemos tener algo de espacio. Sí, ahora, tenemos el espacio. 12. Trabajar en la acción y el reductor: Por lo que ahora hemos puesto sobre la operación de borrar. Por lo que de nuevo vamos a escribir el tipo de acento. El tiempo vintage se eliminarán las colas, sí, estamos borrando. Un sindicato hará que se elimine una UGA. Y yo solo llamaré carisma. Y voy a ir a los acentos. Y me limitaré a copiar este por la fidelidad hablar más esa cosa lo sumará a esta ecuación, una longitud de cadena de puerta a borrar. Y recibirá el DNI. Voy a cambiar el nombre, te borraré ahí. Se sumará algunos ID, voy a añadir el ID aquí. Y predigo que diferentes acciones a la vez. Entonces vamos a proporcionar la acción que el usuario eliminó. ¿ De acuerdo? Por lo que no tendrá ningún argumento. Acción con un tipo, un tipo eliminar tampoco. Entonces voy a posponer esa. Eliminar cualquiera de los dos. No matarte a ti también. Sí. O sea, luego borras. ¿ Vivías borrado. Ahora, ve hacia un reductor. Y aquí vamos a sumar este caso. Por lo que va a ser muy horneado kf aquí. Elimina y solo hazlo en su lugar y haz las barras de carga. Por lo que hemos hecho con la acción de borrar. 13. Acción de despatches para eliminar los datos de los usuarios de la tabla: Ahora ven a la página de inicio y acaba de golpear la de borrar. Entonces lo que voy a hacer, voy a escribir uno onclick. Y al hacer click tendremos un mango, eliminar métodos. Y borrar. Y la muerte será el estacionamiento el DNI, usuario. Id. Ahora creado este manejador fuera que devuelva un crear el archivo. Y va a derrotar al DNI. Y, y voy a hacer que se incline, proporcione una ventana. Y fórmulas si oye, borrando eso. Por lo que solo quería advertir míticamente al usuario. Pero de todos modos, quería quitarte que cuando la factura no esté aquí, voy a proporcionar a la ventana un cuadro de diálogo de advertencia, y tendrá un método puesto. Se desea eliminar el a inverso. Por lo que podemos generar el cuadro de diálogo usando la barra window.com y y podemos dar un lago o un compartido. ¿ Estás seguro que querías eliminar el año entonces? El mapa de datos es y haga clic Ok, entonces se entretendrá que si condición y se encuentra ahí, voy a despachar eliminarte la y diluir audiencia importada automáticamente desde el Código VS. Se puede ver en la parte superior, VS Code me está pegando en mi tablero de MDF. Entonces deja camino si Id no años. Entonces creo que erróneamente, conseguirías el mango tratando fuera del componente. No tenemos que crear el componente externo. Tenemos que crear el intacto el componente. Básicamente fuera del retorno. Sí. Aquí Ted. Y tenemos que pasar el DNI. Y una cosa lo asegura en la acción. Para una vez que elimines, también tienes que necesitar los datos actualizados del GitHub. Entonces aquí voy de nuevo a despachar la carga YuJa con el fin de obtener los datos actualizados del JSON P donde esté funcionando o no. Entonces voy a eliminar el último registro, eliminar, y voy a dar clic en Aceptar respecto a nuestra eliminación. Entonces no hay problema. Ahora tenemos problemas con eso puede empatar. Entonces está bien aquí. Está bien. Tengo laberinto aquí, FlatMap, eso no es borrar. Entonces vamos a darle un intento más aquí. Entonces otra vez, va a borrar el último registro. Y ahora estamos en condiciones de eliminar el registro. Tenemos de todos leer operación y borrar operación usando NADH y FADH sobre n. cada cubierta. 14. Trabajar en el componente de forma: Entonces lo siguiente vamos a trabajar en el componente de formulario. Por lo que para poder trabajar en el componente de formulario, tenemos que agregar uno en la parte superior para agregar al usuario. Entonces vamos a añadir el botón. Por lo que iré al componente de casa. Mano aquí. Y vamos a añadir un botón. Aquí, estoy recibiendo el botón. Y luego covariante. Sólo copiaré un botón. En realidad han sido WO sólo copiará este y sólo lo pegarán aquí. Y será una variante. Variante contenida y enojada. Y será el nombre de la pierna que ahí. Y voy a poner esto en batallón en un día porque necesito aplicar un nombre de clase aquí. Entonces solo estoy pintando en el div. Y el nombre de la clase no será el nombre de la clase de estilo. Por lo que tenemos techo de loseta de botón. Entonces veamos en el navegador. Entonces ahora estamos recibiendo el anuncio que con el tiempo. Entonces al click Obtener ruta de datos. Entonces lo que voy a hacer, voy a traer la imagen h3 del router reaccionar dom 0. Se usará h3 y vendrán abajo. Y si retienes la variable t, enorme árbol. Y justo lo que tienes que hacer al click, hey, x3, dot push. Por lo que voy a empujar hacia la torre para ir por esta ruta. De no ser así, prueba. Entonces, sumémosle esta ruta. Entonces aquí en app.js, por punto la página a ti, no son ds. Y simplemente crear un dato transmitido a partir de ahora. El total relacionan ese anuncio ahí. Y no he llegado a esa ruta aquí. Y voy a proporcionar ese nombre fuera como agregar usuario. Y lo compresible le agregamos Egipto, por lo que se importó automáticamente en mi Código VS. Y ahora y solo haz clic en la ADA tú que ahora somos capaces de mover Adi paga entonces y ahí apagón también consiguiendo cadena. Entonces empecemos a trabajar en el área Add, aunque aquí tenemos que trabajar con la caída. Pero de nuevo, voy a IU material y voy a usar el campo de texto. Entonces este es el campo de texto muy básico. Te voy a decir así este te voy a ir. Entonces supongo que lo bueno que ha sido. También abre todo este código fuente. Dejemos importar estas dos cosas. En este año superior a partir de ahora. Y ahora lo que tenemos go copia. Puede que tenga que copiar estas cosas. Y solo pega aquí dentro y quite los dos primeros. Pero sólo necesito y también copiar este empate. Sí, tengo una copia. Y aquí estoy donde se puede crear un ancho por, pero que si golpeo, bien, ahora de 25 a 45, mal. Y dado que con Vayamos a echar un vistazo. Entonces estamos consiguiendo lo apropiado. Entrada a casa. Está bien. Ah, vamos a añadir otras entradas. Will papá se fue, Oh, yo sólo voy a copiar Apala o tiempo porque por ahí y voy a aportar algún valor aquí de, vamos a tratar de encontrar un estado de la aplicación. Por lo que necesitamos proporcionar el valor al campo de entrada también. Entonces te necesito en su lugar. Y aquí definiré el estado. Declara ese bistec que listaste y lo que valoramos nombre tardío, correo electrónico, y luego contactarte. Y entonces hemos tenido genial. Entonces todo está en bonito tampoco ahora. Y de inmediato voy a conseguir, pero no tenemos que escribir como head.next test.html en el valor. Entonces nombre, correo electrónico en cubierta, dirección. Ahora, el valor se nombrará aquí. Y la etiqueta vamos a cambiar de nombre de carriles. Y yo estaré ahí. Y vamos a dar un respiro. Ahora. Y más cerebro aquí. Aquí. Y aquí me acercaré, en MPF y aquí. Y sí, bolsillo estas dos cosas. Será que será un correo electrónico. Sí, así que vamos a comprometernos y este al correo electrónico. Y el correo electrónico y la etiqueta ahora serán contenidos. Valor será contacto. Y ese será el número. Y ésta será la dirección. Y valioso V. Drift será el texto. Y que la ira, pero un promedio. Entonces supongo que copia un botón de aquí. Copiémoslo y peguémoslo aquí. Por lo que no necesitamos onclick. Puede incluso escribir, pero escribir cumbre milímetro. Y para colaborar con variante oportuna y el azulejo será tan importante en realidad, no estamos dejando idear para botones menos importantes ahora, sí, declaración de importación cooperativa. Y yo sólo lo pegaré aquí. Por lo que se pinta la declaración. Y vamos a darle un título aquí. Entonces estilo básicamente solo queremos agregar solo un poco del botón. Por lo que será el píxel de 100. Y, y sólo darle el nombre será algún cuello. Entonces algo de ello. Y lo siguiente que vamos a hacer pierna. Vayamos al médico. Estamos consiguiendo la forma aquí. Ahora. Lo que podríamos hacer, podríamos hacer algo de estilo aquí. Vamos a conseguir algún margen en la parte superior. Por lo que agregaré plática de margen. Y voy a dar calma. No tengo ningún show aún está quemado al Rajah. Sí, Ahora, voy a dar un rubro. Entonces aquí necesitamos un encabezado, lay add user. De acuerdo, Entonces el rumbo muerto. Y necesitamos y necesitamos también un botón. Entonces si, si quisieras volver a entrar, voy a copiar ese botón. Entonces vamos a copiar diferir. Copiaré todo el asunto y lo pegaré. Y esta rueda de color con una secundaria. Entonces estoy dando secundaria. Ciudad de marketing moderna será margen. Top, será película épica. Y seguirá siendo tema. Y en onclick, vamos a cambiar el nombre del botón ágil. Y onclick. Volveremos a la página de inicio. Entonces tenemos que traer aquí es desde el router reaccionar hacia abajo. Vamos a contener día es reaccionar router dom, enorme HJ, y restaurar las tres variables. Y historia. Bueno, conservas el historial variable. Y simplemente lo cambiaré alrededor, como historia, Historia, empuje de puntos, y simplemente le quitaré el tipo. Pero no cuchillen veces 100, tenemos bajo, no tenemos ningún show. Bueno, vayamos al navegador y comprobemos. Sí. Ahora, retrocede. Entonces está funcionando. Entonces vamos a iniciar el botón bajo funcionalidad, cada falla de entrada tendrá el onchange y así sucesivamente. ¿ Se puede hacer un ion definido aquí? Exigiré fuera de la red esta declaración. Y cambio de entrada. Y esto será, será FEV. Y voy a capturar lambda e dot target. Y ese objetivo, necesito nombre y valor y voy a establecer el estado, el estado, el nombre. Y así en cada pulsación de tecla, necesito almacenar el valor en un estado que es muy único manejo de cambio de entrada. Y lo voy a aplicar si maneja el cambio de entrada en todas las entradas una por una. Por lo que sólo voy a proporcionar este cambio de punto y van a introducir cambio. Entonces supongo que mientras PDS ahora se basa aquí, voy a pegar aquí, y voy a pegar aquí. Por lo que hemos hecho con el y, y el nivel de forma. Necesitamos en algunos se maneja, voy a definir se maneja de alguna manera. Entonces definamos. Y creo que también me estamos teniendo y vamos a evitar el comportamiento por defecto de Roger am escribiendo toda ganancia, así que solo necesitamos escribir u dot prevenir default. Y aquí, para poder proceder en la cumbre del mango, tenemos que sumar el axial. Pero antes de escribir y yo acabo de definir por el estado aquí también. Entonces voy a tener empatía definitivamente tú entonces no puedes formar impiedad con ellos. Y j. Entonces para eso voy a tener uno es cola, cabeza. Y tú eres el estado y el equilibrio la invitación. Y en el mango presentar pasado, voy a comprobar. Entonces si alguna entrada en potato, no voy a permitir sólo enviar el formulario al servidor de inyección. Por lo que vamos a dar cada entrada estará en el siguiente correo electrónico 18 y el último contacto 20. Entonces voy a configurar el mensaje de error es y poner toda la mano de entrada. Y el chico LD, le vamos a escribir el código a alguien para formar el Watergate. 15. Trabajar en Añadir acción y reductor para añadir usuario a JSON sever: Entonces vamos a escribir el tipo de acento debe. Entonces solo hablaré en ella. Uno, agrego un usuario, agrego un usuario. Y en agregar un usuario, lo siento, en las Acciones. Tendré que simplemente copiar este. Pegar. Le dio el nombre pierna ADA ahí. Y aquí te haremos el filtro allá. Y cambiaré de solicitud. Dónde hacer el post. Y voy a quitar éste y voy a pasar. Y el segundo argumento, los conocía, y esto llevará al cambio. Entonces vamos a escribir aquí una acción. Entonces solo copiaré este. Y te voy a dar su agregado y se te va a sumar ahí. Actualicemos este. Te veré ahí. Y si no, no creo que necesitemos porque vamos a empujar hacia la página principal después de la presentación de la bomba. Entonces en la forma sumación también, por defecto, estamos cargando el tú ese detalle desde la celda de lectura para que podamos dejar ese tal como está. Es decir, puedes simplemente entrar diferente ahora e ir al reductor y agregar este caso para que solo pueda anexarlo, se definió aquí. Porque se va a quedar, agregarla y añadirla. 16. DesDesde una acción para añadir datos de datos de usuario: Guiando al usuario. Ahora, ve hacia cuanto más alto tengas componente. Y adentro ahí, en la parte L, necesitamos escribir el código. Por escrito. No trajimos los pares de base. Entonces llegamos a subir lo de la manzana. Jugar DOM reacciona. Hicimos una gran diferencia. Y sí empujamos hacia el despacho una variable. Entonces que sea rápido. Pero hasta que lo traigas. Y deja que las estadísticas aquí después del si no hay error en el otoño cuando todo el campo de entrada es proporcionado por la UE ahí. Entonces vamos a ser gordo pad. Entonces me estoy librando de la ética. Y supongo que entonces de la junta VF. Y voy a proporcionar este estado. Entonces en este estado, tenemos a toda la UE ahí. Otra vez. Voy a proporcionar este estado. Y después de eso, voy a empujar el punto extra, empujar hacia la página de inicio. Y también tenemos que dividir la empatía si hay error ocurrido. Y esta vez usted ahí ingresó todo el detalle en la voluntad de entrada, entonces tenemos que hacer el error. Entonces definamos el editor ha sido. Por lo que necesitamos definir el error aquí. Entonces voy a mostrar el método de área de la ADA usted ahí. Y aquí estoy tomando si David un error, entonces voy a exhibir el área que tiene tres tiempo y estilo. Y sólo estoy dando el color. Pasemos al otro. Estoy cargando éste y simplemente sin saberlo sin proporcionar ningún detalle todavía. Sólo sonaba. Entonces estamos recibiendo el adenoma y no hay más alto. Por ahora, brindemos aquí el detalle de entrada. Entonces empecemos los juegos. Entonces en el método encadenado no está funcionando. Entonces sigamos adelante y sigamos un poco que no he proporcionado aquí vamos chicos. Nos falta un atributo aquí. Necesitamos proporcionar un atributo de nombre también. Pero ese fracaso no conseguir nada aquí, a saber, contener correo electrónico, lo siento, tal vez voy a nombrar tu nombre será correo electrónico. Y aquí nombre será entonces número, no número, estoy en contacto. Y aquí nombre será la dirección. Entonces ahora vamos a darle un intento más en el navegador. Por lo que sólo voy a dar algunos detalles aún juegos, juegos, gmail.com sobre tipo número, dirección eso, dar planes. Y cansado de someterte a ti que incluso se te añada. Pero aún no hemos estado recibiendo datos. No mirarlo en el js dentro de nuestro admin. Entonces hay algún problema con él, si ya lo has leído, pero a VIV, No estamos recibiendo los datos actualizados. Lo que la UE luego redirige a la página principal. Entonces déjame arreglar ese tema. Entonces qué puedes hacer. Entonces agreguemos un dato más. Sólo estoy consiguiendo algo. De acuerdo, así que mente y gane algo al azar cosas. Y ahora que eso. Pero esta vez agregó. Por lo que podría haber algún tema. No estaba sumando. Entonces ahora estamos obteniendo los datos. Una vez que te financien el hall y luego aquí los datos y mejorando en. Entonces actualicemos uno, nuestros datos. Ahora estoy llegando aquí. Agregaremos un contacto en gmail.com. Y esta vez te voy a dar dio y pegarle a alguien. Se están trabajando. Ahora otra vez. No se está actualizando. Entonces una vez que refresco, entonces sólo estoy obteniendo sus datos. Entonces hagamos una cosa. Entonces, ¿en qué difieren los acentos y simplemente descomentar. Entonces vamos a añadir ahora al usuario. Entonces de nuevo, voy a dar adecuada área enorme, eso es cola de TFS y la cabeza, gmail.com. El número aleatorio dirección será el australiano si es bueno. Y pega Submit. Ahora es que KVA se está acercando correctamente y estamos, y obteniendo el valor actualizado debajo de ti, su navegación. Por lo que terminamos con el usuario. 17. Trabajar en la forma de editar: Entonces lo siguiente que vamos a trabajar en la funcionalidad, pero te das un poquito que llegó un mins y vamos a tener el mismo código. Tenemos que ajustar un poco de código, ¿de acuerdo? Entonces esta copia todo el núcleo y crea un archivo, sí. Y dar la revisión ellos. No el caso. Será nuevo para ti que disciplina de cadena alfa como actualizar y cambiar el nombre aquí lo haré. Y sin embargo está disponible para todos allá. Está bien. Y vamos a decir eso. En el app.js. Por apenas voluminoso. Será el it. Y yo soy como creo el DNI y una idea importante para usarla. Por lo que el código VS se importa automáticamente. Ahora ven a casa board, sí. Y en Idiota, tenemos que proporcionar el onclick. Onclick. ¿Qué va a pasar? Al igual que va a pool te va a plantear que hiciste cualquiera de los casos sin embargo, ¿viviste cuando compraste un boleto? Y aquí voy a proporcionar el DNI. De nuevo, necesito darte la cédula oscura. Entonces vamos a darle una oportunidad en su general eso. Y voy a dar click que lo hicieron. 18. Popular un valor existente en la forma editar con Action: Ahora necesitamos todo el valor aquí. Entonces cualquiera que sea el valor que tengamos en la tabla para ese usuario específico. Por lo que necesitamos todo el detalle en el campo de entrada hasta el momento que necesitamos morir a una acción nuevamente. Entonces escuchamos que vamos a escribir para conseguir el dedo solo tienes que ir, necesitamos la cosa, realmente usa eso aquí. Entonces te he dado bien ahí. O bien. Y ve a las acciones. Y sí, wow, punto. Pero el Dios, la conocida identificación femenina. Entonces estamos en voluntad tú, sólo son un poco buenos. Y ve al escritorio y crea un tiempo compartido. Tan bien. Úsalo y cambia el tipo de cosa. Bueno, tú ahí y yo usaré el remove este. No hacemos que te traiga el y aquí necesitamos pasar eso como bonos que ha pasado datos de punto. Entonces tenemos que pasar esto, el ataque a los datos y al DKA. Tenemos que escribir este caso híbrido para este tipo de punto valor allí. Y voy a regresar, y voy a dar lectura a la NTU estatal ahí que tenemos aquí. Por lo general, entonces i en una matriz vacía, y ahora será cabecera, carga útil. Y la carga serán los muros. Entonces ve a la DTU ahí. Entonces estamos terminados aquí. ¿ Y lo usaste? Necesitamos el DNI. Por lo que siempre que estés ahí y navegando, estamos consiguiendo lo ordenado el cómo vamos a conseguir un ordenado. Entonces nosotros, vamos a tener la idea. Crees que el US para 0, necesitamos patrón de uso del router reaccionar. Entonces necesitamos usar ese soy. E intención el componente. Aquí. Voy a de factor dy, dy. Entonces usa patrones. Bueno, vamos a salir después de la identificación. Pocas cosas solo necesitamos ajustarnos aquí, así que tenemos identificación y necesitamos traer el efecto estadounidense aquí. Tan pronto como tengamos ID en que te hagas, el componente necesitará despachar de acción en ID de usuario real. Entonces te escribiré el efecto aquí. Y lo siguiente, solo gana por mano de día. Voy a ir con este pastor, el despacho de facción, y te conseguiremos eso. Está bien. Por lo que dijeron la acción que hemos creado antes. Ahora enojarse. Te ves. Entonces vayamos a una DTU ahí y solo proporcionemos el DNI porque está aceptando el DNI en la parte posterior y te devolverá que utilizas una UE específica ahí. 2010 que Asia y la ADA ahora y acaba de entrar en el navegador y volver atrás y dar clic en el primero. Pero estamos despachando la acción, consiguiendo valor ahí. Y se puede ver en este estado usted que está indefinido. ¿ De acuerdo? Por lo que no estamos consiguiendo ahí a la UE. De acuerdo, si no, vamos, veamos la consola. Entonces en la consola tenemos DU ahí, pero de alguna manera tú que no es una espera en el reductor. Mítica, sin embargo, en la consola tenemos como en la línea 54, si vas al accidente. Por lo que a los 64 tenemos el control. Pero no va hacia lo hizo es irá a la Getty que ahí y se comprometió a utilizar el que tenemos que proporcionar este año. Se entiende que está bien, Señor. Y El usuario. Entonces ahora vamos, oh, veamos en el navegador. Por lo que ahora ve a los datos. Y ahora tenemos la u que aquí. Vuelve atrás y haz clic en el tercero. Ahora, mira, tenemos los datos de usuario respectivos o no, pero tenemos esos datos. Y ahora lo que vamos a hacer, vamos a estar pegando al director danés. Si utilizas una lambda es el estado 0. Vamos a quitarnos que tenemos un enorme seleccionado o no importado. Por lo que no hemos usado selectivo, por lo que necesitamos usar selector. Y, y usar selector. De lo que vamos a hacer, sólo vamos a dar tiempos si la UE, el colector estadounidense t8, t8 dot data. Ahora tenemos u que bien. Durante lo siguiente tenemos que básicamente ver el detalle aún, todo el detalle que tenemos que pre-llenar aquí cuando haces clic derecho sobre el de nuevo. Entonces parte de eso, tenemos que escribir uno más. Usa míticamente la estaca aquí. Perdón, usa aquí la FFT. Por lo que voy a proporcionar un año más en efecto. Y de hecho que lo revisaré vista diaria, eso significa que este enorme factor correrá un 30 día tú ahí. Y ahora estoy tomando si hay, entonces paso, nota que te lleve ahí. Entonces, pues vamos al navegador. Proporciona decir indefinido. De acuerdo, ahora se acerca. Vayamos al navegador. Y ahora aquí, respecto a los datos. Y todavía estamos recibiendo una advertencia. Jugado un componente está cambiando una entrada de control en TV y control donde el valor cambiante formativo Manto indefinido. lo que este editor suele causar porque aún no hemos proporcionado algún valor y la cadena definitivamente estamos definiendo lo indefinido en realidad en el modo de componente, el valor es indefinido de esa manera. No está recibiendo la advertencia en la consola. Entonces para evitar esa L, vamos a simplemente, usted acaba de pensar Abogado aquí. Por lo que es prestado pensamientos adecuadamente evaluación. Se puede dar esa y el editor seguirá. No es un irónico como la advertencia. Entonces vamos al navegador, recargar. Y no tenemos la advertencia ahora en la consola. 19. Dispatch una acción para actualizar el detalle de el usuario: Vayamos a la DTU, su componente. Y en manejo presentar, tenemos que disipar la actualización a ti ahí, No para agregar tampoco. Es tan mortífero ahí y asegúrate de que se importara. Entonces sí. Está bien. El importante para mover el ADA te que no necesitamos en este componente. Y así vamos a ver si los partidos están creando no lo son. Lo dejaré fuera. Y voy a dar gemas y voluntario y dejar alguna cita. Por lo que no es actualizar la solicitud de emisión energética llena con el estado para indefinido no encontrado. Entonces vamos a la acción. Por lo que los definitivamente tienen problema en la cadena. Por lo que usuario de datos. Ahora, veamos la consola de consola. El dato no está actualizado también. Yo puedo sí. El consola también un dato no en Decker. ¿ Cuáles son tres cuál puede ser el tema? Es la UE, están actualizadas. Y ve al reductor. Todo se ve bien. Acude a la vista de edición ahí y NAD a ti ahí. Entonces el tema es como si no estuviéramos proporcionando el DNI aquí. Tenemos que proporcionar el DNI porque Nuestra am enviar, recibir el momento tuatara. Te ahí detalle y DNI. Entonces entrémonos al navegador y le demos uno más. Intenta. Otra vez. Este, les di algo de vínculo. A ver. Ahora, ellos te ese detalle se está actualizando. Por lo que tenemos un formulario toda la operación de lectura aquí en React aplicación como crear, leer, actualizar, y eliminar. Y voy a volver a realizar toda operación para que no tengamos ningún tema. Entonces permítanme empezar con la letra E Así podremos leer todos los datos de nuestro escondite GFF. Ahora, vamos a eliminarlo. Ha sido LaCa. Por lo que los datos se están poniendo delicados en fielmente. Añadamos ahí la UE. Entonces de nuevo, voy a agregar el usuario es cola. Y les daré un correo electrónico, um, contacto aleatorio. Y eso quedará claro. Estos archivos doc crear operación. Por lo que somos capaces de agregar al usuario al servidor JSON también. Vamos y de hecho los adverbios de detalle, así Adam, Marcus, y agregamos el contacto ya sea en ese mango de rejilla. Entonces te di a ti y a Adán 1, 2, 3, 0. Como puedes ver que somos capaces de actualizar el tú que dices ya sea 0. Tenemos una forma. Todo el tercer operativo con ayuda de React, hacer deck gracias y defensa. 20. Conclusión: Si estás viendo este video, eso significa que has completado este curso. Y estoy seguro de que has ganado mucho conocimiento en un redex. Ahora, podrás trabajar con el redox en cualquier aplicación React. Y además, tienes un poco sobre esas personas que sólo tienen conocimientos sobre React. Entonces gracias chicos por tomar este curso, y los veo en otra sección del curso.