# Deployment tutorial (English version)

### Service deployment

> <https://github.com/Dogtiti/AutoGPT-Next-Web>

<table data-header-hidden><thead><tr><th width="103.66666666666669"></th><th width="405"></th><th></th></tr></thead><tbody><tr><td><strong>Step</strong></td><td><strong>Description</strong></td><td><strong>Screenshot</strong></td></tr><tr><td>1<br></td><td>Click the "deploy" button in the image to enter the build page.</td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FiT2yLUQZsX9SRfmqxnSM%2Fimage.png?alt=media&#x26;token=e6697870-a1b7-46ac-8271-cd655926383e" alt=""></td></tr><tr><td>2</td><td>Click "Continue with GitHub" to start building</td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2F0jEc1V5HETZKBeEVyyXX%2Fimage.png?alt=media&#x26;token=67d34175-855c-4f67-96fa-77a7bd3e22eb" alt=""></td></tr><tr><td>3</td><td>Click "Github" and enter the previously prepared Github account to log in</td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FTGKR8pdwGrcRZ2Lyc3NU%2Fimage.png?alt=media&#x26;token=3f680def-15d4-42ba-bfcc-088ba658688c" alt=""></td></tr><tr><td>4</td><td><p>After logging in, come to this page, enter a random name (English) in the box, and click "create" to create a project</p><p>The system will fill in one by default, or you can modify it yourself.</p><p><br></p></td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FkMClr6AyRrsD6wza0yCK%2Fimage.png?alt=media&#x26;token=b786b68f-0fc6-4653-8719-32939bdea13d" alt=""></td></tr><tr><td>5</td><td><p>Wait a moment, you will jump to the location of the API Key configuration (as shown in the figure)</p><ul><li>OPENAI_API_KEY is required, for your own openai 's API key</li></ul></td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FiHQUFPreCmBhXhNKON61%2Fimage.png?alt=media&#x26;token=93455432-a89f-4a63-9c9c-508c5377d9f8" alt=""></td></tr><tr><td>6</td><td><p>At this time, open the ChatGPT website to log in, find the APIkey, and click "create new secret key"</p><p></p><p>https://platform.openai.com/account/api-keys<br></p></td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FUn80Urn666ZVL9fnwwRv%2Fimage.png?alt=media&#x26;token=8f08485e-bd0d-47fb-898b-cbc355862e84" alt=""></td></tr><tr><td>7</td><td>Click the "Copy" button to copy the API key</td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FcJcLkIIjsKQ9w9kAtg7P%2Fimage.png?alt=media&#x26;token=eed5197e-fd15-45fa-a4a7-6399de2cd70a" alt=""></td></tr><tr><td>9</td><td>Go back to the previous API key configuration page and fill in the key (as shown in the figure)</td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2F9QbLktBsRmzyCxhAQWEE%2Fimage.png?alt=media&#x26;token=632bfb2c-26f2-4c72-9f06-be9b1f890018" alt=""></td></tr><tr><td>10</td><td>Click the "deploy" button to start the deployment, it usually takes 1-2min, wait patiently for a while</td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2Fo6j97Ygf5ZW0sAvmKBqz%2Fimage.png?alt=media&#x26;token=f24f1bcf-d557-4d35-a2cc-c2deef4e2245" alt=""></td></tr><tr><td>11</td><td>Displaying this page indicates that the build was successful.</td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FGGC739wtf5xYl4rAHl54%2Fimage.png?alt=media&#x26;token=4eae66b2-63b0-46ba-a456-c0a4e02d4715" alt=""></td></tr><tr><td>13</td><td>Click the red box on the left to enter the built exclusive website</td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FNexMy5PJlcAofS7k9Rst%2Fimage.png?alt=media&#x26;token=6ddf3494-6844-4af3-8faa-946a5e67d992" alt=""></td></tr><tr><td>14</td><td>Now you can try to have a conversation with AutoGPT~</td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FJfyzc4R5KAMdMxdxANnJ%2Fimage.png?alt=media&#x26;token=df080a14-c62c-4a37-bae8-01ac665d36ac" alt=""></td></tr></tbody></table>

