Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

[Sugestão] Sugestão para agilizar o preenchimento do formulário

Salve, implementei uma variável para facilitar na hora de preencher o input da imagem no formulário, trocando digitar https://github.com/username por simplesmente o username e também tornando o card um direcionador para o GitHub provido, o código foi o seguinte:

const Colaborator = ({ name, image, role, backgroundColor }) => {
    let userGitHub = "https://github.com/" + image //link do github com image sendo o nome do usuário, podem trocar depois 
    return (
        <a className='card' href={userGitHub} target="_blank" rel="noopener noreferrer"> // link para a página do GitHub do usuário
            <div className='colaborator'>
                <div className='header' style={{ backgroundColor: backgroundColor }}>

                    <img src={userGitHub + ".png"} alt='props.name' /> // link do GitHub + png para importarmos a imagem para o código
                </div>
                <div className='footer'>
                    <h4>{name}</h4>
                    <h5>{role}</h5>
                </div>
            </div>
        </a>
    )
}

export default Colaborator
1 resposta
solução!

Oi Ryan, tudo bem?

Obrigada por compartilhar sua sugestão! Realmente, essa é uma ótima maneira de agilizar o preenchimento do formulário e tornar o card um direcionador para o GitHub. É importante lembrar que, ao utilizar a variável "userGitHub", você está tornando o código mais legível e fácil de entender, o que é muito importante em projetos maiores e mais complexos. Além disso, a utilização do target="_blank" e rel="noopener noreferrer" é uma boa prática para garantir a segurança do usuário.

Um abraço e bons estudos.