Como colocar imagens, sem ser pelos link?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Como colocar imagens, sem ser pelos link?
Oi, Raphael, tudo bem?
Uma maneira de fazer isso é importar a imagem diretamente no seu componente. Primeiro, você deve adicionar a imagem na pasta do seu projeto. Por exemplo, você pode criar uma pasta chamada "imagens" na raiz do seu projeto e adicionar a imagem lá.
Depois, você pode importar a imagem no seu componente. Aqui está um exemplo de como você pode fazer isso:
import React from 'react';
import './Colaborador.css`
import imagemDoColaborador from './imagens/nomeDaImagem.jpg'; // substitua 'nomeDaImagem.jpg' pelo nome da sua imagem
const Colaborador = () => {
return (
<div className='colaborador'>
<div className='cabecalho'>
<img src={imagemDoColaborador} alt=''/>
</div>
<div className='rodape'>
<h4>Vinicios Neves</h4>
<h5>Instrutor</h5>
</div>
</div>
)
}
export default Colaborador;
Neste exemplo, a imagem é importada como um módulo e o caminho da imagem é atribuído à variável imagemDoColaborador. Em seguida, essa variável é usada como valor para a propriedade src da tag img.
Espero ter ajudado. Caso tenha dúvidas, conte com o fórum. Abraços!