docker
/
docs
mirror of https://github.com/docker/docs.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

SDK landing page reorg (#16174) 

* SDK landing page reorg

* fix link
This commit is contained in:
Allie Sadler 2022-11-17 12:04:27 +00:00 committed by GitHub
parent a521dc7678
commit 3f0cded22f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 120 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
_data/toc.yaml
View File

@ -1325,6 +1325,8 @@ manuals:
section:
- path: /desktop/extensions-sdk/
title: Overview
- path: /desktop/extensions-sdk/process/
title: The build and publish process
- path: /desktop/extensions-sdk/quickstart/
title: Quickstart
- sectiontitle: "Part one: Build"

1
assets/images/design.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#677285"><g><rect fill="none" height="24" width="24"/><rect fill="none" height="24" width="24"/></g><g><g/><g><path d="M16.24,11.51l1.57-1.57l-3.75-3.75l-1.57,1.57L8.35,3.63c-0.78-0.78-2.05-0.78-2.83,0l-1.9,1.9 c-0.78,0.78-0.78,2.05,0,2.83l4.13,4.13L3.15,17.1C3.05,17.2,3,17.32,3,17.46v3.04C3,20.78,3.22,21,3.5,21h3.04 c0.13,0,0.26-0.05,0.35-0.15l4.62-4.62l4.13,4.13c1.32,1.32,2.76,0.07,2.83,0l1.9-1.9c0.78-0.78,0.78-2.05,0-2.83L16.24,11.51z M9.18,11.07L5.04,6.94l1.89-1.9c0,0,0,0,0,0l1.27,1.27L7.73,6.8c-0.39,0.39-0.39,1.02,0,1.41c0.39,0.39,1.02,0.39,1.41,0 l0.48-0.48l1.45,1.45L9.18,11.07z M17.06,18.96l-4.13-4.13l1.9-1.9l1.45,1.45l-0.48,0.48c-0.39,0.39-0.39,1.02,0,1.41 c0.39,0.39,1.02,0.39,1.41,0l0.48-0.48l1.27,1.27L17.06,18.96z"/><path d="M20.71,7.04c0.39-0.39,0.39-1.02,0-1.41l-2.34-2.34c-0.47-0.47-1.12-0.29-1.41,0l-1.83,1.83l3.75,3.75L20.71,7.04z"/></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 999 B

1
assets/images/process.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#677285"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M8 7h12c.55 0 1-.45 1-1s-.45-1-1-1H8c-.55 0-1 .45-1 1s.45 1 1 1zm12 10H8c-.55 0-1 .45-1 1s.45 1 1 1h12c.55 0 1-.45 1-1s-.45-1-1-1zm0-6H8c-.55 0-1 .45-1 1s.45 1 1 1h12c.55 0 1-.45 1-1s-.45-1-1-1zM4.5 16h-2c-.28 0-.5.22-.5.5s.22.5.5.5H4v.5h-.5c-.28 0-.5.22-.5.5s.22.5.5.5H4v.5H2.5c-.28 0-.5.22-.5.5s.22.5.5.5h2c.28 0 .5-.22.5-.5v-3c0-.28-.22-.5-.5-.5zm-2-11H3v2.5c0 .28.22.5.5.5s.5-.22.5-.5v-3c0-.28-.22-.5-.5-.5h-1c-.28 0-.5.22-.5.5s.22.5.5.5zm2 5h-2c-.28 0-.5.22-.5.5s.22.5.5.5h1.3l-1.68 1.96c-.08.09-.12.21-.12.32v.22c0 .28.22.5.5.5h2c.28 0 .5-.22.5-.5s-.22-.5-.5-.5H3.2l1.68-1.96c.08-.09.12-.21.12-.32v-.22c0-.28-.22-.5-.5-.5z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 787 B

1
assets/images/publish.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#677285"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M5 5c0 .55.45 1 1 1h12c.55 0 1-.45 1-1s-.45-1-1-1H6c-.55 0-1 .45-1 1zm2.41 9H9v5c0 .55.45 1 1 1h4c.55 0 1-.45 1-1v-5h1.59c.89 0 1.34-1.08.71-1.71L12.71 7.7c-.39-.39-1.02-.39-1.41 0l-4.59 4.59c-.63.63-.19 1.71.7 1.71z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 375 B

1
assets/images/sync.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#677285"><g><rect fill="none" height="24" width="24"/></g><g><g><path d="M21.65,7.65l-2.79-2.79C18.54,4.54,18,4.76,18,5.21V7H4C3.45,7,3,7.45,3,8s0.45,1,1,1h14v1.79c0,0.45,0.54,0.67,0.85,0.35 l2.79-2.79C21.84,8.16,21.84,7.84,21.65,7.65z"/><path d="M20,15H6v-1.79c0-0.45-0.54-0.67-0.85-0.35l-2.79,2.79c-0.2,0.19-0.2,0.51-0.01,0.7l2.79,2.79C5.46,19.46,6,19.24,6,18.79 V17h14c0.55,0,1-0.45,1-1S20.55,15,20,15z"/></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 549 B

110
desktop/extensions-sdk/index.md
View File

@ -20,51 +20,65 @@ An extension can contain a UI part and backend parts that run either on the host
Extensions are distributed through the Docker Hub.
Development of extensions can be done locally without the need to push the extension to Docker Hub. See [Extensions distribution](extensions/DISTRIBUTION.md) for further details.
## How to use the resources in this section
The documentation is structured so that it matches the steps you need to take when creating your extension. There are two main parts to creating a Docker Extension; build the foundations and then publish your extension.
### Part one: Build the foundations
The build process consists of:
- Installing the latest version of Docker Desktop.
- Setting up the directory with files which range from the extension’s source code to the required extension-specific files.
- Creating the Dockerfile to build, publish, and run your extension in Docker Desktop.
- Configuring the metadata file which is required at the root of the image filesystem.
- Building and installing the extension.
- Testing and debugging the extension.
There are also instructions on [how to set authentication](dev/oauth2-flow.md) for your extension.
This build section provides sample folders with ready-to-go examples that walk you through building:
- A frontend extension based on plain HTML
- A simple Docker extension that contains only a UI part and is based on ReactJS. This is useful if you want to develop an extension which consists exclusively of a visual part with no services running in the VM.
- An extension that invokes Docker CLI commands
- A simple backend extension
>Note
>
>Whilst you're building your extension, make sure you follow our [design](design/design-guidelines.md) and [UI styling](design/overview.md) guidelines to ensure visual consistency and [level AA accessibility standards](https://www.w3.org/WAI/WCAG2AA-Conformance){:target="_blank" rel="noopener" class="_"}.
If your extension requires additional services running in the Docker Desktop VM, see the [VM UI](https://github.com/docker/extensions-sdk/tree/main/samples/vm-service){:target="_blank" rel="noopener" class="_"} example.
For further inspiration, see the other examples in the [samples folder](https://github.com/docker/extensions-sdk/tree/main/samples){:target="_blank" rel="noopener" class="_"}.
### Part two: Publish and distribute your extension
Docker Desktop displays published extensions in the Extensions Marketplace. The Extensions Marketplace is a curated space where developers from all over can discover extensions to improve their developer experience and upload their own extension to share with the world.
All extensions submitted to the Extension Marketplace are reviewed and approved by our team before listing. This review process ensures a level of trust, security, and quality for developers using Extensions and allows for Extension developers to get feedback on what will improve their Extensions experience.
If you want your extension to be published in the Marketplace, you can submit your extension [here](https://www.docker.com/products/extensions/submissions/){:target="_blank" rel="noopener" class="_"}. We’ll review your submission and provide feedback if changes are needed before we can validate and publish it to make it available to all Docker Desktop users.
## What’s next?
If you want to get up and running quickly with a Docker Extension, see the [Quickstart guide](quickstart.md).
Alternatively, get started with Part one: Build for more in-depth information about each step of the extension creation process.
For an in-depth tutorial of the entire build process, we recommend the following video walkthrough from DockerCon 2022:
<iframe width="560" height="315" src="https://www.youtube.com/embed/Yv7OG-EGJsg" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<div class="component-container">
<!--start row-->
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-4 block">
<div class="component">
<div class="component-icon">
<a href="/desktop/extensions-sdk/process/"><img src="/assets/images/process.svg" alt="Process" width="70" height="70"></a>
</div>
<h2 id="docker-extensions"><a href="/desktop/extensions-sdk/process/">The build and publish process</a></h2>
<p> Understand the process for building and publishing an extension.</p>
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-4 block">
<div class="component">
<div class="component-icon">
<a href="/desktop/extensions-sdk/quickstart/"><img src="/assets/images/explore.svg" alt="Quickstart" width="70" height="70"></a>
</div>
<h2 id="docker-extensions"><a href="/desktop/extensions-sdk/quickstart/">Quickstart guide</a></h2>
<p>Follow the quickstart guide to build a basic Docker Extension quickly.</p>
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-4 block">
<div class="component">
<div class="component-icon">
<a href="/desktop/extensions-sdk/design/design-guidelines/"><img src="/assets/images/design.svg" alt="Design quidelines" width="70" height="70"></a>
</div>
<h2 id="docker-extensions"><a href="/desktop/extensions-sdk/design/design-guidelines/">View the design guidelines</a></h2>
<p>Ensure your extension aligns to Docker's design guidelines and principles</p>
</div>
</div>
</div>
<!--start row-->
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-4 block">
<div class="component">
<div class="component-icon">
<a href="/desktop/extensions-sdk/extensions/"><img src="/assets/images/publish.svg" alt="Publish" width="70" height="70"></a>
</div>
<h2 id="docker-extensions"><a href="/desktop/extensions-sdk/extensions/">Publish your extension</a></h2>
<p>Understand how to publish your extension to the Marketplace.</p>
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-4 block">
<div class="component">
<div class="component-icon">
<a href="/desktop/extensions-sdk/dev/kubernetes/"><img src="/assets/images/sync.svg" alt="Kubernetes" width="70" height="70"></a>
</div>
<h2 id="docker-extensions"><a href="/desktop/extensions-sdk/dev/kubernetes/">Interacting with Kubernetes</a></h2>
<p>Find information on how to interact indirectly with a Kubernetes cluster from your Docker extension.</p>
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-4 block">
<div class="component">
<div class="component-icon">
<a href="/desktop/extensions-sdk/extensions/multi-arch/"><img src="/assets/images/build-multi-platform.svg" alt="Multi-arch" width="70" height="70"></a>
</div>
<h2 id="docker-extensions"><a href="/desktop/extensions-sdk/extensions/multi-arch/">Multi-arch extensions</a></h2>
<p>Build your extension for multiple architectures.</p>
</div>
</div>
</div>
</div>

52
desktop/extensions-sdk/process.md Normal file
View File

@ -0,0 +1,52 @@
---
description: Understand the process of creating an extension.
title: The build build and publish process
keyword: Docker Extensions, sdk, build, create, publish
---
The documentation is structured so that it matches the steps you need to take when creating your extension. There are two main parts to creating a Docker Extension; build the foundations and then publish your extension.
### Part one: Build the foundations
The build process consists of:
- Installing the latest version of Docker Desktop.
- Setting up the directory with files which range from the extension’s source code to the required extension-specific files.
- Creating the Dockerfile to build, publish, and run your extension in Docker Desktop.
- Configuring the metadata file which is required at the root of the image filesystem.
- Building and installing the extension.
- Testing and debugging the extension.
There are also instructions on [how to set authentication](dev/oauth2-flow.md) for your extension.
This build section provides sample folders with ready-to-go examples that walk you through building:
- A frontend extension based on plain HTML
- A simple Docker extension that contains only a UI part and is based on ReactJS. This is useful if you want to develop an extension which consists exclusively of a visual part with no services running in the VM.
- An extension that invokes Docker CLI commands
- A simple backend extension
>Note
>
>Whilst you're building your extension, make sure you follow our [design](design/design-guidelines.md) and [UI styling](design/overview.md) guidelines to ensure visual consistency and [level AA accessibility standards](https://www.w3.org/WAI/WCAG2AA-Conformance){:target="_blank" rel="noopener" class="_"}.
If your extension requires additional services running in the Docker Desktop VM, see the [VM UI](https://github.com/docker/extensions-sdk/tree/main/samples/vm-service){:target="_blank" rel="noopener" class="_"} example.
For further inspiration, see the other examples in the [samples folder](https://github.com/docker/extensions-sdk/tree/main/samples){:target="_blank" rel="noopener" class="_"}.
### Part two: Publish and distribute your extension
Docker Desktop displays published extensions in the Extensions Marketplace. The Extensions Marketplace is a curated space where developers from all over can discover extensions to improve their developer experience and upload their own extension to share with the world.
All extensions submitted to the Extension Marketplace are reviewed and approved by our team before listing. This review process ensures a level of trust, security, and quality for developers using Extensions and allows for Extension developers to get feedback on what will improve their Extensions experience.
If you want your extension to be published in the Marketplace, you can submit your extension [here](https://www.docker.com/products/extensions/submissions/){:target="_blank" rel="noopener" class="_"}. We’ll review your submission and provide feedback if changes are needed before we can validate and publish it to make it available to all Docker Desktop users.
## What’s next?
If you want to get up and running quickly with a Docker Extension, see the [Quickstart guide](quickstart.md).
Alternatively, get started with Part one: Build for more in-depth information about each step of the extension creation process.
For an in-depth tutorial of the entire build process, we recommend the following video walkthrough from DockerCon 2022:
<iframe width="560" height="315" src="https://www.youtube.com/embed/Yv7OG-EGJsg" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>