Esta é minha alternativa para composição do componente Rodapé.

import './Footer.css'

const Footer = () => {
    return (
        <footer className='footer'>
            <section>
                <div>
                    <a  href='http://facebook.com' ><img src='/images/fb.png' alt='Facebook logo' /></a>
                    <a href='http://twitter.com'>< img src='/images/tw.png' alt='Twitter logo' /></a>
                    <a href='http://instagram.com/'><img src='/images/ig.png' alt='Instagram logo' /></a>
                </div>
                <img src='/images/logo.png' alt='Logo organo' />
                <h3>Desenvolvido por Alura</h3>
            </section>
        </footer>

    )
}
export default Footer

.footer {
    background-color: #6278F7;
    background-image: url("/public/images/fundo.png");
    background-position: center;
    background-size: cover;
    max-width: 100%;
}

.footer section{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 50px;  
}

.footer  img {
    margin-right: 20px;
    cursor: pointer;
}

.footer h3{
    font-size: 20px;
    font-weight: bold;
    color: #fff;
}