#### Post script:

AutoGPT-Next-Web also supports access code control. Your website can only be accessed when the user enters the access code, otherwise it cannot be used normally. The specific operation methods are as follows

<table data-header-hidden><thead><tr><th width="109.66666666666669"></th><th width="408"></th><th></th></tr></thead><tbody><tr><td><strong>Step</strong></td><td><strong>Description</strong></td><td><strong>Screenshot</strong></td></tr><tr><td>1</td><td>Find "settings" in the project - " Environment Variables "<br></td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FU1wJpD8nT0nA0W8UJ0Dp%2Fimage.png?alt=media&#x26;token=264d6add-2f27-4260-be4a-d7437cb76c8f" alt=""></td></tr><tr><td>2</td><td>Fill in the key position <code>NEXT_PUBLIC_GUEST_KEY</code></td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2F3GJYEusGZMYTl1tIkzSW%2Fimage.png?alt=media&#x26;token=89a7a247-4de1-40b2-9005-62cad351ce62" alt=""></td></tr><tr><td>3</td><td>Fill in your access code in the Value position, such as <code>abcde</code> , and click "save" to save<br></td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FopVmKzeBsGyyBxAC8uAI%2Fimage.png?alt=media&#x26;token=6c0f3d30-b5d0-44a6-a226-eecf9d905fa5" alt=""></td></tr><tr><td>4</td><td>Click Project to go to the page, then click Page</td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2Fpspsd0FFDAUW69oN3HjS%2Fimage.png?alt=media&#x26;token=94dc9130-9d19-430c-acdf-5079832e6fd5" alt=""></td></tr><tr><td>5</td><td>Click redeploy and redeploy (it will not affect the previous data).</td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FxZQrJIo4AZrNqrpCgT5Y%2Fimage.png?alt=media&#x26;token=b1609257-e127-41b0-8142-2afcb8aab9a0" alt=""></td></tr><tr><td>6</td><td>At this time, the access code will take effect, and it can only be used if you enter the access code on the setting page</td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FgtEx5XsMC72VRPdn1wt6%2Fimage.png?alt=media&#x26;token=d88ecaf5-6b7e-4367-8fdf-eb8fa60a5395" alt=""></td></tr></tbody></table>

### Binding domain name

Through website deployment, we can already have our own AutoGPT website at this time, but we still need to go over the wall to access it. What should we do? Very simple, bind a domain name, we next enter the step of registering the bound domain name

