S SmartDocs
Chuỗi bài: vibe coding javascript 44 dòng · Cập nhật 2026-04-26

Footer.jsx

vibe_coding/src/components/Footer.jsx

import { Link } from 'react-router-dom';
import { useTranslation } from 'react-i18next';

export default function Footer() {
  const { t } = useTranslation();
  const year = new Date().getFullYear();

  return (
    <footer className="footer">
      <div className="footer__inner">
        <div className="footer__brand">
          <h3>{t('brand.name')}</h3>
          <p>{t('brand.tagline')}</p>
        </div>

        <div>
          <h4>{t('nav.projects')}</h4>
          <Link to="/proyectos">{t('home.viewAll')}</Link>
          <Link to="/sobre-mi">{t('nav.about')}</Link>
          <Link to="/cv">{t('nav.cv')}</Link>
          <Link to="/contacto">{t('nav.contact')}</Link>
        </div>

        <div>
          <h4>{t('contact.infoTitle')}</h4>
          <a href="mailto:hola@chijia.design">hola@chijia.design</a>
          <a
            href="https://www.linkedin.com/"
            target="_blank"
            rel="noopener noreferrer"
          >
            LinkedIn
          </a>
          <a>{t('contact.city')}</a>
        </div>
      </div>

      <div className="footer__bottom">
        <span>© {year} Chijia · {t('footer.rights')}</span>
        <span>{t('footer.madeIn')}</span>
      </div>
    </footer>
  );
}

Bài viết liên quan