Skip to content

Commit fca7317

Browse files
abbycabsabbycabs
authored
Merge pull request #322 from github/security-challenge
add security challenge page
2 parents 9f21b03 + 571b9d5 commit fca7317

File tree

5 files changed

+182
-2
lines changed

5 files changed

+182
-2
lines changed

‎common/routes.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,4 +30,6 @@ export const Y2024 = makePath('/2024')
3030

3131
export const NEWS = makePath("/news")
3232

33-
export const PARTNER_PACK = makePath('/partner-pack')
33+
export const PARTNER_PACK = makePath('/partner-pack')
34+
35+
export const SECURITY_CHALLENGE = makePath('/security-challenge')

‎components/header/Header.jsx

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import GitHubLogo from '../../public/icons/github-logo'
1111
import IconCalendar from '../../public/icons/calendar'
1212
import IconBooks from '../../public/icons/books'
1313
import BoxGift from '../../public/icons/box-gift'
14+
import IconShield from '../../public/icons/shield'
1415
import { BREAKPOINTS } from '../../common/constants'
1516

1617
const Header = () => {
@@ -81,7 +82,20 @@ const Header = () => {
8182
</li>
8283
<li>
8384
<Link
84-
85+
href={ROUTES.SECURITY_CHALLENGE.getPath(year)}
86+
aria-label={getLiteral('navigation:security-challenge')}
87+
className={clsx('header__link', {
88+
['is-active']: pathname === ROUTES.SECURITY_CHALLENGE.getPath(year),
89+
})}
90+
>
91+
<IconShield />
92+
<span className="header__link-text">
93+
{getLiteral('navigation:security-challenge')}
94+
</span>
95+
</Link>
96+
</li>
97+
<li>
98+
<Link
8599
href={ROUTES.SCHEDULE.getPath(year)}
86100
aria-label={getLiteral('navigation:schedule')}
87101
className={clsx('header__link', {

‎content/commons.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -61,6 +61,7 @@
6161
"navigation:schedule": "Schedule",
6262
"navigation:library": "Library",
6363
"navigation:partner-pack": "Partner Pack",
64+
"navigation:security-challenge": "Challenge",
6465

6566
"page:title": "Maintainer Month",
6667
"page:title-mobile": "MM",

‎pages/security-challenge.js

Lines changed: 131 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,131 @@
1+
import Head from 'next/head'
2+
import { useEffect } from 'react'
3+
import { useBackground } from '../contexts/BackgroundContext'
4+
import { marked } from 'marked'
5+
6+
export default function SecurityChallenge() {
7+
const { setAnimationStep } = useBackground()
8+
9+
useEffect(() => {
10+
// Use a distinctive animation step for Security Challenge
11+
setAnimationStep(3)
12+
}, [setAnimationStep])
13+
14+
// Skills course data
15+
const skillsCourses = [
16+
{
17+
title: "Secure Your Repository's Supply Chain",
18+
description: "Learn how to secure your repository's supply chain with proper dependency management",
19+
link: "https://github.com/skills/secure-repository-supply-chain",
20+
icon: "🔒"
21+
},
22+
{
23+
title: "Introduction to Secret Scanning",
24+
description: "Learn how to prevent accidental secret leaks and secure your repositories",
25+
link: "https://github.com/skills/introduction-to-secret-scanning",
26+
icon: "🔍"
27+
},
28+
{
29+
title: "Introduction to Repository Management",
30+
description: "Learn best practices for effective repository management and security",
31+
link: "https://github.com/skills/introduction-to-repository-management",
32+
icon: "📚"
33+
}
34+
]
35+
36+
// Convert markdown content to HTML
37+
const content = marked(`
38+
This Maintainer Month, we’re inviting open source maintainers to build their security skills through a hands-on challenge. Complete **three free GitHub Skills courses** and get a free voucher to earn your [GitHub Advanced Security certification](https://examregistration.github.com/certification/GHAS).
39+
40+
## How it Works
41+
42+
### Step 1: Complete these 3 GitHub Skills
43+
Each one takes about 1 hour
44+
`)
45+
46+
47+
// Convert markdown content to HTML
48+
const content_end = marked(`
49+
### Step 2: Submit the Completion Form
50+
Once you’ve finished all three, [fill out this form](https://forms.gle/HhPm3VofYDCiXeBB9) to share your progress and **claim your free certification voucher**.
51+
52+
🗓️ Deadline: Submit your form by May 31, 2025 to be eligible for the voucher.
53+
54+
### Step 3. Get Certified!
55+
We’ll email you a voucher to register for the GitHub Advanced Security certification (valued at $99 USD) and showcase your expertise - for free!
56+
57+
## Why This Matters
58+
Maintainers often carry the responsibility of software security—but don’t always have access to the right training or recognition. This challenge helps you build real-world skills and earn a GitHub-backed credential that showcases your expertise.
59+
60+
## FAQ
61+
#### Who can participate?
62+
Anyone! While we’re celebrating open source maintainers, this challenge is open to all contributors who want to grow their security skills.
63+
64+
#### How long does it take?
65+
Each GitHub Skill takes about 1 hour, so expect to spend around 3 hours total.
66+
67+
#### How many vouchers are available?
68+
Vouchers are limited and offered on a first-come, first-served basis. [Submit your form](https://forms.gle/HhPm3VofYDCiXeBB9) by May 31 to qualify!
69+
70+
#### I have more questions!
71+
If you have any questions about the challenge, please reach out to us at [maintainermonth@github.com](mailto:maintainermonth@github.com).
72+
`)
73+
return (
74+
<div>
75+
<Head>
76+
<title>Security Challenge - Maintainer Month 2025</title>
77+
<meta name="description" content="Complete security courses and earn a free GitHub Advanced Security certification during Maintainer Month 2025!" />
78+
79+
{/* <!-- Facebook Meta Tags --> */}
80+
<meta property="og:title" content="Security Challenge - Maintainer Month 2025" />
81+
<meta property="og:description" content="Complete security courses and earn a free GitHub Advanced Security certification during Maintainer Month 2025!" />
82+
<meta
83+
property="og:image"
84+
content="https://maintainermonth.github.com/images/og/generic.png"
85+
/>
86+
87+
{/* <!-- Twitter Meta Tags --> */}
88+
<meta name="twitter:card" content="summary_large_image" />
89+
<meta name="twitter:title" content="Security Challenge - Maintainer Month 2025" />
90+
<meta name="twitter:description" content="Complete security courses and earn a free GitHub Advanced Security certification during Maintainer Month 2025!" />
91+
<meta
92+
name="twitter:image"
93+
content="https://maintainermonth.github.com/images/og/generic.png"
94+
/>
95+
</Head>
96+
97+
<div className="container page-content partner-pack">
98+
<div className="partner-pack__hero">
99+
<h1 className="partner-pack__title">Security Challenge</h1>
100+
<p className="partner-pack__subtitle">Secure Your Open Source Projects & Earn a Free Certification!</p>
101+
</div>
102+
<div className="partner-pack__content">
103+
<div dangerouslySetInnerHTML={{ __html: content }}></div>
104+
<div className="offers-grid-container">
105+
<div className="offers-grid">
106+
{skillsCourses.map((course, index) => (
107+
<div key={index} className="offer-card">
108+
<div className="offer-card__logo">
109+
<span style={{ fontSize: '3rem' }}>{course.icon}</span>
110+
</div>
111+
<div className="offer-card__description">
112+
<h3>{course.title}</h3>
113+
<p>{course.description}</p>
114+
</div>
115+
<div className="offer-card__cta-container">
116+
<a href={course.link} className="offer-card__cta" target="_blank" rel="noopener noreferrer">
117+
Start this course
118+
</a>
119+
</div>
120+
</div>
121+
))}
122+
</div>
123+
</div>
124+
125+
<div dangerouslySetInnerHTML={{ __html: content_end }}></div>
126+
127+
</div>
128+
</div>
129+
</div>
130+
)
131+
}

‎public/icons/shield.js

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
const IconShield = () => {
2+
return (
3+
<svg
4+
className="icon-shield"
5+
width="22"
6+
height="22"
7+
viewBox="0 0 24 24"
8+
fill="none"
9+
xmlns="http://www.w3.org/2000/svg"
10+
>
11+
<path
12+
fillRule="evenodd"
13+
clipRule="evenodd"
14+
d="M11.9999 2.5C11.9999 2.5 5.25 5.25 2.50002 5.25C2.5 5.25 2 12.5 2.5 15C3 17.5 4.99997 19 6.99997 20.5C8.99997 22 11.9999 23 11.9999 23C11.9999 23 15 22 17 20.5C19 19 21 17.5 21.5 15C22 12.5 21.5 5.25 21.5 5.25C18.75 5.25 11.9999 2.5 11.9999 2.5Z"
15+
stroke="currentColor"
16+
strokeWidth="1.8"
17+
strokeLinecap="round"
18+
strokeLinejoin="round"
19+
fill="none"
20+
/>
21+
<path
22+
d="M9 12L11 14L16 9"
23+
stroke="currentColor"
24+
strokeWidth="1.8"
25+
strokeLinecap="round"
26+
strokeLinejoin="round"
27+
/>
28+
</svg>
29+
)
30+
}
31+
32+
export default IconShield

0 commit comments

Comments
 (0)