<table data-header-hidden><thead><tr><th width="112.66666666666669"></th><th width="416"></th><th></th></tr></thead><tbody><tr><td><strong>Step</strong></td><td><strong>Description</strong></td><td><strong>Screenshot</strong></td></tr><tr><td>1</td><td>Enter the name and register. https://www.name.com/zh-cn/<br></td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FeARfJObTIX4aO4BvCMos%2Fimage.png?alt=media&#x26;token=9fa8994b-1d30-48ac-8b7f-3cb8913d6e5f" alt=""></td></tr><tr><td>2</td><td><p>Enter the domain name you want to register, search for it, and add it to the shopping cart</p><p>We can pick some non-com end of the domain name, the price will be cheaper, generally 10-20 yuan can be</p></td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FHkLjsCDYJ6NUcwHaahxZ%2Fimage.png?alt=media&#x26;token=e4b287d2-9853-422c-84b0-f4a3c392f396" alt=""><br></td></tr><tr><td>3</td><td>Click the shopping cart in the upper right corner of the page to enter the domain name purchase process<br></td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2Fjd67V5mvZWWkD0deCeZ6%2Fimage.png?alt=media&#x26;token=29563899-889f-42cc-b3d5-5a9d2594c4c4" alt=""></td></tr><tr><td>4</td><td><p>"Advanced Security + Privacy" generally does not need to be deleted, so the cost will be less</p><p>Purchase this is mainly used to hide the domain name information, others will not see your personal information when checking the domain name, generally not a large domain name, there is no need to buy</p></td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FxiXY2Foi2B3FClXtZhKq%2Fimage.png?alt=media&#x26;token=49328b06-8960-4aec-b926-c8978de34918" alt=""></td></tr><tr><td>5</td><td><p>Click Pay and then pay with Alipay</p><p>Note: the first time to buy the need to fill in some domain name owner information, according to the requirements to fill in just fine, do not fill in very real</p></td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FhIsN2Mo5xeWjYoXKCR6n%2Fimage.png?alt=media&#x26;token=240ee00d-83bf-4c84-a304-33d3013d5390" alt=""></td></tr><tr><td>6<br></td><td><p>After the payment is completed, return to the previous successful deployment page and click "add domains"It doesn't matter if this page is gone. Find this project on the vercel homepage, then click settings, then click domains, it's the same</p><p><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FihuFKa7XEDq5EYglcShB%2Fimage.png?alt=media&#x26;token=28be8c47-0cd5-49a1-b709-8262a271fa1b" alt=""></p></td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2F1VsTMHK3R6YNOUyXtiOS%2Fimage.png?alt=media&#x26;token=03d111d5-038a-4aaa-ac7d-c01cfd6ec18b" alt=""><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2F0xSM5JgjtxkhgF6T0nxE%2Fimage.png?alt=media&#x26;token=888c7fb9-b582-4b0e-b234-bbb26298809f" alt=""></td></tr><tr><td>7</td><td>Enter the domain name you just purchased and click "add"<br></td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2Fnq3swqQrv2fLZQrciHYY%2Fimage.png?alt=media&#x26;token=93a7d77d-11b0-4e4d-b58b-3a0d0a8f7d82" alt=""></td></tr><tr><td>8</td><td>Select the first one and click "add"</td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FwA18OWe7bJdOcBO7RPZO%2Fimage.png?alt=media&#x26;token=6e11071f-d0f5-46f6-89c7-1ec69962d0bf" alt=""></td></tr><tr><td>9</td><td>At this time, you will encounter an error, don't panic, this is normal, because you have not added domain name resolution<br></td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FFElLRlIoa44N2sSNypTy%2Fimage.png?alt=media&#x26;token=2861350d-18cc-402d-970d-605fe4656f71" alt=""></td></tr><tr><td>10</td><td>Go back to the website where we just registered the domain name, click "my domains", then find the domain name we just registered and click<br></td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FWJ3dIHgDGlAGFO8Dk7eB%2Fimage.png?alt=media&#x26;token=706954d8-201d-4b46-8b37-f42003103909" alt=""></td></tr><tr><td>11</td><td>Go to the domain name details page and find the DNS resolution entrance</td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FnH5xNT00gkGtU5ZiS1Vs%2Fimage.png?alt=media&#x26;token=e38b8e93-015c-416c-9a79-06c187db89b9" alt=""></td></tr><tr><td>13</td><td>On the domain name resolution page, enter the resolution record that you need to add in step "9", as shown in the figureNote: The second parsed value needs to be removed from the last point and turned into " cname.vercel-dns.com " when filling in, otherwise it will not be added<br></td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FYepAINAF65P5pqU4bWXb%2Fimage.png?alt=media&#x26;token=aceaf12d-da6e-4f53-b5b4-9a716382b2ed" alt=""></td></tr><tr><td>14</td><td>Back to the deployment page https://vercel.com , wait for the system to automatically update the domain name resolution , usually takes 1-15 minutes, please wait patiently, after the resolution is successful, the red box will be displayed ✅<br></td><td><img src="https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2FA2Ll9Wcz4zv519asmVd9%2Fimage.png?alt=media&#x26;token=b01a94df-ed35-45a8-a23a-885c1ee1c72c" alt=""></td></tr></tbody></table>

### Complete the build

All the construction work has been completed.enjoy it

![](https://2716520366-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FsGML6P4f61r7yqdkdFku%2Fuploads%2Fy11SjrNKIjXjNfTDatGk%2Fimage.png?alt=media\&token=930be2ed-2dd6-4e84-a848-5c75fe982bf4)