Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/Emmanuel-Mtz-777/My-Personal-Portfolio/llms.txt

Use this file to discover all available pages before exploring further.

The Education section documents Emmanuel’s academic background and professional certifications side by side. The degree entry anchors the section at the top, followed by a 2-column grid of Cisco certificate cards — each showing the certificate image, title, issue date, and issuing organisation. All content is sourced from src/langs/en.json, keeping the section fully bilingual without duplicating markup.

​
Degree

Bachelor’s Degree in Information and Communications Technology Engineering Technological Institute of Aguascalientes · 2021 – 2026 This four-year undergraduate programme covers networks, software engineering, databases, embedded systems, and digital communications. The IoT Prototype Developer role (see Work Experience) was carried out as part of a research project affiliated with this institution.

​
Cisco Certifications

  1. Network Security — May 26, 2025 · Cisco
  2. CCNA: Enterprise Networking, Security, and Automation — Dec 13, 2024 · Cisco
  3. Linux Unhatched — Dec 02, 2024 · Cisco
  4. CCNA: Switching, Routing, and Wireless Essentials — Dec 07, 2023 · Cisco
  5. Introduction to Data Science — Oct 29, 2023 · Cisco
  6. CCNA: Introduction to Networks — May 30, 2023 · Cisco
The certifications trace a clear progression: from foundational networking (CCNA: Introduction to Networks) through switching and routing, into enterprise-level security and automation, and out to adjacent disciplines like Linux administration and data science.

​
Data source

Both the degree and the certifications are defined in src/langs/en.json: 
// src/langs/en.json — education & certifications keys
{
  "education": {
    "name":         "Bachelor's Degree in Information and Communications Technology Engineering",
    "organization": "Technological Institute of Aguascalientes",
    "date":         "2021 - 2026"
  },
  "certifications": {
    "title": "Education & Certifications",
    "items": [
      { "date": "May 26, 2025",  "name": "Network Security",                                        "issuer": "Cisco" },
      { "date": "Dec 13, 2024",  "name": "CCNA: Enterprise Networking, Security, and Automation",   "issuer": "Cisco" },
      { "date": "Dec 02, 2024",  "name": "Linux Unhatched",                                          "issuer": "Cisco" },
      { "date": "Dec 07, 2023",  "name": "CCNA: Switching, Routing, and Wireless Essentials",       "issuer": "Cisco" },
      { "date": "Oct 29, 2023",  "name": "Introduction to Data Science",                            "issuer": "Cisco" },
      { "date": "May 30, 2023",  "name": "CCNA: Introduction to Networks",                          "issuer": "Cisco" }
    ]
  }
}

​
Component files

  • Section: src/components/sections/Education.astro
  • Degree card: src/components/ui/cards/EducationCard.astro
  • Certificate grid: src/components/ui/cards/CertificateCard.astro

​
Education.astro

The section mounts an <EducationCard> and a <CertificateCard> stacked inside a flex-col container: 
<!-- src/components/sections/Education.astro (template) -->
<EducationCard education={t.education} />
<CertificateCard certifications={t.certifications} />

​
EducationCard.astro

Receives the education object and renders the degree name as a cyan h3, the institution as a muted paragraph, and the date range as a light-weight line below.

​
CertificateCard.astro

Receives the full certifications object and builds the display list by merging the JSON items with the matching .webp images via array index: 
// src/components/ui/cards/CertificateCard.astro (frontmatter)
const images = [
  NetworkSecurity,   // NetworkSecurity.webp
  Networking,        // Networking.webp  (CCNA Enterprise)
  Linux,             // Linux.webp
  Switching,         // Switching.webp
  DataCience,        // DataCience.webp
  IntroductionNetworks, // IntroductionNetworks.webp
];

const certificates = (certifications.items || []).map((cert, index) => ({
  id:     index,
  name:   cert.name,
  date:   cert.date,
  issuer: cert.issuer,
  image:  images[index] || null,
}));
Each certificate renders as a dark card (bg-[#0a0a0a]) with a left accent border, the certificate image at the top (Astro <Image> for automatic optimisation), and the title, issue date, and issuer below.

​
Certificate images

All certificate images are stored as .webp files in src/assets/certificates/: 
src/assets/certificates/
  NetworkSecurity.webp
  Networking.webp
  Linux.webp
  Switching.webp
  DataCience.webp
  IntroductionNetworks.webp
To add a new certification, append an object to certifications.items in both en.json and es.json, place the certificate image in src/assets/certificates/, and import it in CertificateCard.astro, adding it to the images array at the matching index position.

Build docs developers (and LLMs) love

Get started for freeTalk to us