website/index.html at main · kubeskills/website · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
<!DOCTYPE html>
<html lang="en">
<head>
  <!-- Google Tag Manager -->
  <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-N88FP9P');</script>
  <!-- End Google Tag Manager -->
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>KubeSkills | Kubernetes Learning Community</title>
  <meta name="description" content="Join the #1 Kubernetes learning community and level up with live sessions, guided labs, and real-world playbooks from platform engineers.">
  <meta name="keywords" content="Kubernetes, DevOps, Cloud, Security, KubeSkills">
  <meta name="author" content="KubeSkills">
  <link rel="icon" href="./images/favicon.ico" type="image/x-icon">

  <!-- CSS Assets -->
  <link rel="stylesheet" href="./css/bootstrap.min.css">
  <link rel="stylesheet" href="./css/line-awesome.min.css">
  <link rel="stylesheet" href="./css/styles.css">

  <!-- Font Awesome for social media icons -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
  <script>const queryString=window.location.search;const urlParams=new URLSearchParams(queryString);const affiliateCode=urlParams.get('affiliate_code');const circleUrls='kubeskills.circle.so,community.kubeskills.com'.split(',');if(affiliateCode){let now=new Date;let days=60;now.setTime(now.getTime()+days*24*60*60*1e3);document.cookie='affiliate_code='+affiliateCode+'; expires='+now.toUTCString()+';'}function getAffiliateCodeCookie(){let cookieArr=document.cookie.split(';');let affiliateCodeCookie=cookieArr.find(cookie=>cookie.split('=')[0].trim()==='affiliate_code');if(affiliateCodeCookie)return decodeURIComponent(affiliateCodeCookie.split('=')[1])}function isCircleUrl(url){return circleUrls.some(circleUrl=>{let circleUrlRegex=new RegExp('^https?://'+circleUrl+'.*');return url.match(circleUrlRegex)})}document.addEventListener('DOMContentLoaded',function(){let links=document.getElementsByTagName('a');let storedAffiliateCode=getAffiliateCodeCookie();if(storedAffiliateCode){for(let i=0;i<links.length;i++){let href=links[i].href;if(href&&isCircleUrl(href)){href+=(href.match(/\?/)?'&':'?')+'affiliate_code='+storedAffiliateCode;links[i].href=href}}}})</script>
