Residency.vue

<template>
  <div class="residency">
    <PageHeader>
      <template slot="subheading">
        {{ PageMetaResidency.subheading }}
      </template>
      <template slot="title">
        {{ PageMetaResidency.title }}
      </template>
      <template slot="description">
        {{ PageMetaResidency.description }}
      </template>
      <template slot="subtext"> 6-Month </template>
    </PageHeader>
    <v-container class="px-md-8 px-auto" fluid>
      <v-container class="px-md-16" fluid>
        <h2 class="my-3 mx-md-16 mx-auto">Purpose</h2>
      </v-container>

      <div class="container text-left">
        <v-container class="row justify-center">
          <div class="row text-left px-md-8 mb-16 mr-md-n10">
            <div class="col-md-6">
              Platform One is seeking applicants for our competitive 6-month
              residency program! This program is intended to build a cadre of
              DevSecOps users and professionals to accelerate DevSecOps adoption
              and capabilities within the DoD, and directly support the DoD
              DevSecOps initiative. Legacy software acquisition and development
              practices in the DoD do not provide the agility to deploy new
              software “at the speed of operations”. In addition, security is
              often an afterthought, not built in from the beginning of the
              lifecycle of the application and underlying infrastructure.
              DevSecOps is the industry best practice for rapid, secure software
              development.
            </div>
            <div class="col-md-6">
              DevSecOps is an organizational software engineering culture and
              practice that unifies software development (Dev), security (Sec)
              and operations (Ops). The main characteristics of DevSecOps are
              automation, monitoring, and security application in all phases of
              the software lifecycle: plan, develop, build, test, release,
              deliver, deploy, operate, and monitor. In DevSecOps, testing and
              security are conducted earlier in the development process through
              automated unit, functional, integration, and security testing -
              this is a key DevSecOps differentiator since security and
              functional capabilities are tested and built simultaneously.
            </div>
          </div>
        </v-container>
      </div>

      <div class="my-4 row justify-content-center">
        <v-card class="white--text pb-16 mx-md-16" color="#002743">
          <h2 class="white--text pt-10">Residency Details</h2>
          <div class="row justify-content-center white--text pb-6">
            <p class="prospective-cadidates">
              Prospective candidates are military (CONUS - Active Duty) and DoD
              Civil Service with the following skill sets:
            </p>
          </div>
          <div class="row justify-content-center">
            <div class="col-md-4 col-xl-2">
              <img
                class="img-fluid mt-2 mb-3"
                src="@/assets/images/Residency/Code_Icon.webp"
                alt="CodeIcon"
              />
              <h3 class="white--text">Software Development</h3>
            </div>
            <div class="col-md-4 col-xl-2">
              <img
                class="img-fluid mt-2 mb-3"
                src="@/assets/images/Residency/Lock_Icon.webp"
                alt="LockIcon"
              />
              <h3 class="white--text">Cyber Security</h3>
            </div>
            <div class="col-md-4 col-xl-2">
              <img
                class="img-fluid mt-2 mb-3"
                src="@/assets/images/Residency/User_Check_Icon.webp"
                alt="UserCheckIcon"
              />
              <h3 class="white--text">Design Thinking</h3>
            </div>

            <div class="col-md-4 col-xl-2">
              <img
                class="img-fluid mt-2 mb-3"
                src="@/assets/images/CyberSecurity/CS_Calendar_Icon.webp"
                alt="CalendarIcon"
              />
              <h3 class="white--text">Software Product Management</h3>
            </div>
            <div class="col-md-4 col-xl-2">
              <img
                class="img-fluid mt-2 mb-3"
                src="@/assets/images/Residency/List_Icon.webp"
                alt="ListIcon"
              />
              <h3 class="white--text">ACQUISITIONS / CONTRACTING</h3>
            </div>
          </div>
        </v-card>
      </div>

      <div class="container text-left">
        <v-container class="row justify-center">
          <div class="row text-left px-md-8 mb-8 mr-md-n10">
            <div class="col-md-6">
              Selected program residents will be full time employees at Platform
              One and will work remotely on one of the various Value Streams at
              Platform One: Big Bang, Party Bus, Iron Bank, CNAP, Cyber, or
              Acquisitions. Program residents will learn and participate in the
              best application development practices, learn to use, manage, and
              build DevSecOps pipelines, and develop an appreciation of the
              importance of design thinking in product development. Program
              residents with a cybersecurity background, will develop a deeper
              understanding of how cybersecurity is executed in accordance with
              the DoD
            </div>
            <div class="col-md-6">
              DevSecOps Reference Design, will learn more about how Platform One
              manages its continuous Authority to Operate (cATO), and learn how
              to accredit mission applications using the Risk Management
              Framework. Program residents with Acquisition Program Management
              or Contracting experience (Contract Specialist and Contracting
              Officers) will learn more about how contracting vehicles like
              Small Business Innovate Research (SBIR), and Basic Ordering
              Agreements (BOA) contract vehicles enable the acquisition and
              scaling of talent, software licenses, and cloud services to enable
              service delivery at Platform One.
            </div>
          </div>
        </v-container>
      </div>

      <v-container class="px-md-16" fluid>
        <h2 class="my-3 mx-md-16 mx-auto">VALUE STREAMS</h2>
        <div class="row justify-center">
          <div class="col-12 col-xl-8">
            <p>
              Platform One will only be selecting a set quantity of residents to
              embed within our value streams as depicted below:
            </p>
          </div>
        </div>
      </v-container>
      <ServicesSummary />
    </v-container>

    <v-container class="px-md-16 mt-16" fluid>
      <h2 class="my-3 mx-md-16 mx-auto">Application Process</h2>
      <div class="d-none d-md-block">
        <div class="row justify-center align-end">
          <div class="col-md-2"><p>Application Submission Window</p></div>
          <div class="col-md-2"><p>Interviews will be conducted</p></div>
          <div class="col-md-2"><p>Selected residents will be notified</p></div>
          <div class="col-md-2">
            <p>
              Prospective residents must send back Memorandum of Agreement
              signed by their Commanders to confirm their seat.
            </p>
          </div>
          <div class="col-md-2">
            <p>
              Confirmed selectees will receive an acceptance letter from the
              Platform One Materiel Leader.
              <span class="font-weight-medium">Begin Residency.</span>
            </p>
          </div>
        </div>
        <div class="row justify-center">
          <div class="col-md-2">
            <v-divider vertical class="divider-style"></v-divider>
          </div>
          <div class="col-md-2">
            <v-divider vertical class="divider-style"></v-divider>
          </div>
          <div class="col-md-2">
            <v-divider vertical class="divider-style"></v-divider>
          </div>
          <div class="col-md-2">
            <v-divider vertical class="divider-style"></v-divider>
          </div>
          <div class="col-md-2">
            <v-divider vertical class="divider-style"></v-divider>
          </div>
        </div>
        <v-divider color="black"></v-divider>
        <div class="row justify-center align-center">
          <div class="col-md-2">
            <p>
              <b>{{ this.residencyDates.applicationSubmissionWindow }}</b>
            </p>
          </div>
          <div class="col-md-2">
            <p>
              <b>{{ this.residencyDates.interviewsConducted }}</b>
            </p>
          </div>
          <div class="col-md-2">
            <p>
              <b>{{ this.residencyDates.selectedResidentNotificaiton }}</b>
            </p>
          </div>
          <div class="col-md-2">
            <p>
              <b>{{ this.residencyDates.memorandumOfAgreementSigned }}</b>
            </p>
          </div>
          <div class="col-md-2">
            <p>
              <b>{{ this.residencyDates.beginResidency }}</b>
            </p>
          </div>
        </div>
      </div>
      <div class="d-block d-md-none">
        <div class="row text-right">
          <div class="col-5">
            <p class="residency-dates">
              <b>{{ this.residencyDates.applicationSubmissionWindow }}</b>
            </p>
            <p class="residency-dates">
              <b>{{ this.residencyDates.interviewsConducted }}</b>
            </p>
            <p class="residency-dates">
              <b>{{ this.residencyDates.selectedResidentNotificaiton }}</b>
            </p>
            <p class="residence">
              <b>{{ this.residencyDates.memorandumOfAgreementSigned }}</b>
            </p>
            <p class="residency-dates">
              <b>{{ this.residencyDates.beginResidency }}</b>
            </p>
          </div>
          <v-divider vertical color="black"> </v-divider>
          <div class="col-5 text-left">
            <p class="residency-dates">Application Submission Window</p>
            <p class="residency-dates">Interviews will be conducted</p>
            <p class="residency-dates">Selected residents will be notified</p>
            <p class="residence">
              Prospective residents must send back Memorandum of Agreement
              signed by their Commanders to confirm their seat.
            </p>
            <p class="residency-dates">
              Confirmed selectees will receive an acceptance letter from the
              Platform One Materiel Leader.
              <span class="font-weight-medium">Begin Residency.</span>
            </p>
          </div>
        </div>
      </div>
    </v-container>

    <v-container class="px-md-16 mt-16" fluid>
      <h2 class="my-3 mx-md-16 mx-auto">How To Apply</h2>
      <div class="row justify-center">
        <div class="col-12 col-md-6 text-left">
          <ol>
            <li class="py-3">
              Write a single page Letter of Intent detailing your: Background,
              Experiences, Interests and goals, WHY this opportunity is
              important to you in further developing your DevSecOps knowledge,
              and What weapon or IT systems you hope to support in the future?
              Be sure to include your current branch of service and unit
              information on letter. Contracting Only: List your years of
              experience, warrant, and certification level.
            </li>
            <li class="py-3">
              <p>
                Fill out skills matrix spreadsheet (N/A to
                Acquisitions/Contracting)
              </p>
              <DownloadButton
                text="Skills Matrix Sheet"
                href="static/SkillsMatrixTemplate-PlatformOneResidency.xlsx"
              />
            </li>
          </ol>
        </div>
        <div class="col-12 col-md-6 text-left">
          <ol start="3">
            <li class="py-3">
              <p>
                Fill out your form, upload letters of intent, and skills matrix
                by clicking the “Apply Here” button below. Commander or
                equivalent approval is required to participate in this program.
              </p>
              <v-btn
                class="mt-3 px-16"
                color="primary"
                href="https://docs.google.com/forms/d/e/1FAIpQLSfFPrm_xhLJAmGdgncDqCn_Ak2jNQkbhtdoT7-MRfje-rYSQQ/viewform"
                target="_blank"
                rel="noopener noreferrer"
                ><v-icon color="#202020" left>mdi-lock</v-icon>Apply Here</v-btn
              >
            </li>
          </ol>
        </div>
      </div>
      <div class="row justify-center">
        <div class="col-12 col-xl-8 mt-8">
          <p>
            Apply to the Residency, NLT
            {{ this.residencyDates.residencyApplicationDeadline }}.
            <span class="font-weight-medium"
              >Applications received after this date will not be
              considered.</span
            >
          </p>
        </div>
      </div>
    </v-container>

    <div class="my-16 pb-10 row">
      <v-card class="py-8 mx-md-16" color="#f4f4f4">
        <div class="row px-16">
          <div class="col-md-5 mt-4">
            <img
              class="img-fluid mt-2 mb-3"
              src="@/assets/images/Residency/People_Icon.webp"
              alt="UserCheckIcon"
            />
          </div>
          <div class="col-md-7 text-left">
            <h3 class="pl-0 pb-4">Coordinating Instructions</h3>
            <p>
              Selected applicants must be able to start the six-month residency
              on {{ this.residencyDates.coordinatingInstructions }}. The program
              will last for 6 months and will be 100% Remote. There are no TDY
              costs associated with the residency program. Applicants must have
              at least 6 months left at their current duty station or service
              commitment to be eligible to apply. There is no payback tour
              incurred by participating in this opportunity.
            </p>
          </div>
        </div>
      </v-card>
    </div>

    <Wave :bottom="false">
      <div class="container">
        <div class="row justify-content-center">
          <div class="col-md-6">
            <h2 class="mx-auto">
              Have more questions about THE RESIDENCY PROGRAM?
            </h2>
          </div>
        </div>
        <div class="row justify-content-center">
          <div :class="$vuetify.breakpoint.smAndDown ? 'text-center' : ''">
            <v-btn
              :class="
                $vuetify.breakpoint.smAndDown
                  ? 'my-3 my-md-6 mx-3'
                  : 'my-6 mr-6'
              "
              color="primary"
              href="mailto:david.dallemand.2@us.af.mil?subject=Questions About The Residency Program"
              target="_blank"
              rel="noopener noreferrer"
              >CONTACT US</v-btn
            >
          </div>
        </div>
      </div>
    </Wave>
  </div>
