Platzi
Platzi

¡Invierte en ti y celebremos! Adquiere un plan Expert o Expert+ a precio especial.

Antes:$349
$259
Currency
Antes:$349
Ahorras:$90
COMIENZA AHORA
Curso de React.js

Clases del Curso de React.js

Instruido por:
Richard Kaufman
Richard Kaufman
Básico
5 horas de contenido
Ver la ruta de aprendizaje
Platzi Badges
Proyecto del curso
Platzi Badges

Crearás una plataforma para llevar registro de los asistentes a la Platzi Conf, haciendo posible que cada usuario registrado pueda ingresar su información personal. Cada uno de ellos tendrá un rol diferente y esto se verá reflejado en su badge. Por último, crearás una página que permitirá listar a todos los participantes y filtrarlos por tipo de rol, o hacer búsqueda por nombre.

Curso de React.js

Curso de React.js

Progreso del curso:0/37contenidos(0%)

Contenido del Curso
Tutoriales de estudiantes
Preguntas de estudiantes

Progreso del curso:0/37contenidos(0%)

Introducción a React.js

Material Thumbnail

¿Qué es React.js?

06:25 min

Material Thumbnail

Pre-requisitos

02:43 min

Material Thumbnail

Herramientas que usaremos

04:07 min

Material Thumbnail

Create-react-app

05:39 min

Fundamentos

Material Thumbnail

Clonar el código de GitHub

02:12 min

Material Thumbnail

ReactDOM.render

06:00 min

Material Thumbnail

JSX

10:08 min

Creación y diseño de componentes

Material Thumbnail

¿Qué es un componente?

05:16 min

Material Thumbnail

Qué es y cómo funciona un componente en React.js

Material Thumbnail

Nuestro primer componente

09:42 min

Material Thumbnail

Cómo aplicar estilos

08:55 min

Material Thumbnail

Nuestra primera página

10:25 min

Material Thumbnail

Enlazando eventos

09:02 min

Material Thumbnail

Levantamiento del estado

11:26 min

Material Thumbnail

Listas de componentes

11:03 min

React Router

Material Thumbnail

Introducción a React Router

07:17 min

Material Thumbnail

División de la aplicación en rutas

09:18 min

Material Thumbnail

Mejorando la User Interface con un Layout

10:57 min

Component Lifecycle

Material Thumbnail

Introducción del ciclo de vida de un componente

06:21 min

Material Thumbnail

Práctica del ciclo de vida

09:36 min

Llamadas a un API

Material Thumbnail

Introducción llamadas a un API

03:30 min

Material Thumbnail

React.js: Cómo traer datos de un API en React

12:40 min

Material Thumbnail

Solicitando datos (GET)

12:12 min

Material Thumbnail

Mejorando la Experiencia de Usuario durante una petición

07:19 min

Material Thumbnail

Enviando datos (POST)

12:03 min

Material Thumbnail

Manejando los estados de la petición durante el POST

07:12 min

Material Thumbnail

Actualizando datos (PUT)

10:35 min

Material Thumbnail

Actualizaciones automáticas

07:27 min

Mejorando la UI

Material Thumbnail

Los detalles de un Badge

12:54 min

Material Thumbnail

UI Components y Container Components

06:01 min

Conclusion

nuevosmás votadossin responder
Alejandro Alberto Pachas Chavez
Alejandro Alberto Pachas Chavez
Estudiante

no que cada componente tenía su propio state? En esa parte me perdí un poco

1
cindy yurley caceres parada
cindy yurley caceres parada
Estudiante

este Layout seria el componente de HOC?

1
Nahuel Zamuner
Nahuel Zamuner
Estudiante

¿Alguien lo uso o sabe si se puede usar con Materialize?

2
Joan M. Romero
Joan M. Romero
Estudiante

Hola! no puedo importar los archivos a mi badge.js. Hago todo tal cual lo hace el profesor, me autompleta la ruta ‘…/images’ pero no me reconoce el archivos badge-header.svg.
Lo mismo me pasa cuando importo el css. Me reconoce y autocompleta la ruta del directorio ‘./style’, pero no reconoce el archivo que esta adentro que es Badge.css. Ayuda por favor!

1
David Valencia
David Valencia
Estudiante

¡Necesito ayuda!
Llevo un buen de tiempo intentando traer los datos de las estadísticas de cada Pokémon y hasta ahora solo he podido traer el nombre base. 😖
Repositorio

1
David Valencia
David Valencia
Estudiante

¿Algún curso para complementar este y por ejemplo poder crear una libreta de tareas?

1
Facundo Victor Scienza
Facundo Victor Scienza
Estudiante

No se me actualiza los FormValues en Badge edit, en consola me figura el siguiente error:
` GET http 😕/ localhost: 3001 /badges/undefined 404 (Not Found)

componentDidMount(){
        this.fetchData()
    }
    fetchData = async e => {
        this.setState({ loading: true, error: null})
        try{
            constdata= await api.badges.read(this.props.match.params.badgeId);   
            this.setState({loading: false, form: data});
            console.log('entró a try ' )
        
        }   catch (error){
            this.setState({loading: false, error: error});
            console.log('entró en catch error')
        }
    }

Mi código es ese. Todas mis suposiciones me llevan a que el servidor no me esta devolviendo los datos que le pido. Alguien me ayuda a resolver eso? Gracias!!

1
Jorge Fidel Zubieta Choque
Jorge Fidel Zubieta Choque
Estudiante

En mi inspector no tengo la opcion React! como puedo obtener eta ocpion?

2
Juan Felipe Duarte Montañez
Juan Felipe Duarte Montañez
Estudiante

Hola, he estado intentando hacer un deploy en github pages y siempre sale que esta bien hasta que llamo la lista de badges que llama a la “api” y sale “Failed to fetch” que asumo que es por el host local que se hace en el puerto 3001. Alguien sabe como puedo hacer el deploy?

1
Ignacio Emiliano Juarez
Ignacio Emiliano Juarez
Estudiante

Hola. Alguien sabe cómo es el atajo que usa el profe en el minuto 3:52?
Gracias

1