{% extends "layouts/base.html" %} {% block title %} CodNesta Opportunities {%
endblock %} {% block meta_description %} Explore CodNesta opportunities for
students, developers, professionals and partners, including Pre-Dev, Intern in
Advance, student programs, certified developer training and professional growth.
{% endblock %} {% block extra_css %}

<link
  rel="icon"
  type="image/png"
  href="{{ url_for('static', filename='images/favicon1.png') }}"
/>

<link
  rel="stylesheet"
  href="{{ url_for('static', filename='css/pages/opportunities.css') }}"
/>

<link
  rel="stylesheet"
  href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css"
/>

{% endblock %} {% block content %}

<main class="opportunity-page">
  <!-- =====================================================
         SHARED PAGE HERO
         Styled entirely by hero.css
    ====================================================== -->
  <section class="page-hero page-hero--opportunities">
    <div class="container page-hero__container">
      <div class="page-hero__content reveal reveal--up">
        <span class="section-label"> Opportunities at CodNesta </span>

        <h1 class="page-hero__title">
          Prepare, Participate and
          <span>Grow With CodNesta.</span>
        </h1>

        <p class="page-hero__description">
          Explore structured pathways for learning, practical experience,
          community access, professional development and collaboration across
          the CodNesta ecosystem.
        </p>

        <div class="page-hero__actions">
          <a href="#predev" class="button button--primary">
            Explore Opportunities
          </a>

          <a
            href="{{ url_for('predev.index') }}#predev-application"
            class="button button--secondary"
            target="_self"
            rel="noopener noreferrer"
          >
            Apply for Pre-Dev
          </a>
        </div>
      </div>

      <div class="page-hero__background-word" aria-hidden="true">
        Opportunities
      </div>
    </div>
  </section>

  <!-- =====================================================
         PRE-DEV
    ====================================================== -->
  <section class="opportunity-section opportunity-section--soft" id="predev">
    <div class="container">
      <div class="opportunity-split">
        <div class="opportunity-content reveal reveal--right">
          <span class="opportunity-eyebrow"> Apply for Pre-Dev </span>

          <h2 class="opportunity-title">
            Begin with the right
            <span>foundation.</span>
          </h2>

          <p class="opportunity-description">
            Pre-Dev is CodNesta’s preparation pathway for people who want to
            enter the technology ecosystem with stronger practical, professional
            and collaborative foundations.
          </p>

          <p class="opportunity-description">
            Participants develop discipline, communication, problem-solving,
            teamwork and essential technical readiness before progressing into
            advanced learning, community and project opportunities.
          </p>

          <ul class="opportunity-list">
            <li>
              <span class="opportunity-list__icon">
                <i class="fa-solid fa-check"></i>
              </span>

              Build practical and professional readiness.
            </li>

            <li>
              <span class="opportunity-list__icon">
                <i class="fa-solid fa-check"></i>
              </span>

              Access the CodNesta learning community.
            </li>

            <li>
              <span class="opportunity-list__icon">
                <i class="fa-solid fa-check"></i>
              </span>

              Prepare for selected CodNesta opportunities.
            </li>
          </ul>

          <div class="opportunity-actions">
            <a
              href="{{ url_for('predev.index') }}#predev-application"
              class="button button--primary"
              target="_self"
              rel="noopener noreferrer"
            >
              Apply for Pre-Dev
            </a>
          </div>
        </div>

        <div class="opportunity-image image-reveal reveal-delay-1">
          <img
            src="{{ url_for('static', filename='images/opportunities/predev.jpg') }}"
            alt="Learners preparing through the CodNesta Pre-Dev pathway"
          />
        </div>
      </div>
    </div>
  </section>

  <!-- =====================================================
         INTERN IN ADVANCE
    ====================================================== -->
  <section class="opportunity-section" id="intern-in-advance">
    <div class="container">
      <div class="opportunity-split">
        <div class="opportunity-image image-reveal reveal-delay-1">
          <img
            src="{{ url_for('static', filename='images/opportunities/intern-in-advance.jpg') }}"
            alt="Students developing practical skills before their official internship"
          />
        </div>

        <div class="opportunity-content reveal reveal--left">
          <span class="opportunity-eyebrow"> Intern in Advance </span>

          <h2 class="opportunity-title">
            Prepare before the internship
            <span>pressure begins.</span>
          </h2>

          <p class="opportunity-description">
            Intern in Advance allows students to begin practical skill
            development before their official academic internship period.
          </p>

          <p class="opportunity-description">
            It helps students avoid last-minute placement pressure, identify a
            relevant development area and use their internship period for
            genuine learning instead of only completing an academic requirement.
          </p>

          <ul class="opportunity-list">
            <li>
              <span class="opportunity-list__icon">
                <i class="fa-solid fa-check"></i>
              </span>

              Begin practical preparation early.
            </li>

            <li>
              <span class="opportunity-list__icon">
                <i class="fa-solid fa-check"></i>
              </span>

              Develop skills aligned with career interests.
            </li>

            <li>
              <span class="opportunity-list__icon">
                <i class="fa-solid fa-check"></i>
              </span>

              Reduce placement congestion and uncertainty.
            </li>
          </ul>

          <div class="opportunity-actions">
            <a
              href="{{ url_for('predev.index') }}#predev-application"
              class="button button--primary"
              target="_self"
              rel="noopener noreferrer"
            >
              Start Through Pre-Dev
            </a>
          </div>
        </div>
      </div>
    </div>
  </section>

  <!-- =====================================================
         STUDENT PROGRAMS
    ====================================================== -->
  <section
    class="opportunity-section opportunity-section--soft"
    id="student-programs"
  >
    <div class="container">
      <header class="opportunity-heading reveal reveal--up">
        <span class="opportunity-eyebrow"> Student Programs </span>

        <h2 class="opportunity-title">
          Practical opportunities for
          <span>student development.</span>
        </h2>

        <p class="opportunity-description">
          CodNesta student programs help learners move beyond theory through
          practical training, mentorship, workshops, projects and structured
          development activities.
        </p>
      </header>

      <div class="opportunity-grid opportunity-grid--four">
        <article class="opportunity-card reveal reveal-delay-1">
          <div class="opportunity-card__icon">
            <i class="fa-solid fa-briefcase"></i>
          </div>

          <h3 class="opportunity-card__title">Internship Preparation</h3>

          <p class="opportunity-card__description">
            Practical guidance for students who want to approach internships
            with clearer goals and stronger readiness.
          </p>
        </article>

        <article class="opportunity-card reveal reveal-delay-2">
          <div class="opportunity-card__icon">
            <i class="fa-solid fa-diagram-project"></i>
          </div>

          <h3 class="opportunity-card__title">Project Experience</h3>

          <p class="opportunity-card__description">
            Participate in assignments, group projects and selected practical
            technology solutions.
          </p>
        </article>

        <article class="opportunity-card reveal reveal--up">
          <div class="opportunity-card__icon">
            <i class="fa-solid fa-person-chalkboard"></i>
          </div>

          <h3 class="opportunity-card__title">Mentorship</h3>

          <p class="opportunity-card__description">
            Receive direction, accountability and feedback from people with
            relevant professional experience.
          </p>
        </article>

        <article class="opportunity-card reveal reveal-delay-4">
          <div class="opportunity-card__icon">
            <i class="fa-solid fa-users"></i>
          </div>

          <h3 class="opportunity-card__title">Community Learning</h3>

          <p class="opportunity-card__description">
            Learn with other students through discussions, peer support and
            collaborative activities.
          </p>
        </article>
      </div>
    </div>
  </section>

  <!-- =====================================================
         CERTIFIED DEVELOPER PROGRAM