</template>
<script>
import PageHeader from "@/components/PageHeader";
import ServicesSummary from "@/components/ServicesSummary";
import Wave from "@/components/Wave";
import DownloadButton from "@/components/Base/DownloadButton";
import { PageMeta } from "@/constants/PageMeta";

export default {
  name: "Residency",
  components: {
    PageHeader,
    Wave,
    ServicesSummary,
    DownloadButton,
  },
  methods: {},
  data: function () {
    return {
      PageMetaResidency: PageMeta.Residency,
      residencyDates: {
        applicationSubmissionWindow: "28 February 2022 – 15 April 2022",
        interviewsConducted: "18 April 2022 – 22 April 2022",
        selectedResidentNotificaiton: "25 April 2022",
        memorandumOfAgreementSigned: "29 April 2022",
        beginResidency: "2 May 2022",
        coordinatingInstructions: "2 May, 2022",
        residencyApplicationDeadline: "15 April 2022",
      },
    };
  },
};
</script>
<style lang="scss">
.divider-style {
  min-height: 50px;
  border: dashed #bdc931 !important;
}
.residence {
  min-height: 200px;
}
.residency-dates {
  min-height: 80px;
}
.prospective-cadidates {
  max-width: 600px;
}
.image-width {
  max-width: 200px;
}
</style>