A si mi me gusta el animo del profe… me hace prestar mas atención
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
No tienes acceso a esta clase
¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera
Aportes 10
Preguntas 2
A si mi me gusta el animo del profe… me hace prestar mas atención
Fuera bueno que no gritara tanto. Que pena pero me aturde en momentos.
Me parece que es un poco confuso el código escrito por el profesor, acá les dejo mi código que a mi parecer es mas legible y mas corto, ya que no hago uso de tantos UseState y funciona igual.
Puede que este curso no este perfilado para mi, pero soy programador intermendio y en mi trabajo usan MUI, por eso busque el curso. La verdad necesitaba me explicaran bien el default theme y la prop variant, pero en este curso meten otras cosas más de logica y api, para que pongan en el curso que es para gente más iniciada. Creo que hace 4 años atras me habría fascinado.
yo lo hice de la siguiente forma:
const [userState, setUserState] = useState(inputUser)
if (userState === 'octocat'){
localStorage.setItem('octocat',JSON.stringify(userResponse)) // JSON.stringify()
}
if (userResponse.message === 'Not Found'){
const { octocat } = localStorage
setInputUser(octocat)
setUserState(JSON.parse(octocat)) // JSON.parse()
setNotFound(true)
}
if (userResponse.message === 'Not Found'){
const { octocat } = localStorage
setInputUser(octocat)
setUserState(JSON.parse(octocat)) // ***
setNotFound(true)
} else {
setUserState(userResponse)
setNotFound(false) // **
}
el código completo quedaría así:
import React, { useState, useEffect } from "react";
import { Container } from "@mui/material";
import Searcher from "./components/Searcher";
import { getGitHubUser } from "./services/users";
const App = ()=> {
const [inputUser, setInputUser] = useState('octocat');
const [userState, setUserState] = useState(inputUser)
const [notFound, setNotFound] = useState(false)
const gettinUser = async (user)=> {
const userResponse = await getGitHubUser(user)
if (userState === 'octocat'){
localStorage.setItem('octocat',JSON.stringify(userResponse))
}
if (userResponse.message === 'Not Found'){
const { octocat } = localStorage
setInputUser(octocat)
setUserState(JSON.parse(octocat))
setNotFound(true)
} else {
setUserState(userResponse)
setNotFound(false)
}
}
console.log(userState)
useEffect(()=> {
gettinUser(inputUser)
}, [inputUser])
const containerStyles = {
background: 'whitesmoke',
width: '80vw',
height: '500px',
borderRadius: '16px',
marginTop: '20px',
display: 'flex',
flexDirection: 'column',
alignItems: 'center'
}
return (
<Container sx={containerStyles}>
<Searcher inputUser={inputUser} setInputUser={setInputUser} />
</Container>
);
}
export default App;
Sabes enseñar, no necesitas tanta energia, entiendo que aveces nos podemos entusiasmar pero debemos aprender a controlarnos, pero no te desanimes más bien vealo como una forma de mejorar, eres un buen guia. Espero ver otros cursos con usted pero por favor controlando un poco el entusiasmo. “Nunca pares de enseñar”
Está mal editado el audio del video, me sorprende que no revisen la calidad de su contenido mas a menudo. TEAM PLATZI.
También creo que es excesivo el código del profesor, comparto una modificación con un mensaje 404 personalizado (Yo realice el ejercicio con la API de Pokemon).
hasta aca bastante flojo el profesor, grita mas de lo que explica totalmente incensario ,
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?