===================================================== -->
  <section class="opportunity-section" id="certified-developer">
    <div class="container">
      <header class="opportunity-heading reveal reveal--up">
        <span class="opportunity-eyebrow"> Certified Developer Program </span>
        <h2 class="opportunity-title ">
          Structured development from junior to
          <span>senior level.</span>
        </h2>
        <p class="opportunity-description">
          The Certified Developer Program provides practical programming courses
          for developers who want to strengthen their technical ability, build
          real projects and progress professionally.
        </p>
      </header>

      <!-- Developer levels -->
      <div class="opportunity-grid opportunity-grid--three">
        <article class="opportunity-card reveal reveal--left-scale">
          <div class=" opportunity-card__icon">
            <i class="fa-solid fa-seedling"></i>
          </div>
          <span class="opportunity-badge"> Junior Level </span>
          <h3 class="opportunity-card__title">Build Strong Foundations</h3>
          <p class="opportunity-card__description">
            Learn programming fundamentals, development tools, clean coding
            practices and complete beginner-level applications.
          </p>
        </article>

        <article class="opportunity-card reveal reveal--left">
          <div class="opportunity-card__icon">
            <i class="fa-solid fa-code-branch"></i>
          </div>
          <span class="opportunity-badge"> Mid-Level </span>
          <h3 class="opportunity-card__title">Develop Production Skills</h3>
          <p class="opportunity-card__description">
            Work with frameworks, APIs, databases, authentication, reusable
            components and more advanced applications.
          </p>
        </article>

        <article class="opportunity-card reveal reveal--left-scale">
          <div class="opportunity-card__icon">
            <i class="fa-solid fa-layer-group"></i>
          </div>
          <span class="opportunity-badge"> Senior Level </span>
          <h3 class="opportunity-card__title">Lead and Architect Solutions</h3>
          <p class="opportunity-card__description">
            Focus on architecture, performance, security, scalability, technical
            leadership and production delivery.
          </p>
        </article>
      </div>

      <!-- Technology tracks -->
      <div class="opportunity-tracks">
        <header class="opportunity-heading reveal reveal--up">
          <span class="opportunity-eyebrow"> Technology Tracks </span>
          <h2 class="opportunity-title">Choose Your Certification Path</h2>
          <p class="opportunity-description">
            Explore specialized certifications to strengthen your skills in
            modern frameworks and languages.
          </p>
        </header>

        <div class="opportunity-grid opportunity-grid--four">
          <!-- JavaScript -->
          <article
            class="opportunity-card opportunity-card--track reveal reveal-delay-1"
          >
            <div class="opportunity-card__banner">
              <img
                src="static/images/javascript.jpg"
                alt="JavaScript Certification"
              />
            </div>
            <div class="opportunity-card__content">
              <h4 class="opportunity-card__title">JavaScript</h4>
              <p class="opportunity-card__description">
                Build strong frontend and backend web-programming foundations.
              </p>
              <hr>
                <div style="text-align: center; margin-top:2em;">
              <a
                href="https://certificates.dev/javascript?friend=BAFIKA"
                class="opportunity-card__link"
                target="_blank"
                rel="noopener noreferrer"
              >
                <b>Explore Certification </b><span>→</span>
              </a>
              </div>
            </div>
          </article>

          <!-- Vue.js -->
          <article
            class="opportunity-card opportunity-card--track reveal reveal--up"
          >
            <div class="opportunity-card__banner">
              <img src="static/images/vue.jpg" alt="Vue.js Certification" />
            </div>
            <div class="opportunity-card__content">
              <h4 class="opportunity-card__title">Vue.js</h4>
              <p class="opportunity-card__description">
                Create reusable and responsive component-based interfaces.
              </p>
              <hr>
                <div style="text-align: center; margin-top:2em;">
              <a
                href="https://certificates.dev/vuejs?friend=BAFIKA"
                class="opportunity-card__link"
                target="_blank"
                rel="noopener noreferrer"
              >
                <b>Explore Certification </b><span>→</span>
              </a>
              </div>
            </div>
          </article>

          <!-- Nuxt -->
          <article
            class="opportunity-card opportunity-card--track reveal reveal--down"
          >
            <div class="opportunity-card__banner">
              <img src="static/images/nuxt.jpg" alt="Nuxt Certification" />
            </div>
            <div class="opportunity-card__content">
              <h4 class="opportunity-card__title">Nuxt</h4>
              <p class="opportunity-card__description">
                Develop structured Vue applications with routing and server
                capabilities.
              </p>
              <hr>
                <div style="text-align: center; margin-top:2em;">
              <a
                href="https://certificates.dev/nuxt?friend=BAFIKA"
                class="opportunity-card__link"
                target="_blank"
                rel="noopener noreferrer"
              >
                <b>Explore Certification </b><span>→</span>
              </a>
              </div>
            </div>
          </article>

          <!-- React -->
          <article
            class="opportunity-card opportunity-card--track reveal reveal-delay-4"
          >
            <div class="opportunity-card__banner">
              <img src="static/images/react.jpg" alt="React Certification" />
            </div>
            <div class="opportunity-card__content">
              <h4 class="opportunity-card__title">React</h4>
              <p class="opportunity-card__description">
                Build modern interfaces using components, hooks and state
                management.
              </p>
              <hr>
                <div style="text-align: center; margin-top:2em;">
              <a
                href="https://certificates.dev/react?friend=BAFIKA"
                class="opportunity-card__link"
                target="_blank"
                rel="noopener noreferrer"
              >
                <b>Explore Certification </b><span>→</span>
              </a>
              </div>
            </div>
          </article>

          <!-- Laravel -->
          <article
            class="opportunity-card opportunity-card--track reveal reveal--left"
          >
            <div class="opportunity-card__banner">
              <img
                src="static/images/laravel.jpg"
                alt="Laravel Certification"
              />
            </div>
            <div class="opportunity-card__content">
              <h4 class="opportunity-card__title">Laravel</h4>
              <p class="opportunity-card__description">
                Develop secure PHP applications using MVC, databases,
                authentication and APIs.
              </p>
              <hr>
                <div style="text-align: center; margin-top:2em;">
              <a
                href="https://certificates.dev/laravel?friend=BAFIKA"
                class="opportunity-card__link"
                target="_blank"
                rel="noopener noreferrer"
              >
                <b>Explore Certification </b><span>→</span>
              </a>
              </div>
            </div>
          </article>

          <!-- Angular -->
          <article
            class="opportunity-card opportunity-card--track reveal reveal--down"
          >
            <div class="opportunity-card__banner">
              <img
                src="static/images/angular.jpg"
                alt="Angular Certification"
              />
            </div>
            <div class="opportunity-card__content">
              <h4 class="opportunity-card__title">Angular</h4>
              <p class="opportunity-card__description">
                Build structured and scalable TypeScript applications.
              </p>
              <hr>

              <div style="text-align: center; margin-top:2em;">
              <a
                href="https://certificates.dev/angular?friend=BAFIKA"
                class="opportunity-card__link"
                style="text-align: right;"
                target="_blank"
                rel="noopener noreferrer"
              >
                <b>Explore Certification </b><span>→</span>
              </a>
              </div>
            </div>
          </article>
        </div>
      </div>
    </div>
  </section>

  <!-- =====================================================
         PROFESSIONAL GROWTH
    ====================================================== -->
  <section
    class="opportunity-section opportunity-section--soft"
    id="professional-growth"
  >
    <div class="container">
      <header class="opportunity-heading reveal reveal--up">
        <span class="opportunity-eyebrow"> Professional Growth </span>

        <h2 class="opportunity-title">
          Develop beyond
          <span>technical ability.</span>
        </h2>

        <p class="opportunity-description">
          Strengthen the communication, teamwork, leadership and workplace
          habits required to contribute confidently in professional
          environments.
        </p>
      </header>

      <div class="opportunity-grid opportunity-grid--four">
        <article class="opportunity-card reveal reveal--right">
          <div class="opportunity-card__icon">
            <i class="fa-solid fa-comments"></i>
          </div>

          <h3 class="opportunity-card__title">Communication</h3>

          <p class="opportunity-card__description">
            Present ideas clearly and communicate effectively within
            professional teams.
          </p>
        </article>

        <article class="opportunity-card reveal reveal--right-scale">
          <div class="opportunity-card__icon">
            <i class="fa-solid fa-people-group"></i>
          </div>

          <h3 class="opportunity-card__title">Team Collaboration</h3>

          <p class="opportunity-card__description">
            Develop accountability, coordination and responsible contribution to
            shared objectives.
          </p>
        </article>

        <article class="opportunity-card reveal reveal--up">
          <div class="opportunity-card__icon">
            <i class="fa-solid fa-user-tie"></i>
          </div>

          <h3 class="opportunity-card__title">Career Readiness</h3>

          <p class="opportunity-card__description">
            Improve portfolios, professional profiles, interview confidence and
            workplace preparation.
          </p>
        </article>

        <article class="opportunity-card reveal reveal-delay-4">
          <div class="opportunity-card__icon">
            <i class="fa-solid fa-arrow-trend-up"></i>
          </div>

          <h3 class="opportunity-card__title">Leadership Growth</h3>

          <p class="opportunity-card__description">
            Build initiative, responsibility, decision-making and the ability to
            guide others.
          </p>
        </article>
      </div>
    </div>
  </section>

  <!-- =====================================================
         PARTNERSHIPS
    ====================================================== -->
  <section class="opportunity-section" id="partnerships">
    <div class="container">
      <div class="opportunity-partnership">
        <div class="opportunity-content reveal reveal--right">
          <span class="opportunity-eyebrow"> Partnerships </span>

          <h2 class="opportunity-title">
            Create meaningful opportunities
            <span>with CodNesta.</span>
          </h2>

          <p class="opportunity-description">
            CodNesta works with educational institutions, businesses, technology
            organisations, community groups and development partners to create
            practical learning, innovation and professional opportunities.
          </p>

          <ul class="opportunity-list">
            <li>
              <span class="opportunity-list__icon">
                <i class="fa-solid fa-check"></i>
              </span>

              Educational and training partnerships.
            </li>

            <li>
              <span class="opportunity-list__icon">
                <i class="fa-solid fa-check"></i>
              </span>

              Project and innovation collaboration.
            </li>

            <li>
              <span class="opportunity-list__icon">
                <i class="fa-solid fa-check"></i>
              </span>

              Internship and talent-development support.
            </li>
          </ul>

          <div class="opportunity-actions">
            <a
              href="mailto:partners@codnesta.com"
              class="button button--primary"
            >
              Send a Mail ->
            </a>

            <a
              href="{{ url_for('work_with_us.index') }}#collaboration-form"
              class="button button--secondary-dark"
            >
              Propose a Partnership
            </a>
          </div>
        </div>

        <div class="opportunity-image image-reveal reveal-delay-1">
          <img
            src="{{ url_for('static', filename='images/opportunities/partnerships.jpg') }}"
            alt="CodNesta representatives discussing a partnership"
          />
        </div>
      </div>
    </div>
  </section>

  <!-- =====================================================
         FINAL CTA
    ====================================================== -->
  <section class="opportunity-section opportunity-section--soft">
    <div class="container">
      <div class="opportunity-cta reveal reveal--down">
        <span class="opportunity-eyebrow"> Start Your Journey </span>

        <h2 class="opportunity-cta__title">
          Preparation creates access to better opportunities.
        </h2>

        <p class="opportunity-cta__description">
          Begin through Pre-Dev, build your foundation and position yourself for
          learning, community, project and professional opportunities across the
          CodNesta ecosystem.
        </p>

        <div class="opportunity-actions opportunity-actions--center">
          <a
            href="{{ url_for('predev.index') }}#predev-application"
            class="button button--primary"
            target="_self"
            rel="noopener noreferrer"
          >
            Explore Pre-Dev
          </a>
        </div>
      </div>
    </div>
  </section>
</main>

{% endblock %}