Componente Timeline

En el curso de Frontend Developer nos enseñaron que no deberíamos colocar texto entre etiquetas <div></div> aunque es verdad que se puede, @tiffcode dice que por temas de semánticas siempre deberíamos utilizar las etiquetas para tal fin, como <p>,<span> y todas las <h>

para las personas que no les carga las imágenes les pido a ustedes que instalen desde la terminal lo siguiente file-loader así

$ npm install --save-dev file-loader

después de que se haya instalado file-loader se dirigen a webpack.config.js y en donde dice rules copian y pegan este siguiente código de webpack que les dejaré para que les funcione.

{
  test: /\.(png|gif|jpg|jpeg)$/,
  use: [
    {
      loader: 'file-loader',
      options: { 
          name: 'assets/[hash].[ext]' 
        },
    }
  ],
},

y listo para usarlo crean una carpeta que se llame assets espero no se les olvide, por que es ahí donde vamos alojar nuestros archivos multimedia y luego hacemos un import de las imágenes que queremos traer por ejemplo:

import LaImagen from './assets/elmo.jpg'

// y en las etiquetas img en donde dice src escriben lo siguiente: 

<img src={LaImagen} alt='esto es una imagen' />

y listo eso era todo espero les sirva a cada uno de ustedes 😃

Gracias Oscar por darte el tiempo de mostrar la maquetación HTML, para mí es una de las partes más importantes para que el desarrollo del proyecto sea optimo.

¿Qué requisitos debe tener un componente para utilizar <slot/>? Porque Sidebar no lo utiliza pero también se convierte en un componente padre de Profile, Stories y Footer.

Si quieres usar tus propias imágenes, lo recomendable es subir el repositorio a Github y usar Github-pages, o también Netlify

Consulta: Sería mejor crear un componente específico para la información del perfil? Veo que se repite en varias partes del front. Gracias.

👌