Solução para a lista de redes sociais

Utilizei um array de objetos para tentar diminuir o código JSX repetido.

const Rodape = () => 
{
    const redesSociais = [
        {
            nome: "Facebook",
            src: "/imagens/fb.png",
            href: "https://facebook.com"
        },
        {
            nome: "Twitter",
            src: "/imagens/tw.png",
            href: "https://twitter.com"
        },
        {
            nome: "Instagram",
            src: "/imagens/ig.png",
            href: "https://instagram.com"
        }
    ];

    return (
        <footer className='redesSociais'>
            <section>
                <ul className='listaDeRedes'>
                    {redesSociais.map((rede) => {
                    return (
                        <li key={rede.nome}>
                            <a href={rede.href} target='_blank'>
                                <img src={rede.src} alt={rede.nome}></img>
                            </a>
                        </li>
                    )
                })}
                </ul>
            </section>

O restante do footer é praticamente igual.