Skip to content

Commit 4e9c179

Browse files
committed
get-started: add overview and template
Signed-off-by: David Karlsson <35727626+dvdksn@users.noreply.github.com>
1 parent 730710d commit 4e9c179

File tree

8 files changed

+106
-14
lines changed

8 files changed

+106
-14
lines changed
Lines changed: 28 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,37 @@
11
---
22
title: Getting started
33
keywords: get started, getting started, how to get started
4-
description: Get started with Docker. You'll learn about Docker Desktop, developing with Docker, as well as how to build and push your first image.
4+
description: |
5+
Get started with Docker. You'll learn about Docker Desktop, developing with
6+
Docker, as well as how to build and push your first image.
7+
summary: |
8+
Embark on a comprehensive learning path to understand Docker and
9+
containerization, beginning with foundational concepts and installation
10+
procedures. Progress through hands-on exercises that cover essential Docker
11+
commands, image creation, and container orchestration.
512
aliases:
6-
- /get-started/
13+
- /get-started/
14+
layout: series
15+
params:
16+
skill: Beginner
17+
time: 15 minutes
18+
prereq: None
719
---
820

9-
This getting started guide is a series of quick topics that show you how to:
21+
## About this series
1022

11-
* Install Docker Desktop
12-
* Develop with containers
13-
* Build and push your first image
23+
In this guide series, you will gain hands-on experience with Docker, starting
24+
with installing and setting up Docker Desktop on your local machine. You will
25+
learn how to run your first container, understanding the basics of
26+
containerization and its benefits. This series guides you through building your
27+
first Docker image, providing insights into creating efficient and reusable
28+
images. Finally, you will explore how to publish your image on Docker Hub,
29+
enabling you to share your work with the broader community and leverage
30+
Docker's powerful ecosystem for collaborative development and deployment.
1431

15-
By the end of this guide, you'll have hands-on experience using Docker Desktop
16-
and a better understanding of the benefits of containerizing your applications.
32+
## What you'll learn
1733

18-
Get started by installing Docker Desktop and running your first container.
19-
20-
{{< button text="Get Docker Desktop" url="get-docker-desktop.md" >}}
34+
- Set up Docker Desktop
35+
- Run your first container
36+
- Build your first image
37+
- Publish your image on Docker Hub

content/guides/getting-started/build-and-push-first-image.md

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,12 @@
22
title: Build and push your first image
33
keywords: concepts, container, docker desktop
44
description: This concept page will teach you how to build and push your first image
5+
summary: |
6+
Learn how to build your first Docker image, a key step in containerizing your
7+
application. We'll guide you through the process of creating an image
8+
repository and building and pushing your image to Docker Hub. This enables
9+
you to share your image easily within your team.
10+
weight: 3
511
---
612

713
{{< youtube-embed 7ge1s5nAa34 >}}

content/guides/getting-started/develop-with-containers.md

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,13 @@
11
---
2-
title: Develop with containers
2+
title: Develop with containers
33
keywords: concepts, build, images, container, docker desktop
44
description: This concept page will teach you how to develop with containers
5+
summary: |
6+
Learn how to run your first container, gaining hands-on experience with
7+
Docker's powerful features. We'll cover making real-time changes to both
8+
backend and frontend code within the containerized environment, ensuring
9+
seamless integration and testing.
10+
weight: 2
511
---
612

713
{{< youtube-embed D0SDBrS3t9I >}}

content/guides/getting-started/get-docker-desktop.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,13 @@
22
title: Get Docker Desktop
33
keywords: concepts, container, docker desktop
44
description: This concept page will teach you download Docker Desktop and install it on Windows, Mac, and Linux
5+
summary: |
6+
Getting Docker Desktop up and running is the first crucial step for
7+
developers diving into containerization, offering a seamless and
8+
user-friendly interface for managing Docker containers. Docker Desktop
9+
simplifies the process of building, sharing, and running applications in
10+
containers, ensuring consistency across different environments.
11+
weight: 1
512
---
613

714
{{< youtube-embed C2bPVhiNU-0 >}}