</head>
<body>
  <!-- Google Tag Manager (noscript) -->
  <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-N88FP9P"
  height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
  <!-- End Google Tag Manager (noscript) -->

  <header class="site-nav">
    <div class="container nav-container">
      <a class="nav-logo" href="/">
        <span class="nav-logo-accent">Kube</span>Skills
      </a>
      <button class="nav-toggle" type="button" aria-label="Toggle navigation" aria-expanded="false" aria-controls="primaryNav">
        <span></span>
        <span></span>
        <span></span>
      </button>
      <nav class="nav-links" id="primaryNav">
        <a class="nav-link" href="https://blog.kubeskills.com" target="_blank" rel="noopener">Blog</a>
        <a class="nav-link" href="https://community.kubeskills.com/courses" target="_blank" rel="noopener">Courses</a>
        <a class="nav-cta" href="https://community.kubeskills.com" target="_blank" rel="noopener">
          <span>Join the Community</span>
          <i class="la la-arrow-right"></i>
        </a>
      </nav>
    </div>
  </header>

  <div class="page-wrapper">

    <section class="hero-modern position-relative overflow-hidden">
      <div class="hero-gradient"></div>
      <div class="container py-5">
        <div class="row align-items-center gy-5">
          <div class="col-12 col-lg-6 text-center text-lg-start">
            <div class="hero-eyebrow d-inline-flex align-items-center gap-2 px-3 py-2">
              <span class="dot"></span>
              #1 Kubernetes Learning Community
            </div>
            <h1 class="hero-heading mt-3">Go from Kubernetes curious to production-ready with KubeSkills</h1>
            <p class="hero-description mt-3">
              Learn alongside platform engineers, SREs, and builders who ship real clusters every day. Live sessions, deep dives, and guided projects meet you where you are.
            </p>
            <div class="hero-actions d-flex flex-column flex-sm-row gap-3 mt-4 justify-content-center justify-content-lg-start">
              <a href="https://community.kubeskills.com" class="btn btn-primary btn-lg px-4">Join the Community</a>
              <a href="https://community.kubeskills.com/courses" class="btn btn-outline-primary btn-lg px-4">Browse Courses</a>
            </div>
            <div class="hero-meta mt-4">
              <p class="small text-white-50 mb-2">Trusted by engineers from</p>
              <div class="brand-row d-flex flex-wrap gap-3 justify-content-center justify-content-lg-start">
                <span class="brand-chip">Fortune 500</span>
                <span class="brand-chip">Hypergrowth Startups</span>
                <span class="brand-chip">Cloud-Native Teams</span>
              </div>
            </div>
            <div class="social-pills d-flex flex-wrap gap-3 mt-4 justify-content-center justify-content-lg-start">
              <a class="social-pill" href="https://www.linkedin.com/company/kubeskills" target="_blank" aria-label="LinkedIn">
                <i class="fab fa-linkedin"></i>
              </a>
              <a class="social-pill" href="https://x.com/kubeskills" target="_blank" aria-label="X">
                <i class="fab fa-x-twitter"></i>
              </a>
              <a class="social-pill" href="https://www.instagram.com/kubeskills" target="_blank" aria-label="Instagram">
                <i class="fab fa-instagram"></i>
              </a>
              <a class="social-pill" href="https://bsky.app/profile/kubeskills.com" target="_blank" aria-label="Bluesky">
                <img src="./images/bluesky.svg" alt="Bluesky">
              </a>
            </div>
          </div>
          <div class="col-12 col-lg-6">
            <div class="hero-card mx-auto">
              <div class="hero-card-header">
                <span class="badge bg-soft-primary text-primary">Stay in the loop</span>
              </div>
              <div class="mt-4">
                <script async data-uid="024ce68ad3" src="https://awesome-pioneer-9305.ck.page/024ce68ad3/index.js"></script>
              </div>
              <div class="hero-card-footer mt-4">
                <div class="d-flex align-items-center gap-3">
                  <div class="avatar-stack">
                    <span class="avatar-circle"></span>
                    <span class="avatar-circle"></span>
                    <span class="avatar-circle"></span>
                  </div>
                  <p class="mb-0 small text-muted">8,000+ community members levelling up with Kubernetes every month.</p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>

    <section class="py-5 benefits-section">
      <div class="container">
        <div class="row justify-content-center mb-5">
          <div class="col-12 col-lg-8 text-center">
            <h2 class="fw-bold">Skill up with a community built for Kubernetes pros</h2>
            <p class="text-muted mt-3">Learn from mentors shipping production workloads, accelerate certification prep, and collaborate on real projects.</p>
          </div>
        </div>
        <div class="row g-4">
          <div class="col-12 col-md-4">
            <div class="feature-card h-100 p-4">
              <div class="feature-icon">
                <i class="la la-bolt"></i>
              </div>
              <h5 class="mt-3">Live & Interactive</h5>
              <p class="text-muted mb-0">Drop into weekly AMAs, live labs, and study halls to get unstuck fast.</p>
            </div>
          </div>
          <div class="col-12 col-md-4">
            <div class="feature-card h-100 p-4">
              <div class="feature-icon">
                <i class="la la-users"></i>
              </div>
              <h5 class="mt-3">Expert Community</h5>
              <p class="text-muted mb-0">Connect with seasoned SREs and platform engineers who share real-world playbooks.</p>
            </div>
          </div>
          <div class="col-12 col-md-4">
            <div class="feature-card h-100 p-4">
              <div class="feature-icon">
                <i class="la la-rocket"></i>
              </div>
              <h5 class="mt-3">Career Momentum</h5>
              <p class="text-muted mb-0">Build portfolio-ready projects and stay ahead of the curve with curated resources.</p>
            </div>
          </div>
        </div>
      </div>
    </section>

    <section class="py-5 bg-white">
      <div class="container">
        <div class="row align-items-center g-5">
          <div class="col-12 col-lg-6 order-lg-2">
            <div class="video-card position-relative">
              <img src="./images/about/07.png" class="img-fluid rounded-4 shadow-lg" alt="KubeSkills community">
              <a class="play-btn-modern" href="https://www.youtube.com/watch?v=GjoZzRqOw7g" target="_blank" rel="noopener" aria-label="Play community overview">
                <i class="la la-play"></i>
              </a>
            </div>
          </div>
          <div class="col-12 col-lg-6">
            <span class="badge bg-soft-primary text-primary rounded-pill px-3 py-2">Inside the community</span>
            <h3 class="fw-bold mt-3">Projects, mentorship, and clarity about Kubernetes</h3>
            <p class="text-muted mt-3">
              Whether you are preparing for the CKA, shipping production clusters, or building platform guardrails, the KubeSkills community gives you the confidence to move faster without breaking things.
            </p>
            <ul class="list-unstyled text-muted mt-4 community-checklist">
              <li class="mb-2"><i class="la la-check-circle text-primary me-2"></i>Hands-on labs and guided learning paths</li>
              <li class="mb-2"><i class="la la-check-circle text-primary me-2"></i>Private forums for architecture reviews and career advice</li>
              <li><i class="la la-check-circle text-primary me-2"></i>On-demand recordings so you never miss a session</li>
            </ul>
          </div>
        </div>
      </div>
    </section>

    <section class="latest-blog-section py-5" id="latestBlog">
      <div class="container">
        <div class="row justify-content-center text-center mb-5">
          <div class="col-12 col-lg-8">
            <span class="badge bg-soft-primary text-primary rounded-pill px-3 py-2">Latest from the blog</span>
            <h2 class="fw-bold mt-3">Fresh Kubernetes plays from the KubeSkills team</h2>
            <p class="text-muted mt-3">See what we are sharing with the community this week, pulled straight from blog.kubeskills.com.</p>
          </div>
        </div>
        <div class="latest-blog-card" id="latestBlogCard">
          <div class="latest-blog-cover">
            <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" alt="" loading="lazy" data-blog-cover class="latest-blog-cover-img">
          </div>
          <div class="latest-blog-body">
            <p class="latest-blog-date text-uppercase text-primary fw-semibold mb-2" data-blog-date>Fetching the latest post…</p>
            <h3 class="latest-blog-title mb-3" data-blog-title>The latest Kubernetes insight is on the way.</h3>
            <p class="latest-blog-excerpt text-muted" data-blog-excerpt>Hang tight while we grab the newest blog post from our publishing stack.</p>
            <p class="latest-blog-loading text-muted small mt-3 mb-4" data-blog-loading>Connecting to blog.kubeskills.com…</p>
            <div class="latest-blog-actions d-flex flex-column flex-sm-row gap-3">
              <a class="btn btn-primary px-4" href="https://blog.kubeskills.com" target="_blank" rel="noopener" data-blog-link>Read the full post</a>
              <a class="btn btn-outline-primary px-4" href="https://blog.kubeskills.com" target="_blank" rel="noopener">Visit the blog</a>
            </div>
          </div>
        </div>
        <noscript>
          <div class="alert alert-warning mt-4">Enable JavaScript to see the latest blog preview. Meanwhile, <a href="https://blog.kubeskills.com" target="_blank" rel="noopener">visit blog.kubeskills.com</a>.</div>
        </noscript>
      </div>
    </section>

    <section class="cta-modern py-5 text-center">
      <div class="container">
        <h2 class="fw-bold text-white">Ready to build your Kubernetes career?</h2>
        <p class="text-white-50 mt-3 mb-4">Join the #1 Kubernetes learning community and unlock the roadmap to production-ready skills.</p>
        <div class="d-flex flex-column flex-sm-row gap-3 justify-content-center">
          <a href="https://community.kubeskills.com" class="btn btn-light btn-lg shadow-sm">Join the Community</a>
          <a href="https://community.kubeskills.com/courses" class="btn btn-outline-light btn-lg">View Courses</a>
        </div>
      </div>
    </section>
  </div>

  <footer class="bg-dark text-light py-4 text-center">
    <div class="container">
      <p class="mb-0">© 2025 KubeSkills — All rights reserved.</p>
      <p class="mt-1">
        <a href="https://kubeskills.com" class="text-light">Visit our homepage</a>
      </p>
    </div>
  </footer>

  <div class="cookie-banner is-hidden" id="cookieBanner" role="dialog" aria-live="polite" aria-label="Cookie consent notice">
    <div class="cookie-banner__content">
      <strong>We use cookies</strong>
      <p>We use essential cookies to make this site work and optional analytics cookies to understand how you use KubeSkills. Accept cookies to help us improve, or decline to continue with required cookies only.</p>
    </div>
    <div class="cookie-banner__actions">
      <button class="cookie-banner__button cookie-banner__button--accept" type="button" id="cookieAcceptButton">Accept all cookies</button>
      <button class="cookie-banner__button cookie-banner__button--decline" type="button" id="cookieDeclineButton">Decline</button>
      <a class="cookie-banner__link" href="https://kubeskills.com/privacy" target="_blank" rel="noopener">Privacy policy</a>
    </div>
  </div>

  <!-- JS Assets -->
  <script src="./js/script.js"></script>
</body>
</html>