Resumen del curso

Clase 24 de 24 • Curso Fundamental de Material UI con React

Clase anteriorSiguiente clase

Jhon Eduard Bocanegra Ortiz

student•

Este fue mi solución:

Gilbert Ardila

student•

Como usaste los brakepoints con mui?

Rodrigo Andrés Moreno Pertúz

student•

@Platzi Corregir por favor corregir pregunta:

¿Cuál es la sintaxis que sebe usarse para usar la prop sx?

La informacion viaja dentro de un objeto en forma de { key = value }

por ende el valué en este caso debe ser enviado en formato String, Mas concretamente: { key = "value" }

Jeniffer Cruz

student•

Gracias por tu reporte, Rodrigo. Lo estamos revisando.

Rodrigo Andrés Moreno Pertúz

student•

jejejeje te equivocas amiguito.... @ christophermenendezmorales

Juan Esteban Orozco Botero

student•

Yo no he leído comentarios de alguien con este problema, y es que cuando se busca un perfil que no existe no ejecuta nada. La solución es simple, simplemente ejecutar en el if de la función gettingGirHub la función gettingGitHub de octopus.

 if(userResponse.message === 'Not Found'){
      console.log('Not Found')
      const{ octocat } = localStorage;
      setInputUser(octocat);
      gettingUser('octocat');
    } else{
      setUserState(userResponse)
    }
  };```

No sé si de pronto me salté algo de la lógica porque nunca usé el state de [ notFound, setNotFound] = useState('false')

Santiago Rodriguez Palacio

student•

Tienes razón, a mi tampoco me funciona, pensé que era algo que había hecho mal, sin embargo la forma en la que lo haces es válido, ya que en la clase se almacena en el localStorage los valores de octocat, pero no se consultan cuando se escribe un perfil no valido. No estoy seguro a que se deba esto, pero pienso que es por que se guarda [objec objetc] en el localstorage.

Guillermo Nicolas Piedrabuena Parrochía

student•

Por favor lean mi blog sobre creación de themes en MUI: https://platzi.com/tutoriales/3078-material-ui/17966-crear-themes-con-mui/

Andy Gianpiero Ñaca Rodriguez

student•

Les dejo mi proyecto para que lo tomen como referencia, utilice la gran mayoria de componente de MUI, es responsive, con Typescript y Redux. https://zzzandyzzz.github.io/github-finder/ https://github.com/ZzzandyzzZ/github-finder Espero les guste y espero sus comentarios !

Sergio Martinez Marin

student•

**Mi solución ** https://github.com/sergiotechx/Platzi_githubprofilles

Usando:

Vite
Typescript
useContext + useState: para evitar esos molestos manejos de props a los componentes

Si no encuentra un usuario despliega el perfil de Dino Doe XD !dino doe

Rodrigo Andrés Moreno Pertúz

student•

@P¨latzi por favor corregir las respuesta a esta pregunta.

¿Cuál es la sintaxis que sebe usarse para usar la prop sx?```
La informacion viaja dentro de un objeto en forma de 
{ key = value }

por ende el valué en este caso debe ser enviado en formato String, Mas concretamente:

{ key = "value" }

Daniel Rodrigo Valdivieso Merino

teacher•

Gracias Rodrigo por tu observación en minutos ya estará corregido ❤️

#NeverStopLearning

César Augusto Cortés Labrada

student•

Comparto mi proyecto final con los retos. Estuvo bien el curso; me hubiera gustado explorar más la parte de la personalización, como los Theme, clases, Component.root entre otras cosas difíciles de entender de esa documentación de MUI... XD. Ojala en el siguiente curso se explore todo eso al crear componentes. Repo https://github.com/KortexCode/Github-UsersApp Deploy https://kortexcode.github.io/Github-UsersApp/

Img App:

Geovanny Sneyder Paez Pabon

student•

gente, aquí está el repositorio usando typescript con Vite Js Repositorio

Ivan Camilo Buitrago Buitrago

student•

El resltado de mi proyecto con el modo responsivo y con la validacion de si no existe un usuario, muestra un mensaje de no encontrado (

)

Resumen del curso

Introducción al curso

Bienvenida al curso

Presentación proyecto

¿Qué es Material UI?

Preparación de entorno de desarrollo

Herramientas dentro de Material UI

Componentes simples

Componentes compuestos

Contenedores responsive

Material icons

Bonus

Construcción del proyecto

Análisis detallado del proyecto

Creando el contenedor y el text field

Colocando los estilos del buscador

Construyendo la lógica del buscador

Conectando nuestro proyecto a la API de GitHub

Conectando el buscador con la API

Creando el contenedor y trayendo la imagen de perfil del usuario

Trayendo la información principal del usuario

Trayendo la descripción del usuario

Creando el componente con las estadísticas del usuario

Mostrando la localización del usuario

Ajuste de estilos con SX a los componentes de descripción e información principal

Ajuste de estilos con SX al componente de descripción, PaperInformation y LocationInformation

Evaluación del proyecto

Despedida

Resumen del curso