You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/tutorials/adding-custom-one-click-deploy.md
+19-68Lines changed: 19 additions & 68 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,50 +1,30 @@
1
1
---
2
-
title: Adding a Custom 1-Click Deploy
2
+
title: Adding Custom 1-Click Deploy to Your App
3
3
sidebar_position: 800
4
-
description: Add a custom 1-Click Deploy button to deploy your own app.
4
+
description: Add a custom 1-Click Deploy link to deploy your own app.
5
5
---
6
6
7
-
# Adding a Custom 1-Click Deploy
7
+
# Adding Custom 1-Click Deploy to Your App
8
8
9
-
This tutorial will show you how to add a custom Defang 1-Click Deploy button to deploy your own app to Defang Playground.
9
+
This tutorial will show you how to add a 1-Click Deploy link to deploy your app to the Defang Playground. 1-Click Deploy links point to a special Defang URL. Clicking this link will trigger a deployment of a project to Defang. These links are often placed as buttons in the `README.md` file of your project repository. They are the easiest way to allow anyone to deploy your app.
10
10
11
11
:::info
12
-
This page focuses on adding 1-Click Deploy to any app that is not from [our list of samples](https://defang.io/#samples). We have a separate tutorial on [how to use 1-Click Deploy](/docs/tutorials/using-one-click-deploy) for Defang's pre-made samples, which is meant for new users.
12
+
If you are trying to use 1-Click Deploy with one of our [samples](https://defang.io/samples/), we have a separate tutorial on [how to use 1-Click Deploy](/docs/tutorials/using-one-click-deploy).
13
13
:::
14
14
15
-
## Step 1 - Have an App Ready
15
+
## Pre-requisites
16
16
17
-
The button we will be creating in this tutorial will allow any user to deploy your app to their Defang account. If your app is ready to be deployed with Defang (i.e. has a valid `compose.yaml` file), you can skip this step.
17
+
- A [GitHub](https://github.com/) repository for your project
18
18
19
-
If not, you can either [manually write one](/docs/concepts/compose):
20
-
```yaml
21
-
services:
22
-
service-example:
23
-
image: nginx:latest # replace with the image or build for your app
24
-
ports:
25
-
- mode: ingress # specify ports to expose
26
-
target: 8080
27
-
published: 8080
28
-
29
-
```
30
-
31
-
Or, you can generate a new app using the command:
32
-
33
-
```
34
-
defang generate
35
-
```
19
+
## Step 1 - Prepare Your App
36
20
37
-
:::info
38
-
Make sure your `compose.yaml` file is in the root folder of your project.
39
-
:::
40
-
41
-
It may be helpful to have a `README.md` file, or a location to paste your 1-Click Deploy link.
21
+
You will need a `compose.yaml` file in the root folder of your project to describe the services which will be deployed. Learn more about writing [Compose files](/docs/concepts/compose#example-of-a-compose-file).
42
22
43
23
## Step 2 - Copy the GitHub Workflow
44
24
45
25
In your project, add a new folder named `.github`, then add a folder `workflows` inside it, and copy the entire GitHub Workflow `deploy.yaml` file from [here](https://github.com/DefangLabs/samples/blob/main/starter-sample/.github/workflows/deploy.yaml) into the `workflows` folder.
46
26
47
-
If your app does not have any [configuration](/docs/concepts/configuration)needed (e.g. API keys, passwords, etc.), you can remove the corresponding lines as indicated in the file.
27
+
If your app requires [configuration](/docs/concepts/configuration) (e.g. API keys, passwords, etc.), learn more about [managing config variables with the Defang GitHub Action](https://github.com/DefangLabs/defang-github-action).
48
28
49
29
You should have a `.yaml` file similar to the one below:
You have the option of using Defang's template repo or your own template GitHub repo for this step. There is no difference in end result, but it may be easier to use Defang's template repo so that you do not have to create your own.
78
-
79
-
### Option 1 - Use an Existing Template Repo
80
-
81
-
1. Click the link to [Defang's 1-Click template repo](https://github.com/DefangLabs/1-click-template), or open an existing template repo if you have one.
82
-
2. Click the dropdown menu next to the green "Use this template" button near the top right corner, then click "Create a new repository":
56
+
You will need the encoded version of your project repository's URL. This will be used as a redirect for the 1-Click Deploy link.
3. You will be taken to a page similar to the one shown below. Then, enter a name for your repository and click the green "Create repository" button at the bottom.
4. Go back to this repository's home page and follow the instructions in Option 1, skipping the first step.
101
-
102
-
## Step 4 - Get the Encoded URL
103
-
104
-
Now that you've created a new repository from a template repo, you will need the encoded version of the URL. This is necessary because it is used as a redirect for the 1-Click Deploy link.
105
-
106
-
1. Copy the URL of your new repository's homepage (not the template repository's homepage). It should look something like the following:
58
+
1. Copy the URL of your repository's homepage. It should look something like the following:
2. You can go online and paste the URL from the step above into a URL encoder tool of your choice. You should end up with an encoded URL, similar to the one shown below:
Finally, you will need to format the 1-Click Deploy Link as `https://portal.defang.dev/redirect?url=` + your encoded URL. This ensures that the user can get [logged in](/docs/concepts/authentication/) to Defang before they get redirected to clone your app for deployment.
68
+
## Step 4 - Create the 1-Click Deploy Link
119
69
70
+
You will need to create a 1-Click Deploy link with the following format: `https://portal.defang.dev/redirect?url=` + your encoded URL. This ensures that the user can get [logged in](/docs/concepts/authentication/) to Defang before they get redirected to clone your app for deployment.
120
71
121
72
:::tip
122
73
Optionally, you can add `&name=<your-project-here>` to the end of the link if you'd like to suggest a name for the user to use for their deployment.
@@ -127,9 +78,9 @@ The finished link should look similar to the one below:
0 commit comments