content/guides/getting-started/whats-next.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,12 @@
22
title: What's next
33
keywords: concepts, build, images, container, docker desktop
44
description: Explore step-by-step guides to hep you understand core Docker concepts, building images, and running containers.
5+
summary: |
6+
Now that you have set up Docker Desktop, developed with containers, and built
7+
and pushed your first image, you are ready to take the next step and dive
8+
deep into what a container is and how it works.
59
notoc: true
10+
weight: 4
611

712
the-basics:
813
- title: What is a container?

hugo_stats.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -138,9 +138,11 @@
138138
"bg-gradient-to-br",
139139
"bg-gradient-to-r",
140140
"bg-gradient-to-t",
141+
"bg-gray-dark-300",
141142
"bg-gray-light-100",
142143
"bg-gray-light-200",
143144
"bg-gray-light-200/50",
145+
"bg-gray-light-300",
144146
"bg-green-light",
145147
"bg-pattern-blue",
146148
"bg-pattern-purple",

layouts/guides/series.html

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
{{ define "left" }}
2+
{{ partial "sidebar.html" . }}
3+
{{ end }}
4+
5+
{{ define "main" }}
6+
{{ partial "breadcrumbs.html" . }}
7+
<article class="prose max-w-none dark:prose-invert">
8+
<h1 data-pagefind-weight="10" class="scroll-mt-36">{{ .Title }}</h1>
9+
<div class="text-lg">{{ .Summary }}</div>
10+
<div class="not-prose">
11+
<div class="flex flex-col sm:flex-row w-full justify-between gap-4 p-6 m-4 bg-gray-light-200 dark:bg-gray-dark-300">
12+
<div class="flex flex-col">
13+
<span><strong>Skill level</strong></span>
14+
<span>{{ .Params.skill }}</span>
15+
</div>
16+
<div class="flex flex-col">
17+
<span><strong>Time to complete</strong></span>
18+
<span>{{ .Params.time }}</span>
19+
</div>
20+
<div class="flex flex-col">
21+
<span><strong>Prerequisites</strong></span>
22+
<span>{{ .Params.prereq }}</span>
23+
</div>
24+
</div>
25+
</div>
26+
{{ .Content }}
27+
{{ partial "heading.html" (dict "text" "Modules" "level" 2) }}
28+
{{ range $i, $e := .Pages }}
29+
{{ $open := compare.Conditional (eq $i 0) true false }}
30+
<div x-data="{ open: {{ $open }} }" class="border border-gray-light-200 dark:border-gray-dark-200 bg-white dark:bg-gray-dark-100 py-2">
31+
<button class="not-prose w-full py-2 px-4 flex justify-between" x-on:click="open = ! open">
32+
<span class="text-xl">{{ fmt.Printf "%d. %s" (add $i 1) .Title }}</span>
33+
<span :class="{ 'hidden' : !open }" class="icon-svg">{{ partialCached "icon" "expand_less" "expand_less" }}</span>
34+
<span :class="{ 'hidden' : open }" class="icon-svg">{{ partialCached "icon" "expand_more" "expand_more" }}</span>
35+
</button>
36+
<div x-show="open" x-collapse class="px-4">
37+
<div class="mb-4">
38+
<div class="mb-4">{{ $e.Summary }}</div>
39+
<div>
40+
<a href="{{ $e.Permalink }}"
41+
class="no-underline cursor-pointer py-2 px-4 rounded bg-blue-light-500 dark:bg-blue-dark-400 hover:bg-blue-light-400 dark:hover:bg-blue-dark-500 text-white"
42+
>Start</a>
43+
</div>
44+
</div>
45+
</div>
46+
</div>
47+
{{ end }}
48+
</article>
49+
{{ end }}

layouts/shortcodes/youtube-embed.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<div id="youtube-player-{{ .Get 0 }}" data-video-id="{{ .Get 0}}" class="youtube-video aspect-video w-full"></div>
1+
<div id="youtube-player-{{ .Get 0 }}" data-video-id="{{ .Get 0 }}" class="youtube-video aspect-video w-full"></div>
22
{{ if page.Scratch.Get "youtube-embed" | default "incomplete" | ne "setup" }}
33
{{ page.Scratch.Set "youtube-embed" "setup" }}
44
<script>
@@ -53,4 +53,4 @@
5353
})();
5454

5555
</script>
56-
{{ end }}
56+
{{ end }}

0 commit comments

Comments
 (0)