a6be956b-4a52-45bd-b1a6-8b08d5a87faf-launch-video-thumb.png

What is Contentstack Launch?

All headless web projects require hosting. Launch is a framework-agnostic hosting solution that is part of the Contentstack platform. It is a great solution for lightning-fast web experiences and is pre-integrated into Contentstack's CMS.<ul><li>Launch is a platform that hosts and deploys websites developed using the Contentstack CMS. By creating a project in Launch and connecting it to your GitHub repository, you can simplify your web development workflow. Launch efficiently selects the code from your repository and promptly deploys your website, resulting in&nbsp;no downtime.</li><li>To enhance your projects' functionality and facilitate testing and debugging, Launch enables you to incorporate custom domains, serverless functions, and environment variables.</li><li>Moreover, Launch seamlessly integrates with Automation Hub, offering triggers and actions for various Launch operations. Additionally, Launch provides deploy hooks functionality, enabling you to initiate rebuilds by accessing a specific URL. </li></ul>Note:&nbsp;To create and launch a project in Contentstack, please ensure that you have the necessary permissions within the Contentstack organization. Specifically, you must be assigned either the "Admin" or "Owner" role in the organization. Launch can be found in the leftmost navigation at the organizational level in Contentstack. <img src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/blt6f6d36e1296b3966/67dd8825efd8a9b4474c01b7/LaunchFoundations_L1_img-1.png" alt="LaunchFoundations_L1_img-1.png" height="auto"/>

f129e6c5-0216-4502-a088-b47de689489c-images.png

This lesson will show you how to deploy a Gatsby site using using Contentstack's front end hosting product, Launch.

Setting up Launch with Gatsby

e23bf927-eb26-4360-b679-e7641710482f-images.jpeg

This lesson covers deploying a NextJS site using Contentstack's front end hosting solution, Launch.

Setting up Launch with NextJS

This lesson explains how to host a project from a file upload using Contentstack's front end hosting, Contentstack Launch.

Setting up Launch Using File Upload

<h1></h1>Steps<ol><li>Click the Settings icon in the left navigation menu.</li></ol><img src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/blt28febba44d67aa3b/67dd8d3ba714586cc0b9b6ba/LaunchFoundations_L5_img-1.png" alt="LaunchFoundations_L5_img-1.png" height="auto"/>2. In the General section, click the Delete button under Advanced.<img src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/blta6426f8bbc143ee3/67dd8d50c9b8d4bdc9d142e5/LaunchFoundations_L5_img-2.png" alt="LaunchFoundations_L5_img-2.png" height="auto"/> 3. In the modal that appears, enter DELETE and then click the Yes, Delete button. This deletes your project successfully. <img src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/blt5a0ea31016d9d1d2/67dd8d70b1a1f321e23ef972/LaunchFoundations_L5_img-3.png" alt="LaunchFoundations_L5_img-3.png" height="auto"/>

Deleting a Launch Project

<h2>Deployments</h2>
During the deployment phase, your project is built and, if successful, made available through a unique URL. A deployment is an environment in action. There can be multiple deployments in a single environment, out of which the active deployment uses the latest environment configuration to build the website.
This module provides comprehensive information on your Deployments screen, including: - Deployment details - Deployment statuses - LogsLet's explore the module to access these features and gain insights into your deployments. When you import a project from a Git repository, your Deployment Information panel will look like this: <img src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/blt177b60211c208321/67dd8db02d0b9822d3fd0767/LaunchFoundations_L6_img-1.png" alt="LaunchFoundations_L6_img-1.png" height="auto" /> 
 When you import a project by uploading a .zip file, your Deployment Information panel will look like this: 
<img src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/bltbd9d75bdcbcfd5c5/67dd8dd437e25a43121e4737/LaunchFoundations_L6_img-2.png" alt="LaunchFoundations_L6_img-2.png" height="auto" /> Deployment Information
In the Deployment Information section, you can access essential details regarding your project's deployment.
If you created your project using a Git repository, this panel provides the following information:
<ul>
 <li>
 
 URL: Once your project is successfully built, you can access it through this public URL.
 
 </li>
 <li>
 
 Branch: Indicates the specific branch and commit of the Git repository used to create the environment.
 
 </li>
 <li>
 
 Git Repository: Displays the Git repository that was utilized to create your project.
 
 </li>
 <li>
 
 Created: Shows the timestamp when the deployment was initiated.
 
 </li>
 <li>
 
 Redeploy button: By clicking this button, you can trigger a rebuild of the project. Upon a successful rebuild, the updated version will be accessible via the deployment URL. 
 
 </li>
</ul>

<img src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/bltfafe167ee4993241/67dd8dee443bd6ca61f1cc3c/LaunchFoundations_L6_img-3.png" alt="LaunchFoundations_L6_img-3.png" height="auto" /> If you created your project by uploading a file, the Deployment Information panel provides the following details about your deployment:

<ul>
 <li>
 URL: Once the project has been successfully built, you can access it through this public URL.
 </li>
 <li>
 Created: Indicates the timestamp when the project build was successful.
 </li>
 <li>
 Redeploy button: Clicking this button triggers a rebuild of the project. Upon a successful rebuild, the updated build becomes available at the deployment URL.
 </li>
 <li>
 
 Download Code button:&nbsp;This feature allows you to download the code used for creating your project in a .zip file format. Please note that the Download Code button is visible only when the deployment status is Active, Deployed, or Error. 
 <img src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/blt8ebea1e3b82adac4/67dd8e05339f299b4f8b61f4/LaunchFoundations_L6_img-4.png" alt="LaunchFoundations_L6_img-4.png" height="auto" />
 
 
 </li>
</ul>
 On successful deployment, Launch also generates a preview image of your site that can be viewed on the deployment information panel 

<img src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/blt20cc76c819867425/67dd8e29314d67ea021b70de/LaunchFoundations_L6_img-5.png" alt="LaunchFoundations_L6_img-5.png" height="auto" /> Deployment Statuses The different project deployment statuses used in Launch are: 

<table>
 <thead>
 <tr>
 <th>Code</th>
 <th>Status</th>
 <th>What it means?</th>
 </tr>
 </thead>
 <tbody>
 <tr>
 <td>
 
 <img width="24" alt="LaunchFoundations_L6_icon-1.png" src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/bltf00a01fd82ce83d3/67dd9074632b933faad4a366/LaunchFoundations_L6_icon-1.png" height="24" style="width: 24px; height: 24px;" />
 
 </td>
 <td>
 Live
 </td>
 <td>
 Deployment is successful and is currently active.
 </td>
 </tr>
 <tr>
 <td>
 
 <img width="24" alt="LaunchFoundations_L6_icon-2.png" src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/blt8d04d5b038f8dba1/67dd904fc5b83e8a7f924ce4/LaunchFoundations_L6_icon-2.png" height="24" style="width: 24px; height: 24px;" />
 
 </td>
 <td>
 Deployed
 </td>
 <td>
 Previous deployment which was successful.
 </td>
 </tr>
 <tr>
 <td>
 
 <img width="24" alt="LaunchFoundations_L6_icon-3.png" src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/blteafa5f5838af6107/67dd902edb243f2f5a12c470/LaunchFoundations_L6_icon-3.png" height="24" style="width: 24px; height: 24px;" />
 
 </td>
 <td>
 Failed
 </td>
 <td>
 Deployment is unsuccessful.
 </td>
 </tr>
 <tr>
 <td>
 
 <img width="24" alt="LaunchFoundations_L6_icon-4.png" src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/blt4ec4971be3647c04/67dd9008c5b83ec83b924cdc/LaunchFoundations_L6_icon-4.png" height="24" style="width: 24px; height: 24px;" />
 
 </td>
 <td>
 Deploying
 </td>
 <td>
 Deployment is in progress.
 </td>
 </tr>
 <tr>
 <td>
 
 <img width="24" alt="LaunchFoundations_L6_icon-5.png" src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/blt1386b3930df17024/67dd8fca37e25ac4f61e4771/LaunchFoundations_L6_icon-5.png" height="24" style="width: 24px; height: 24px;" />
 
 </td>
 <td>
 Canceled
 </td>
 <td>
 Deployment is canceled due to deployment build hours limits.
 </td>
 </tr>
 <tr>
 <td>
 
 <img width="24" alt="LaunchFoundations_L6_icon-6.png" src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/blt1c88a99896860180/67dd8faef7eccc502090d9d6/LaunchFoundations_L6_icon-6.png" height="24" style="width: 24px; height: 24px;" />
 
 </td>
 <td>
 Queued
 </td>
 <td>
 Deployment is queued due to an ongoing deployment in the environment, waiting for it to finish.
 </td>
 </tr>
 <tr>
 <td>
 
 <img width="24" alt="LaunchFoundations_L6_icon-7.png" src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/blt02a98307fc621b46/67dd8f7a1bae685ef84c7727/LaunchFoundations_L6_icon-7.png" height="24" style="width: 24px; height: 24px;" />
 
 </td>
 <td>
 Skipped
 </td>
 <td>
 Already queued deployment is skipped to queue a new deployment.
 </td>
 </tr>
 </tbody>
</table>
 
<h2>Redeploys</h2>
You have the flexibility to redeploy your site multiple times, generating new deployments. There are several methods to initiate a redeployment:
1.&nbsp;Automatic Redeployment: &nbsp; &nbsp;- If auto-deploy is enabled for your environment, you can trigger a redeployment by pushing a commit to the corresponding Git branch.
2.&nbsp;Deploy Hook: &nbsp; &nbsp;- You can initiate a redeployment by calling a deploy hook generated for the environment. This method provides a way to programmatically trigger the redeployment process.
3.&nbsp;Redeploy Button: &nbsp; &nbsp;- On the deployment information page, you can simply click the "Redeploy" button to start a redeployment manually.
If you choose to redeploy from the deployment details page or utilize a deploy hook, you have the option to specify a commitId, which allows you to redeploy using a specific commit. This provides finer control over the redeployment process. 
<img src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/blt463953e4c9cc10cb/67dd8e47443bd62a6af1cc41/LaunchFoundations_L6_img-6.png" alt="LaunchFoundations_L6_img-6.png" height="auto" /> When you import a project by uploading a file, redeploying without a commitId is possible. In this scenario, when you click the "Redeploy" button, you will be presented with the following options to initiate the redeployment:

1. Redeploy with Previously Uploaded File: &nbsp; &nbsp;- This option allows you to redeploy using the file that was previously uploaded during the project import. You can choose this option if you want to redeploy using the same file without any modifications.
2. Redeploy by Uploading a New File: &nbsp; &nbsp;- Alternatively, you can select this option if you wish to redeploy by uploading a new file. This option enables you to replace the existing file with a new version for the redeployment.
It's important to note that if you imported the project by uploading a file, you do not need to provide a commitId for the redeployment process. 
<img src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/blt014cd96394baf2f7/67dd8e5d782bfbc82b6f5740/LaunchFoundations_L6_img-7.png" alt="LaunchFoundations_L6_img-7.png" height="auto" />

 Note: You cannot redeploy a site while a deployment is in progress.
<h2>Deployment Queuing Mechanism for an Environment</h2>
In Launch, you can redeploy your project multiple times. But when multiple subsequent deployments are triggered for a given environment, all intermediate deployments will be skipped and only the latest deployment will take effect.
<h2>Deployment Logs</h2>
You can find deployment logs in the Logs below Deployment Information. You can monitor the logs to get the details of the following deployment stages:
<ul>
 <li>
 Installing the dependencies
 </li>
 <li>
 Build creation
 </li>
 <li>
 Cloud Functions
 </li>
 <li>
 
 Success/failure of the deployment
 
 </li>
</ul>
You can also copy the log details by clicking the copy icon in the top-right corner of&nbsp;Logs. 
<img src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/blt93cecb722f01d56b/67dd8e725e486d247871b711/LaunchFoundations_L6_img-8.png" alt="LaunchFoundations_L6_img-8.png" height="auto" />

 
<h1>Disable Automatic Redeployment</h1>
All environments in Launch are configured for automatic redeployment by default. Launch allows you to prevent automatic deployments of any new commits made to the Git repository based projects. Follow the steps to disable the Auto-Deploy feature to prevent automatic redeployment.

 <img alt="Launch-DisableAutoRedeploy-Configure.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt7b367b8929f55fce/643662d62673c111da708c64/Launch-DisableAutoRedeploy-Configure.png" width="100"/> Alternatively, in the Environments screen, hover over the&nbsp;environment&nbsp;where your project is created and then click the&nbsp;Environment Settings&nbsp;icon to go to Environment Settings.
<ol>
 <li>
 Click the project card to open your project from the Launch landing page.
 </li>
 <li>
 In the Environments screen, click the&nbsp;environment&nbsp;where you created the project.
 </li>
 <li>
 Click the&nbsp;ellipses&nbsp;next to Default and then click&nbsp;Configure.
 </li>
 <li>
 In the Environments section under Settings, click&nbsp;Deployments. <img src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/blt5310398a6a3c1ac1/67dd8eaf632b93c31ad4a348/LaunchFoundations_L6_img-9.png" alt="LaunchFoundations_L6_img-9.png" height="auto" />
 
 
 </li>
 <li>
 Click the&nbsp;Auto Deploy&nbsp;toggle button to disable it, and then click the&nbsp;Save&nbsp;button. <img src="https://images.contentstack.io/v3/assets/bltebc53cfaf0dd6403/blt55f28cd36d92b5c7/67dd8ecbdb243feb7312c452/LaunchFoundations_L6_img-10.png" alt="LaunchFoundations_L6_img-10.png" height="auto" /> 
 
 
 </li>
</ol>
 You have successfully disabled the automatic redeployment of your project.

Launch Deployments

<h2>Launch Environments</h2>
Environments allow you to deploy and host different versions of your project independently.
Launch allows you to set up multiple environments for a project, which you can configure to match your development style. Each environment is deployed and hosted on a unique URL. Auto-deploy is enabled by default for every environment.
A default environment is created with every project import. You can configure the environment as per your needs for further usage.
This document guides you through the process of creating, configuring, and deleting an environment in Launch.
<h2>Prerequisites</h2>
<ol>
 <li>
 <a href="https://www.contentstack.com/login/">Contentstack account</a>
 </li>
 <li>
 Access to Launch for your organization
 </li>
</ol>
<h2>Create an Environment</h2>
<ol>
 <li>
 Click the project card to open your project from the Launch landing page. &nbsp;<img alt="Launch_-_Projects.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt4a98e187b26f92e0/643e30f71a1ec621c9be6010/Launch_-_Projects.png" width="100"/> 
 </li>
 <li>
 In the Environments screen, click the&nbsp;+ New Environment&nbsp;button to add a new environment.&nbsp; <img alt="Launch-Env_Screen-New_Env.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/bltffe2f7d8df3b3ac2/643fc3adab59a227af420039/Launch-Env_Screen-New_Env.png" width="100" height="auto" max-width="100" style="width: 100;height: auto;max-width: 100px;"/> 
 </li>
 <li>
 In the&nbsp;Create New Environment&nbsp;modal, fill in the following:
 <ol>
 <li>
 If you choose GitHub to deploy your project, follow the steps below:
 <ol>
 <li>
 Enter an environment name.
 </li>
 <li>
 Select a branch from the&nbsp;Git Branch&nbsp;dropdown.
 </li>
 <li>
 The fields in the&nbsp;Build and Output Settings&nbsp;section get auto-populated based on the detected framework. You can always change the&nbsp;Framework Preset&nbsp;and the build and output commands as per your requirement.<img alt="Launch-Create-Env-Git-BuildandOutput.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt59fada371ac34bcb/643fc3adb1f4db27b0204145/Launch-Create-Env-Git-BuildandOutput.png" width="100"/> 
 </li>
 <li>
 In the&nbsp;Environment Variables&nbsp;field, perform the following:
 <ul>
 <li>
 If you want to&nbsp;<a href="https://www.contentstack.com/docs/developers/launch/auto-populate-environment-variables-from-a-linked-stack/">auto-populate environment variables from a linked stack</a>, select a stack and click the&nbsp;Import Variables&nbsp;button.
 </li>
 <li>
 Click the&nbsp;+ Add Environment Variable&nbsp;button to manually add environment variable(s).&nbsp; <img alt="Launch-Create-Env-Env-Variables.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt523fe31b486c6442/643fc3addfdb9232fd8bb0cd/Launch-Create-Env-Env-Variables.png" width="100"/>
 </li>
 </ul>
 
 </li>
 <li>
 Click the&nbsp;Create&nbsp;button.
 You have successfully created an environment. 
 
 </li>
 </ol>
 
 </li>
 <li>
 If you choose to upload a file to deploy your project, follow the steps below:
 <ol>
 <li>
 Enter an environment name.
 </li>
 <li>
 The&nbsp;Upload a file&nbsp;field allows you to browse and upload a new file. Click&nbsp;browse to upload&nbsp;to upload a project file. You can also re-upload a different file after uploading a file.&nbsp; <img alt="Launch-Create-Env-File-UploadFile.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt8e5e9a3bc26db3aa/643fc3ad3e745b11edf82044/Launch-Create-Env-File-UploadFile.png" width="100"/> 
 </li>
 <li>
 The fields in the&nbsp;Build and Output Settings&nbsp;section get auto-populated based on the detected framework in the uploaded file. You can always change the&nbsp;Framework Preset&nbsp;and the build and output commands as per your requirement.&nbsp; <img alt="Launch-Create-Env-File-BuildandOutput.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/bltf82bbcb2d2c6e665/643fc3ad9074ca2928c7a12b/Launch-Create-Env-File-BuildandOutput.png" width="100"/> 
 </li>
 <li>
 In the&nbsp;Environment Variables&nbsp;field, perform the following:
 <ul>
 <li>
 If you want to&nbsp;<a href="https://www.contentstack.com/docs/developers/launch/auto-populate-environment-variables-from-a-linked-stack/">auto-populate environment variables from a linked stack</a>, select a stack and click the&nbsp;Import Variables&nbsp;button.
 </li>
 <li>
 Click the&nbsp;+ Add Environment Variable&nbsp;button to manually add environment variable(s).&nbsp; <img alt="Launch-Create-Env-Env-Variables.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt523fe31b486c6442/643fc3addfdb9232fd8bb0cd/Launch-Create-Env-Env-Variables.png" width="100"/>
 </li>
 </ul>
 
 </li> 
 <li>
 Click the&nbsp;Create&nbsp;button.
 You have successfully created an environment. 
 
 </li>
 </ol>
 Note: When you import a project by uploading a file, the icon for Branch specification is not displayed in the Environments section. 
 <h2>Configure an environment</h2>
 You can change the environment name and branch from&nbsp;Settings.
 Note: When you import a project by uploading a file, the Git Branch section in the General settings is not available.
 You can configure environments to use deploy hooks, custom domains, and environment variables. You can control the deployment behavior by toggling auto-deployments.
 <ol>
 <li>
 In the Environments screen, hover over the&nbsp;environment&nbsp;where your project is created and then click the&nbsp;Environment Settings&nbsp;icon to go to Environment Settings.&nbsp; <img alt="Launch-Env_Settings.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt4411ebf033dcd7c5/643e9879e8b191595dde432a/Launch-Env_Settings.png" width="100"/> 
 </li>
 <li>
 Edit the environment name and branch. <img alt="Launch_Environments_Name_Branch.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/bltb44324eff9ad0522/64a65dafb62fa4579aab8548/Launch_Environments_Name_Branch.png" width="100"/>
 </li>
 <li>
 Click the&nbsp;Save&nbsp;button.
 </li>
 </ol>
 Note: The auto-deployment feature is unavailable when you import a project by uploading a file.
 
 <h2>Delete an environment</h2>
 Launch allows you to delete an environment that you no longer require.
 Follow the steps below to delete an environment:
 
 <ol>
 <li>
 In the Environments screen, hover over the&nbsp;environment&nbsp;you want to delete and click the&nbsp;Delete Environment&nbsp;button. <img alt="Launch_Environments_DeletePart2SS1.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt12bd365863f4029a/64a65daf7b26df745ce167c6/Launch_Environments_DeletePart2SS1.png" width="100"/> 
 </li>
 <li>
 Enter&nbsp;DELETE&nbsp;and then click the&nbsp;Yes, Delete&nbsp;button. 
 </li>
 </ol>
 Alternatively, you can follow the steps below to delete an environment:
 A modal is displayed asking for confirmation to delete the environment. 
 
 Note: On deleting an environment, its corresponding deployments also get deleted.
 <ol>
 <li>
 In the Environments screen, hover over the&nbsp;environment&nbsp;you want to delete and click the&nbsp;Environment Settings&nbsp;icon to go to Environment Settings. <img alt="Launch_Environments_Settings.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt07afb18cce01cfff/64a65daf05df43c8a75ae6f3/Launch_Environments_Settings.png" width="100"/> 
 </li>
 <li>
 Under Advanced in the Environments section, click the&nbsp;Delete Environment&nbsp;button.
 You will see a warning message displayed above the button. 
 
 </li>
 <li>
 Enter&nbsp;DELETE&nbsp;and then click the&nbsp;Yes, Delete&nbsp;button.
 </li>
 </ol>
 
 
 </li>
 </ol>
 
 </li>
</ol>

Launch Environments

<h2>Setup Production and Non-Production Environment</h2>
When apps are being developed and released, software developers use environments to create stages. As per industry standards for environments most of the processes begin with development and end with production.
Launch allows you to create such environments.
<h2>Prerequisites</h2>
<ol>
 <li>
 <a href="https://www.contentstack.com/login/">Contentstack account</a>
 </li>
 <li>
 Access to Launch for your organization
 </li>
</ol>
<h2>Create a Production Environment</h2>
Follow the steps to convert the Default environment of a project to production environment.
<ol>
 <li>
 From the Launch landing page, open the project for which you want to change the Default environment to production environment. <img alt="Launch_-_Projects.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt4a98e187b26f92e0/643e30f71a1ec621c9be6010/Launch_-_Projects.png" width="100" /> 
 </li>
 <li>
 In the Environments screen, click the&nbsp;Default&nbsp;environment.
 </li>
 <li>
 Click the&nbsp;ellipses&nbsp;next to Default and then click&nbsp;Configure. <img alt="Launch-Prod-NonProd-Ellipses.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/bltae6f59972f5fb194/6436630eb2ef0d11ecea0238/Launch-Prod-NonProd-Ellipses.png" width="100"/>
 Note: You can also create a new environment for production by following the steps in the Create an Environment section in&nbsp;<a href="https://www.contentstack.com/docs/developers/launch/environments">this</a>&nbsp;guide. Then, proceed with the following steps to configure the environment to set it up as a production environment.
 
 </li>
 <li>
 In Environments under Settings, click&nbsp;General&nbsp;and enter&nbsp;Production&nbsp;as the Environment Name. <img alt="Launch_Prod_Non-Prod_Env.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt2e09a601ddeb9295/64a662f08f332a4b6454449c/Launch_Prod_Non-Prod_Env.png" width="100"/>
 </li>
 <li>
 Click the&nbsp;Save&nbsp;button.
 </li>
 <li>
 Next, click&nbsp;Deployments. <img alt="Launch_Prod_Non-Prod_Env_Toggle.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/bltb2475c7ec17875a2/64a662f18f332a733a5444a0/Launch_Prod_Non-Prod_Env_Toggle.png" width="100"/>
 </li>
 <li>
 Click the&nbsp;Auto Deploy&nbsp;toggle to disable it, and then click the&nbsp;Save&nbsp;button.
 Note: For Git repository based projects, you can prevent the ‘Production’ environment from automatically deploying any new commits that you push.
 
 </li>
 <li>
 You can add a custom domain for your projects. Click&nbsp;Domains&nbsp;and click the&nbsp;+ New Custom Domain&nbsp;button, to&nbsp;<a href="https://www.contentstack.com/docs/developers/launch/custom-domain">add a custom domain</a>. <img alt="Launch_Prod_Non-Prod_Domain.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blta77205f1a562324c/64a662f01f8d5a64105871e3/Launch_Prod_Non-Prod_Domain.png" width="100"/> <img alt="Launch_Prod_Non-Prod_DomainModal.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blte676cc752a13de64/64a662f14d81434bd88fef0b/Launch_Prod_Non-Prod_DomainModal.png" width="100"/>
 </li>
 <li>
 Click the&nbsp;Environments&nbsp;icon in the left panel and then click the production environment you created to view the Deployments page. <img alt="Launch-Prod-NonProd-Deployments.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/bltcfd5b01a5a25bf48/6436630ecbf631109cafae8d/Launch-Prod-NonProd-Deployments.png" width="100"/>
 </li> 
 <li>
 
 </li>
</ol>
You have successfully set up a production environment for your projects. 
<h2>Create a Non-Production Environment</h2>
Follow the steps to create a non-production environment.
<ol>
 <li>
 Follow the steps provided in the Create an Environment section in&nbsp;<a href="https://www.contentstack.com/docs/developers/launch/environments">this</a>&nbsp;guide.
 Note: Make sure to add the Environment Name as per the non-production environment you want to create. For example, if you want to create a development environment, add the Environment Name as&nbsp;Development.
 
 </li>
 <li>
 Next, in Environments&nbsp;under Settings, click&nbsp;Deployments.
 </li>
 <li>
 Click the&nbsp;Auto Deploy&nbsp;toggle to enable it, and then click the&nbsp;Save&nbsp;button. <img alt="Launch_Prod_Non-Prod_Env_NonProdToggle.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt2ed933d4e776b114/64a662f14eb51c3c1035d981/Launch_Prod_Non-Prod_Env_NonProdToggle.png" width="100"/> Note: Skip this step if the Auto Deploy toggle is already enabled.
 </li>
</ol>
You have successfully set up a non-production environment for your projects.

Setting up Production and Non-Production Environments

<h2>Environment Variables</h2>
Environment Variables are key-value pairs configured outside your source code so that each value can change depending on the&nbsp;<a href="https://www.contentstack.com/docs/developers/launch/environments">Environment</a>.
Your source code can read these values to change behavior during the Build Step or Launch&nbsp;<a href="https://www.contentstack.com/docs/developers/launch/cloud-functions">Cloud Function</a>&nbsp;execution.
All values are visible to any user that has access to the Project. It is safe to use both non-sensitive and sensitive data, such as tokens.
Note: Changes to Environment Variables are not applied to previous deployments. They only apply to new deployments.
You can add environment variables while creating a new project or environment, or configure the environment variables later at&nbsp;Environments &gt; Settings &gt; Env. Variables.
<h2>Add Environment Variables</h2>
<ol>
 <li>
 Click the project card to open your project from the Launch landing page.
 
 
 </li>
 <li>
 In the Environments screen, click an existing environment or create a new environment. For this tutorial, we will add an environment variable to the ‘Default’ environment for the Contentstack API key. Hover over the&nbsp;Default&nbsp;environment and click the&nbsp;Settings&nbsp;icon to go to the Settings page.
 
 
 </li>
 <li>
 In Environments under Settings, click&nbsp;Environment Variables. <img alt="Launch_Env_Var_Navigate.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt5523d390422ee656/64a65d3eb62fa40371ab8544/Launch_Env_Var_Navigate.png" width="100"/> 
 </li> 
 <li>
 Under the&nbsp;Key Value Edit&nbsp;tab, enter the environment variable key and value. You can click the&nbsp;+ Add Environment Variable&nbsp;button to add additional environment variables.
 Note: You can add up to&nbsp;100&nbsp;environment variables per environment. 
 You can also add or edit environment variables in bulk in key-value format, separated by new lines by clicking the&nbsp;Bulk Edit&nbsp;tab. 
 An environment variable can be added in the key=value format, or an existing variable's key or value can be edited in the bulk edit mode. The updated environment variables will also be reflected in the Key Value Edit tab.
 The bulk edit mode allows you to paste code blocks with key=value pairs, thereby reducing the effort of individually entering environment variables in the key-value edit mode.
 
 </li>
 <li>
 Click the&nbsp;Save&nbsp;button.
 </li>
</ol>
Note: You must trigger a new deployment after adding/modifying environment variables. 
<h2>Auto-populate Environment Variables from a Linked Stack</h2>
Importing a Starter app or any application with Contentstack SDK requires adding key-value pairs of environment variables like&nbsp;CONTENTSTACK_API_KEY,&nbsp;CONTENTSTACK_DELIVERY_TOKEN, etc. Adding these environment variables manually is a tedious task.
Launch allows you to auto-populate the Environment Variables from your stack, by linking the stack to your project. This allows you to easily use the CMS environment variables while deploying your Launch project.
This step-by-step guide lets you link a stack to your project to auto-populate Environment Variables.
Note: This feature can also be used when creating or configuring an environment.
<h2>Prerequisites</h2>
<ol>
 <li>
 <a href="https://www.contentstack.com/login/">Contentstack account</a>
 </li>
 <li>
 Access to Launch for your organization
 </li>
</ol>
<h2>Steps for execution</h2>
Follow the steps to link a stack to your project:
<ol>
 <li>
 Click&nbsp;Launch&nbsp;in the left navigation panel, as shown below. <img alt="Launch-LinkedStack-LaunchIcon.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/bltd6795befb5942ba3/64354575c6373410f6840530/Launch-LinkedStack-LaunchIcon.png" width="100"/> 
 </li>
 <li>
 Click the&nbsp;+ New Project&nbsp;button. <img alt="Launch-New_Project.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt312818ae4f29de6b/643e70a6a39e8e5aa0f4588e/Launch-New_Project.png" width="100"/> 
 </li>
 <li>
 Select&nbsp;<a href="https://www.contentstack.com/docs/developers/launch/import-project-using-github">Import from a Git Repository</a>&nbsp;or&nbsp;<a href="https://www.contentstack.com/docs/developers/launch/import-project-using-file-upload">Upload a file</a>&nbsp;as usual from the&nbsp;Create New Project&nbsp;modal.
 </li>
 <li>
 In the&nbsp;Environment Variables&nbsp;section, click the&nbsp;Connect and Import Variables&nbsp;button. <img alt="Launch-LinkedStack-Connect_n_Import.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt17af4819d7fa38b3/6435082ceb41fa1100c83ad5/Launch-LinkedStack-Connect_n_Import.png" width="100"/> 
 </li>
 <li>
 Select the&nbsp;Stack&nbsp;which has the Starter app installed and then select the&nbsp;Delivery Token&nbsp;for your stack. <img alt="Launch-LinkedStack-Select_Stack_DeliveryToken.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blte2e9d91734b317c0/6435082d41f63e1131dec78c/Launch-LinkedStack-Select_Stack_DeliveryToken.png" width="100"/> Note: On selecting a delivery token, Launch automatically selects a Stack environment available for the selected token.
 </li>
 <li>
 Click the&nbsp;Import Variables&nbsp;button. <img alt="Launch-LinkedStack-Import_Variables.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt4490387c1d2ef2ad/6435082db2ef0d11ece9fee2/Launch-LinkedStack-Import_Variables.png" width="100"/> 
 You can see the Environment Variables auto-populated from your selected stack. 
 
 </li>
 <li>
 Click the&nbsp;Deploy&nbsp;button. <img alt="Launch-LinkedStack-Env_Var_List.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/bltc65752cd124d93c6/6435082dc3a87d1213a87a02/Launch-LinkedStack-Env_Var_List.png" width="100"/> 
 </li>
 <li>
 Your project is now deployed. <img alt="Launch-LinkedStack-Deployed.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt74a4e7e884cec340/6435082d8485c010da11a929/Launch-LinkedStack-Deployed.png" width="100"/>
 </li>
</ol>
<h2>View a linked stack</h2>
Follow the step to view the linked stack after project creation:
<ol>
 <li>
 Click the&nbsp;Settings&nbsp;icon in the left panel and then click&nbsp;Stack Integration&nbsp;to view the linked stack. <img alt="Launch-LinkedStack-StackIntegration.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blte9818b96b83a1c32/64a65eb4b7aec33465d889ad/Launch-LinkedStack-StackIntegration.png" width="100"/>
 </li> 
 <li>
 You can see the linked stack.
 
 
 </li>
</ol>
<h2>Update a linked stack</h2>
Follow the steps below to update a linked stack:
This will sync your new stack’s Environment Variables to your project.
<ol>
 <li>
 Click the&nbsp;Settings&nbsp;icon in the left panel and then click&nbsp;Stack Integration.
 </li>
 <li>
 Choose a stack from the dropdown and then click&nbsp;Connect Stack&nbsp;button. <img alt="Launch-LinkedStack-UpdateStack.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blte023ddf17b951c76/64a65eb44eb51cb4ed35d971/Launch-LinkedStack-UpdateStack.png" width="100"/> 
 </li>
 <li>
 Once you choose a different stack, you must sync the stack variables. To do this, follow the steps below:
 <ol>
 <li>
 Click&nbsp;Environments&nbsp;under Settings.
 </li>
 <li>
 Select your environment (Default&nbsp;in this example).
 </li>
 <li>
 Click&nbsp;Environment Variables.
 </li>
 <li>
 Click&nbsp;Sync Stack Variables.
 </li> 
 <li>
 A popup displays asking for your confirmation. Select your delivery token and then click the&nbsp;Yes, Proceed&nbsp;button. <img alt="Launch-LinkedStack-SyncStackProceed.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/bltb1c340082f87249f/6435082c6bfe3410b96a8ea7/Launch-LinkedStack-SyncStackProceed.png" width="100"/>
 </li>
 </ol>
 
 </li>
</ol>

Environment Variables

<h2>Setting up Custom Domains</h2>
By default, Launch generates a unique URL of the form&nbsp;example.contentstackapps.com&nbsp;for every environment. Each environment is assigned to a unique subdomain, e.g. example-environment.contentstackapps.com.
For users to easily access your site and remember your site address, you need a human-friendly domain name. You can add a custom domain name to your environment.
Note:&nbsp;Custom domains cannot be more than&nbsp;63 characters&nbsp;long. For example,&nbsp;example.com,&nbsp;example.org,&nbsp;subdomain.example.in
<h2>Add a Custom Domain</h2>
<ol>
 <li>
 Click the project card to open your project from the Launch landing page.&nbsp; <img alt="Launch_-_Projects.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt4a98e187b26f92e0/643e30f71a1ec621c9be6010/Launch_-_Projects.png" width="100"/> 
 </li>
 <li>
 In the Environments screen, click an existing environment or create a new environment. We will add a custom domain to the&nbsp;Default&nbsp;environment for this tutorial.
 </li>
 <li>
 Hover over the&nbsp;Default&nbsp;environment and click the&nbsp;Environment Settings&nbsp;icon to go to the Settings page.&nbsp; <img alt="Launch-Env_Settings.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt4411ebf033dcd7c5/643e9879e8b191595dde432a/Launch-Env_Settings.png" width="100"/> 
 </li>
 <li>
 Click&nbsp;Domains&nbsp;in the&nbsp;Environments&nbsp;section.&nbsp; <img alt="Launch-CustomDomains-Domains.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt413d8e2c3aa082f1/64a65cb5bd5d8a4d8a721355/Launch-CustomDomains-Domains.png" width="100"/> 
 </li>
 <li>
 Click the&nbsp;+ New Custom Domain&nbsp;button.
 </li>
 <li>
 Enter your custom domain host URL. For example -&nbsp;example.com
 </li>
 <li>
 Click the copy button to copy the A Record to your clipboard. A Records point to an IP address, usually the one for your hosting account. <img alt="Launch-CustomDomains-Modal.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/bltb55b9f822b2530db/64a65cb5f122ca8ff2e6a6e8/Launch-CustomDomains-Modal.png" width="100"/> 
 </li>
 <li>
 Click the&nbsp;Save&nbsp;button.
 </li>
 <li>
 Paste the copied A record to your domain provider platform.
 Below are some documentation links to common DNS providers for adding the A record.
 <ol>
 <li>
 <a href="https://in.godaddy.com/help/add-an-a-record-19238">Go-Daddy</a>
 </li>
 <li>
 <a href="https://www.bluehost.com/help/article/dns-management-add-edit-or-delete-dns-entries">Bluehost</a>
 </li>
 <li>
 <a href="https://www.namecheap.com/support/knowledgebase/article.aspx/319/2237/how-can-i-set-up-an-a-address-record-for-my-domain/">Namecheap</a> Depending on your domain provider, these changes can take up to 48 hours to take effect.
 </li>
 </ol>
 
 </li>
 <li>
 Click the&nbsp;Edit&nbsp;or&nbsp;Delete&nbsp;button to edit or delete the custom domains.&nbsp; <img alt="Launch-CustomDomains-EditDelete.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt467eb1bf2091d3e4/64a65cb58f332a585b544482/Launch-CustomDomains-EditDelete.png" width="100"/>
 </li>
</ol>
<h2> Add a Custom Subdomain&nbsp;</h2>
Launch allows you to add custom subdomains to your environments.&nbsp;
Follow the steps below to add a custom subdomain to your existing domain. In this example, we are creating a subdomain for the domain&nbsp;example.com&nbsp;which was created in the previous steps.
<ol>
 <li>
 Click the&nbsp;+ New Custom Domain&nbsp;button. <img alt="Launch-CustomDomains-SubDomain.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt7c451fd539aa8a68/64a65cb538fe4362c46ab857/Launch-CustomDomains-SubDomain.png" width="100"/> 
 </li>
 <li>
 In the&nbsp;Domain Name&nbsp;field, enter the subdomain name as given in the following format:&nbsp;. For example:&nbsp;app.example.com After entering the subdomain name, the DNS Details get auto-populated as shown below: <img alt="Launch-CustomDomains-SubDomain_Modal.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt7b9dfed7c1ff9772/64a65cb58f332aab62544486/Launch-CustomDomains-SubDomain_Modal.png" width="100"/> The Value field displays the default subdomain.
 Note:&nbsp;The DNS details are different for the apex domain and the custom subdomain.
 
 </li>
 <li>
 Click the copy button next to the&nbsp;Name&nbsp;and&nbsp;Value&nbsp;fields to copy the CNAME record details. <img alt="Launch-CustomDomains-SubDomain_Modal_CNAME.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt1867f7794c9a2bd3/64a65cb6ade08c96c8cb1697/Launch-CustomDomains-SubDomain_Modal_CNAME.png" width="100"/> 
 </li>
 <li>
 Paste the copied CNAME record details to your domain provider platform. Below are some documentation links to common DNS providers for adding the CNAME record:
 <ol>
 <li>
 <a href="https://in.godaddy.com/help/add-a-cname-record-19236">Go-Daddy</a>
 </li>
 <li>
 <a href="https://www.namecheap.com/support/knowledgebase/article.aspx/9646/2237/how-to-create-a-cname-record-for-your-domain/">Bluehost</a>
 </li>
 <li>
 <a href="https://www.namecheap.com/support/knowledgebase/article.aspx/9646/2237/how-to-create-a-cname-record-for-your-domain/">Namecheap</a>
 Depending on your domain provider, these changes can take up to 48 hours to take effect.
 
 </li>
 </ol>
 
 </li>
 <li>
 Click the&nbsp;+ Create Custom Domain&nbsp;button. You can see the newly created subdomain listed in the Domains page. <img alt="Launch-CustomDomains-SubDomains.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt63db2e44b992d86d/64a65cb6ad2e9fd93a0011b5/Launch-CustomDomains-SubDomains.png" width="100"/>
 </li>
</ol>

Setting up Custom Domains

<h2>Using Deploy Hooks</h2>
A deploy hook allows you to trigger a deployment using a unique URL.
The following are some of the example use cases for Deploy Hooks:
<ul>
 <li>
 Rebuilding your site to reflect changes in a Headless CMS
 </li>
 <li>
 Scheduling deployments with Cron Jobs
 </li>
</ul>
This document guides you through the process of creating, triggering, renaming, and deleting a deploy hook in Launch.
<h2>Prerequisites</h2>
<ol>
 <li>
 <a href="https://www.contentstack.com/login/">Contentstack account</a>
 </li>
 <li>
 Access to Launch for your organization
 </li>
 <li>
 A project already deployed in Launch
 </li>
</ol>

<h2>Create a Deploy Hook</h2>
Follow the steps given below to create a deploy hook in your project:
<ol>
 <li>
 From the Launch landing page, click the project card to open your project.
 </li>
 <li>
 In the Environments screen, hover over the&nbsp;environment&nbsp;where you created the project and then click the&nbsp;Environment Settings&nbsp;icon to configure the deploy hook. For this tutorial, we will be adding a deploy hook to the&nbsp;Default&nbsp;environment.
 
 
 </li>
 <li>
 In Environments under Settings, click&nbsp;Deploy Hooks.
 
 
 </li>
 <li>
 Click the&nbsp;+ New Deploy Hook&nbsp;button.
 </li>
 <li>
 Enter a name for your deploy hook.
 Note: The deploy hook name is for your reference. This name will display in your list of deploy hooks. 
 
 
 </li>
 <li>
 Click the&nbsp;Create Deploy Hook&nbsp;button. Launch provides you with a unique URL for this deploy hook.
 
 
 </li>
</ol>

<h2>Trigger a Deploy Hook</h2>
Follow the steps given below to trigger a deploy hook:
<ol>
 <li>
 Click the&nbsp;Environments&nbsp;icon in the left panel.
 </li>
 <li>
 Hover over the&nbsp;Default&nbsp;environment and click the&nbsp;Environment Settings&nbsp;icon to go to the Settings page.
 
 
 </li>
 <li>
 In Environments under Settings, click&nbsp;Deploy Hooks.
 </li>
 <li>
 Click the&nbsp;ellipses&nbsp;under Actions and then click&nbsp;Copy URL&nbsp;to copy the deploy hook URL.
 
 
 </li>
 <li>
 Send a&nbsp;POST&nbsp;request to this URL to trigger the deploy hook you created.
 Example Request curl -X POST
 https://cs-domain.com/Launch-path/manage/deploy/deploy-hook-id 
 Example Response
 { "message": "Deployment triggered successfully" }
 
 </li>
 <li>
 Click the&nbsp;Environments&nbsp;icon in the left panel and then go to your environment.
 </li>
</ol>
You will see that it has triggered a deployment successfully. 

 If you used a git repository to import your project, then by default, the deploy hook uses the latest commit from the git branch for the deployment.
<h2>Parameter used in a Deploy Hook</h2>
Deploy hooks accept the following optional URL query parameter:
<ul>
 <li>
 commit: Parameter that specifies which git commit to deploy on triggering the deploy hook.
 </li>
</ul>
Here's an example where a deploy hook URL uses the&nbsp;commit&nbsp;parameter: curl -X POST https://cs-domain.com/Launch-path/manage/deploy/h83y7hreohuuererh7343?commit=rbg734
The&nbsp;commit&nbsp;can be the full SHA or just the&nbsp;first seven characters&nbsp;of your full SHA.
Note: When you import a project by uploading a file, you should not pass the&nbsp;commit&nbsp;parameter.


<h2>Rename a Deploy Hook</h2>
Follow the steps given below to rename a deploy hook:
<ol>
 <li>
 Click the&nbsp;Environments&nbsp;icon in the left panel.
 </li>
 <li>
 Hover over the&nbsp;Default&nbsp;environment and click the&nbsp;Environment Settings&nbsp;icon to go to the Settings page.
 
 
 </li>
 <li>
 In Environments under Settings, click&nbsp;Deploy Hooks.
 
 
 </li>
 <li>
 Click the&nbsp;ellipses&nbsp;under Actions and then click&nbsp;Edit&nbsp;to edit the deploy hook URL.
 
 
 </li>
</ol>

<h2>Delete a Deploy Hook</h2>
Follow the steps given below to delete a deploy hook:
<ol>
 <li>
 Click the&nbsp;Environments&nbsp;icon in the left panel.
 </li>
 <li>
 Hover over the&nbsp;Default&nbsp;environment and click the&nbsp;Environment Settings&nbsp;icon to go to the Settings page.
 
 
 </li>
 <li>
 In Environments under Settings, click&nbsp;Deploy Hooks.
 
 
 </li>
 <li>
 Click the&nbsp;ellipses&nbsp;under Actions and then click&nbsp;Delete&nbsp;to delete the deploy hook URL.
 
 
 </li>
</ol>

<h2>Redeploy Automatically when Content is Published on CMS</h2>
Launch allows you to set up a site to redeploy automatically when its content is modified in the CMS.
Prerequisites
<ol>
 <li>
 <a href="https://www.contentstack.com/login/">Contentstack account</a>
 </li>
 <li>
 Access to Launch for your organization
 </li>
 <li>
 A site on Launch that fetches data from the CMS
 </li>
</ol>
<h2>Steps for execution</h2>
Follow the steps to redeploy automatically when content is published.
<ol>
 <li>
 Create a&nbsp;<a href="https://www.contentstack.com/docs/developers/launch/deploy-hooks">deploy hook</a>&nbsp;in Launch.
 </li>
 <li>
 Follow the steps to add the deploy hook as a Webhook to Contentstack CMS. <img alt="Launch_AutoRedeploy_CMS_Content_CopyURL.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt5812c201178618cb/64a65e74f5591f7bd0e5812f/Launch_AutoRedeploy_CMS_Content_CopyURL.png" width="100"/>
 <ol>
 <li>
 Copy the deploy hook URL.
 </li>
 <li>
 Go to your stack and then go to&nbsp;Settings &gt; Webhooks. <img alt="Launch-Auto_Redeploy-Webhooks.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt9553633720b751f0/6434fd345a10e41114ae9343/Launch-Auto_Redeploy-Webhooks.png" width="100"/> 
 </li>
 <li>
 Click the&nbsp;New Webhook&nbsp;button.
 </li>
 <li>
 In the&nbsp;Name&nbsp;field, enter a suitable name for the Webhook.
 </li>
 <li>
 In the&nbsp;URL To Notify&nbsp;field, paste the deploy hook URL. <img alt="Launch-Auto_Redeploy-URL_to_Notify.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt9c5c5c5e2cf1f312/6434fd3435650a1107644370/Launch-Auto_Redeploy-URL_to_Notify.png" width="100"/> 
 </li>
 <li>
 In the&nbsp;When&nbsp;field, enter the conditions for the deploy hook to trigger.
 </li>
 <li>
 Mark the&nbsp;Enable Webhook&nbsp;checkbox.
 </li>
 <li>
 Click the&nbsp;Save&nbsp;button. <img alt="Launch-Auto_Redeploy-Save.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blte4701ca95494da8b/6434fd33aa312f114ba7dfc9/Launch-Auto_Redeploy-Save.png" width="100"/> 
 </li>
 </ol>
 You will see the conditions updated on the deploy hook page in Launch. 
 
 </li>
 <li>
 Go to the entry where you want to make the update.
 </li>
 <li>
 Make the necessary updates, and click the&nbsp;Save&nbsp;button.
 </li>
 <li>
 Click the&nbsp;Publish&nbsp;button, select Environment(s) and Language(s), and then click the&nbsp;Send&nbsp;button. <img alt="Launch-Auto_Redeploy-PublishEntry.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blted5a225421cef7d3/6434fd33ab116a10dd6a4253/Launch-Auto_Redeploy-PublishEntry.png" width="100"/> On clicking&nbsp;Publish, the Webhook gets triggered and the project gets automatically redeployed in Launch.
 </li>
</ol>

Using Deploy Hooks

<h2>Setting up Cloud Functions</h2>
Launch cloud functions are a mechanism for you to provide backend functionality on your sites, and enable you to&nbsp;write,&nbsp;deploy, and&nbsp;run&nbsp;server-side code on-demand as API endpoints.
These functions are co-located with your frontend code and part of your Git workflow. As traffic increases, they automatically scale up and down to meet your needs.
Example use cases: CRUD operations with database, sending automated email, server-side input validation, etc.
You must code your functions in JavaScript and save them to the&nbsp;/functions&nbsp;directory in your project’s root folder.
The function endpoint is determined by its&nbsp;file path&nbsp;relative to&nbsp;/functions.
Each JavaScript file to be deployed as a cloud function must export a&nbsp;handler&nbsp;function with the following general syntax: 
export default function handler(request, response) { // your server-side functionality }
Example :
 // functions/hello.js export default function handler(request, response) { response.status(200).json({ body: request.body, &nbsp; query: request.query, &nbsp; cookies: request.cookies, }); } 
The above example returns the request body, path query, and cookies in JSON format.
This function runs when you visit the URL path:&nbsp;/hello
Sometimes you may want to place extra code files, such as&nbsp;utils.js, inside the&nbsp;/functions&nbsp;folder. To skip turning these files into serverless functions,&nbsp;default exporting&nbsp;from such files is not supported. Below is an example of a valid&nbsp;utils.js&nbsp;file that can be placed inside the&nbsp;/functions&nbsp;directory.
Example:&nbsp; 
 //functions/utils.js export function getShortName(name) { &nbsp; return name.slice(0, 3); } //functions/user.js import { getShortName } from "./utils" export default function handler(request, response) { &nbsp; const name = "Hilary"; &nbsp; const shortName = getShortName(name); &nbsp; response.status(200).send({ name, shortName}); }
<h2>Node.js Request and Response Objects</h2>
Each request to a Launch cloud function gets access to Request and Response objects.
These objects are the standard HTTP&nbsp;<a href="https://nodejs.org/api/http.html#class-httpincomingmessage">Request</a>&nbsp;and&nbsp;<a href="https://nodejs.org/api/http.html#class-httpserverresponse">Response</a>&nbsp;objects from Node.js.
<h3>Node.js Helpers</h3>
Additional helpers are provided inside the&nbsp;Request and Response objects passed to the function. These are:
<table>
 <thead>
 <tr>
 <th>Method</th>
 <th>Description</th>
 <th>Object</th>
 </tr>
 </thead>
 <tbody>
 <tr>
 <td>req.query</td>
 <td>
 An object containing the request's&nbsp;<a href="https://en.wikipedia.org/wiki/Query_string">query string</a>, or {} if the request does not have a query string.
 </td>
 <td>Request</td>
 </tr>
 <tr>
 <td>req.cookies</td>
 <td>
 An object containing the cookies sent by the request, or {} if the request contains no cookies.
 </td>
 <td>Request</td>
 </tr>
 <tr>
 <td>req.body</td>
 <td>
 An object containing the body sent by the request, or null if no body is sent.
 </td>
 <td>Request</td>
 </tr>
 <tr>
 <td>res.status(code)</td>
 <td>
 A function to set the status code sent with the response where the code must be a valid&nbsp;<a href="https://en.wikipedia.org/wiki/List_of_HTTP_status_codes">HTTP status code</a>. Returns res for chaining.
 </td>
 <td>Response</td>
 </tr>
 <tr>
 <td>res.send(body)</td>
 <td>
 A function to set the content of the response where the&nbsp;body&nbsp;can be a string, an object, or a Buffer.
 </td>
 <td>Response</td>
 </tr>
 <tr>
 <td>res.json(obj)</td>
 <td>
 A function to send a JSON response where the&nbsp;obj&nbsp;is the JSON object to send.
 </td>
 <td>Response</td>
 </tr>
 <tr>
 <td>res.redirect(url)</td>
 <td>
 A function to redirect to the URL derived from the specified path with status code&nbsp;307 Temporary Redirect.
 </td>
 <td>Response</td>
 </tr>
 <tr>
 <td>res.redirect(statusCode, url)</td>
 <td>
 A function to redirect to the URL derived from the specified path, with the specified&nbsp;<a href="https://en.wikipedia.org/wiki/List_of_HTTP_status_codes">HTTP status code</a>.
 </td>
 <td>Response</td>
 </tr>
 </tbody>
</table>
<h3>Request Body</h3>
The&nbsp;req.body&nbsp;property populates with a parsed version of the content sent with the request when possible, based on the value of the&nbsp;Content-Type&nbsp;header as follows:
<table>
 <thead>
 <tr>
 <th>Content-Type header</th>
 <th>Value of&nbsp;req.body</th>
 </tr>
 </thead>
 <tbody>
 <tr>
 <td>
 No header
 </td>
 <td>
 Undefined
 </td>
 </tr>
 <tr>
 <td>
 application/json
 </td>
 <td>
 An object representing the parsed JSON sent by the request.
 </td>
 </tr>
 <tr>
 <td>
 application/x-www-form-urlencoded
 </td>
 <td>
 An object representing the form data sent with the request.
 </td>
 </tr>
 <tr>
 <td>
 text/plain
 </td>
 <td>
 A string containing the text sent by the request.
 </td>
 </tr>
 <tr>
 <td>
 application/octet-stream
 </td>
 <td>
 A&nbsp;<a href="https://nodejs.org/api/buffer.html">Buffer</a>&nbsp;containing the data sent by the request.
 </td>
 </tr>
 </tbody>
</table>
When the request body contains malformed JSON, accessing&nbsp;req.body&nbsp;will throw an error. You can catch that error by wrapping&nbsp;req.body&nbsp;with&nbsp;try...catch:
try { const data = req.body; } catch (error) { &nbsp; res.status(400).json({ error: 'Invalid JSON in request body' }); }
<h3>Handling different HTTP methods</h3>
To handle different HTTP methods in a cloud function, you can use&nbsp;req.method&nbsp;in your handler as below:
export default function handler(req, res) { if (req.method === 'POST') { &nbsp; // Process a POST request &nbsp; } else { &nbsp; // Handle any other HTTP method } }
<h3>Execution Timeout</h3>
Launch cloud functions enforce a maximum execution timeout. This means that the function must respond to an incoming HTTP request before the timeout has been reached. The maximum execution timeout is&nbsp;60 seconds. If a request times out, the response error code would be&nbsp;500.
<h2>Dynamic API Routes using Path Segments</h2>
Deploying cloud functions with Launch also gives users the ability to use path segments as file names.
When using path segments, any dynamic filename can be used; this is indicated by the use of square brackets ( [ ] ).
Note: The filename for the path segment is used solely for the purpose of providing a key name for accessing the value on the&nbsp;req.query&nbsp;object.
Example:&nbsp;functions/user/[name].js
Here, the value passed for the path segment is made available to the&nbsp;req.query&nbsp;object under the key used for the filename(name).
 
// functions/user/[name].js export default function handler(request, response) { &nbsp; response.end(`Hello ${request.query.name}!`); }
Running the function on the endpoint&nbsp;/user/Jake&nbsp;will return the response as&nbsp;Hello Jake.
<h2>Environment Variables</h2>
Users can access environment variables inside the cloud functions.
Environment variables can be added by going to the corresponding environment’s&nbsp;Settings&nbsp;page on Launch.
Example:
export default async function handler(req, res) { const uri = process.env.DATABASE_URI; const client = new DBClient(uri); // perform database operations... res.status(200).send("Success"); }
Note: A new deployment must be triggered after adding/modifying environment variables.
<h2>Debugging Cloud Functions - Server Logs</h2>
The Server logs section displays real-time logs generated by the cloud functions from the latest deployment.
The logs in Server Logs are not persistent and will be cleared if you refresh the page or if you perform a different action on the same page

<h2>Running Cloud Functions Locally</h2>
You can run your Launch project Cloud Functions locally using the&nbsp;<a href="https://www.contentstack.com/docs/developers/cli/cli-for-launch/#functions">launch:functions</a>&nbsp;command in CLI.
<h2>Limitations</h2>
<ul>
 <li>
 Writing Cloud Functions using TypeScript is currently not supported.
 </li>
</ul>
 
<h2>Add API Endpoints to a Website in Launch</h2>
Launch allows you to write&nbsp;Cloud Functions&nbsp;to create API endpoints.
<h2>Steps for execution</h2>
Follow the steps to write a cloud function that can be used to add API endpoints to a website in Launch.
<ol>
 <li>
 Create a folder named&nbsp;/functions&nbsp;in your project’s root folder.
 </li>
 <li>
 Create a JavaScript file to code your functions and then save the file to the&nbsp;/functions&nbsp;folder.
 Example:
 // functions/users.js export default function handler(request, response) { const users = [ {name: "Jack", age: "25"}, {name: "Rick", age: "28"}, {name: "Jane", age: "34"}, ]; response.status(200).send(users); }
 
 </li> 
 <li>
 Deploy your project in Launch using one of the following methods:
 <ol>
 <li>
 <a href="https://www.contentstack.com/docs/developers/launch/import-project-using-github/">Import from a Git Repository</a>
 </li>
 <li>
 <a href="https://www.contentstack.com/docs/developers/launch/import-project-using-file-upload/">Upload a file</a>
 </li>
 </ol>After successful deployment, you will see the Cloud Functions displayed in the log: <img alt="Launch-API-CloudFunctions.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt8e73fd8278fa8ee0/6434ec539bfbdd10ae68fbcd/Launch-API-CloudFunctions.png" width="100"/> The function endpoint is determined by its&nbsp;file path&nbsp;relative to&nbsp;/functions. The function runs when you visit the path:&nbsp;/users.
 
 </li>
 <li>
 Copy the URL from the Deployment Information. <img alt="Launch-API-CopyURL.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt04770f8bf41ae29a/6434ec5250e4c910ff39749d/Launch-API-CopyURL.png" width="100"/> In this example, the URL of the API endpoint will be&nbsp;https://sample-test-api.devsampleapp.com/users.
 </li>
 <li>
 On sending a request to the API Endpoint, you will see the following response:
 
 [ { "name": "Jack", "age": "25" }, { "name": "Rick", "age": "28" }, { "name": "Jane", "age": "34" } ]
 
 </li>
</ol>

Setting up Cloud Functions

<h2>Password Protecting an Environment</h2>
Development, staging, and production environments refer to common stages of software development where an application or system is deployed and operated in isolated environments. Access to the development and staging environments is usually restricted from public access as it is in these environments that new features, code changes, and updates are tested, built, and validated before they are published on the web in the production environment.
The Password Protection feature of Contentstack Launch allows you to enable access restrictions to your development and staging environments in Launch using the&nbsp;<a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Authentication">Basic Auth</a>&nbsp;method in order to prevent them from being accessed by search engines and the public.
This document guides you through enabling and disabling password protection for your environments in Contentstack Launch.
Prerequisites
<ol>
 <li>
 
 <a href="https://www.contentstack.com/login/">Contentstack account</a>
 
 </li>
 <li>
 
 Access to Launch for your organization
 
 </li>
 <li>
 
 A project already deployed in Launch
 
 </li>
</ol>
Enable Password Protection for your Environment
Follow the steps below to enable password protection for your environment:
<ol>
 <li>
 
 From the Launch landing page, click the&nbsp;project card&nbsp;to open your project.
 
 </li>
 <li>
 
 In the Environments screen, hover over the&nbsp;environment&nbsp;for which you want to provide password protection, and click the&nbsp;Environment Settings&nbsp;icon. <img alt="Launch-PasswordProtection-EnvSettingsIcon.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt5464705313e0b649/64bb45d0361d391f07947100/Launch-PasswordProtection-EnvSettingsIcon.png" width="100"/>
 
 </li>
 <li>
 
 In Settings &gt; Environments, click the&nbsp;Password Protection&nbsp;tab. <img alt="Launch_Password_Protection_Nav.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt9350eca9beeee345/64bb45d01add4dd0bffbba34/Launch_Password_Protection_Nav.png" width="100"/> 
 
 </li>
 <li>
 
 Click the&nbsp;Enable Password Protection&nbsp;toggle button to enable it. <img alt="Launch_Password_Protection_Toggle_New.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt0c68c731c1a9346e/64c89cff0242c3ff50bb8992/Launch_Password_Protection_Toggle_New.png" width="100"/> 
 
 </li>
 <li>
 
 Enter a username in the&nbsp;Username&nbsp;field and password in the&nbsp;Password&nbsp;field for your current environment, not exceeding 200 characters each. <img alt="Launch_Password_Protection_UsernamePassword_New.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt5e89c769013d040c/64c89cff61d2875329856d9d/Launch_Password_Protection_UsernamePassword_New.png" width="100"/> Note: The username must not contain the colon (:) character.
 
 </li>
 <li>
 
 Click the&nbsp;Save&nbsp;button. Note: The protection is specific to the selected environment. All domains within this environment will be automatically password protected.
 
 </li>
</ol>
You have now successfully enabled and set password protection for your environment.
All visitors to the site or application hosted on this environment will be prompted to enter this username and password when they try to access the environment URL.

Best Practices: It is common that most modern web browsers cache Basic Auth credentials after they are successfully entered the first time. For this reason, and because the username and password set for each environment is shared for all users with whom you share these credentials, it is recommended that you change this password periodically (i.e., every three months).
 
<h2>Disable Password Protection for your Environment</h2> Follow the steps below to disable password protection for your environment:
<ol>
 <li>
 
 From the Launch landing page, click the&nbsp;project card&nbsp;to open your project.
 
 </li>
 <li>
 
 In the Environments screen, hover over the&nbsp;environment&nbsp;for which you want to disable password protection and click the&nbsp;Environment Settings&nbsp;icon. <img alt="Launch-PasswordProtection-EnvSettingsIcon.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt5464705313e0b649/64bb45d0361d391f07947100/Launch-PasswordProtection-EnvSettingsIcon.png" width="100"/>
 
 </li>
 <li>
 
 In Settings &gt; Environments, click the&nbsp;Password Protection&nbsp;tab. <img alt="Launch_Password_Protection_Nav.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt9350eca9beeee345/64bb45d01add4dd0bffbba34/Launch_Password_Protection_Nav.png" width="100"/> 
 
 </li>
 <li>
 
 Click the&nbsp;Enable Password Protection&nbsp;toggle button again to disable the password protection. <img alt="Launch_Password_Protection_DisableToggle_New.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt1c32c9210417675e/64c89cff385f46e1a09ed676/Launch_Password_Protection_DisableToggle_New.png" width="100"/>
 
 </li>
 <li>
 
 Click the&nbsp;Yes, disable&nbsp;button. <img alt="Launch-PasswordProtection-ModalDisable_New.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt79018498e7c4f871/64c89cff5133eee2a6bf0bc3/Launch-PasswordProtection-ModalDisable_New.png" width="100"/>
 
 </li>
</ol>
You have now successfully disabled password protection for your environment. This allows anyone with the environment URL to access your environment.

Password Protecting an Environment

<h2>Using Launch with CLI</h2>
Launch is a deployment platform that enables you to host your Contentstack-powered Jamstack website instantly.&nbsp;<a href="https://www.contentstack.com/docs/developers/launch/about-launch/">Launch</a>&nbsp;hosts websites managed by any CMS (headless or traditional).
You can create a new project in Launch and link it with your GitHub repository. Launch picks that code and deploys your website instantly. Launch also allows you to create a project by directly uploading a project folder or a .zip file.
This step-by-step guide lets you perform different operations in Launch using the CLI.
<h2>Prerequisites</h2>
Note: This prerequisite is applicable only if you are importing a project via GitHub.
<ul>
 <li>
 <a href="https://www.contentstack.com/login/">Contentstack account</a>
 </li>
 <li>
 <a href="https://www.contentstack.com/docs/developers/cli/install-the-cli/">CLI installed</a>&nbsp;and&nbsp;<a href="https://www.contentstack.com/docs/developers/cli/configure-regions-in-the-cli/">configured</a>&nbsp;(version 1.6.0 and above)
 </li>
 <li>
 <a href="https://www.contentstack.com/docs/developers/cli/cli-authentication/">CLI authenticated</a>
 </li>
 <li>
 Access to Launch for your organization
 </li>
 <li>
 <a href="https://github.com/login">GitHub account</a>&nbsp;where your website code is hosted
 </li>
</ul>
<h2>Steps for execution</h2>
 
<ol>
 <li>
 Open a terminal and fire the launch command:
 <ul>
 <li>
 Run the below command if you are in the current working directory.
 
 $ csdx launch 
 
 </li>
 <li>
 If you are in a different directory, provide the path of the current working directory.
 
 $ csdx launch –data-dir 
 
 </li>
 </ul>
 Note: Launch automatically identifies Git projects.
 
 </li>
 <li>
 If you are creating a project by uploading a file, or if the GitHub is not already connected, you will be prompted to choose a project type to proceed. Select&nbsp;Continue with GitHub&nbsp;or&nbsp;Continue with FileUpload&nbsp;to proceed. <img alt="Launch_Plugin-Project_Type.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/blt0e0d2bc64da6923d/6437b49d1c46cc118806d761/Launch_Plugin-Project_Type.png" width="100"/>
 </li>
 <li>
 Select the organization where you want to create your project.
 </li>
 <li>
 In this step, select a branch if you decided to create your project using GitHub.
 </li>
 <li>
 Enter a name for your project.
 </li>
 <li>
 Enter a name for your Environment or click&nbsp;Enter&nbsp;to proceed with the Default environment.
 </li>
 <li>
 By default, Launch identifies the framework. Select a&nbsp;Framework Preset&nbsp;if you want to change the default framework, and then click&nbsp;Enter.
 </li>
 <li>
 In the Build Command section, perform one of the following:
 <ul>
 <li>
 Click&nbsp;Enter&nbsp;if you want to proceed with the default Build command&nbsp;npm run build.
 </li>
 <li>
 Enter a new build command or update the existing command if you want to customize the command.
 </li>
 </ul>
 
 </li>
 <li>
 Enter the output path in the&nbsp;Output Directory&nbsp;section or click&nbsp;Enter&nbsp;to proceed with the default output path.
 </li>
 <li>
 In the next step, follow the instructions provided on screen to perform one of the following:
 <ul>
 <li>
 Import variables from a stack
 </li>
 <li>
 Manually add custom variables to the list
 </li>
 <li>
 Import variables from the local env file
 </li>
 </ul>
 
 </li>
 <li>
 A prompt,&nbsp;Would you like to add more variables.?&nbsp;appears.
 <ul>
 <li>
 Enter&nbsp;Y&nbsp;to add another custom variable.
 </li>
 <li>
 Enter&nbsp;n&nbsp;to proceed with the project deployment.
 </li>
 </ul>You have successfully deployed a Launch project using the CLI.
 
 </li>
 <li>
 To redeploy/re-initialize an existing project, run the launch command with the existing project’s directory path. You will get a prompt as displayed in the screenshot below. <img alt="Launch_Plugin-Redeploy.png" src="https://images.contentstack.io/v3/assets/blt2d43f51baca745a8/bltac3ef4127a60dca9/6437b49d43365211f62d714a/Launch_Plugin-Redeploy.png" width="100"/>
 <ul>
 <li>
 Click&nbsp;Y&nbsp;to redeploy the project. If you are redeploying using the File Upload method, then you will get a prompt&nbsp;Redeploy with last file upload?.
 <ol>
 <li>
 Click&nbsp;y&nbsp;if you want to redeploy with the last file upload.
 </li>
 <li>
 Click&nbsp;N&nbsp;to redeploy by uploading a new file.
 </li>
 </ol>
 Note: By default, Launch assumes to redeploy a new file.
 
 </li>
 <li>
 Click&nbsp;N&nbsp;to terminate the process.
 </li>
 </ul>
 
 </li>
</ol>
Usage
 
$ csdx launch 
Options
<ul>
 <li>
 -d, --data-dir=data-dir: Current working directory.
 </li>
 <li>
 -c, --config=config: Path to the local config file.
 </li>
 <li>
 --type=type: Optional type of adapters. Options [GitHub or FileUpload].
 </li>
 <li>
 -e, --environment=environment: [optional] Environment name for launch project.
 </li>
 <li>
 -n, --name=name: [optional] Name of project.
 </li>
 <li>
 --branch=branch: [optional] GitHub Branch name.
 </li>
 <li>
 --build-command=build-command: [optional] Build Command.
 </li>
 <li>
 --framework=: [optional] Type of framework. Options [GATSBY|NEXTJS|OTHER]
 </li>
 <li>
 --org=org: [optional] Provide the organization's UID to create a new project or deployment.
 </li>
 <li>
 --out-dir=: [optional] Output Directory.
 </li>
 <li>
 --init: [Optional, Hidden] Reinitialize the project if it is an existing Launch project.
 </li>
</ul>
Examples
<ul>
 <li>
 To create a Launch project by providing the config file path and file type:
 
 $ csdx launch --config --type 
 
 </li>
 <li>
 To create a Launch project by providing the directory path and file type:
 
 $ csdx launch --data-dir --type 
 
 </li>
</ul>
Note: When there are multiple branches identified in the configuration, you will be prompted to&nbsp;Choose a branch&nbsp;to proceed with the Launch operations. A single config file can have n number of configurations based on the branch.
<h2>Logs</h2>
You can fetch the previous deployment logs and the latest server logs for Launch projects in CLI using the&nbsp;launch:logs&nbsp;command.
<h3>Steps for execution</h3>
 
$ csdx launch:logs 
<ol>
 <li>
 Open a terminal and fire the&nbsp;launch:logs&nbsp;command:
 </li>
 <li>
 Select the organization which has your project.
 </li>
 <li>
 Select your project for which you want to fetch the logs.
 </li>
 <li>
 Select the required environment.
 </li>
 <li>
 You have successfully fetched the logs for your selected project.
 </li> 
 <li>
 
 </li>
</ol>
Usage
 
$ csdx launch:logs 
Options
<ul>
 <li>
 -d, --data-dir=data-dir: Current working directory.
 </li>
 <li>
 -c, --config=config: Path to the local config file.
 </li>
 <li>
 -e, --environment=environment: Environment name or UID.
 </li>
 <li>
 --deployment=deployment: Deployment number or uid.
 </li>
 <li>
 --type=type: Optional type of flags to show logs. By default, these are server logs. Options [d&nbsp;- deployment logs,&nbsp;s&nbsp;- server logs]
 </li>
</ul>
Note: If you do not pass a deployment ID, by default launch fetches the latest deployment logs.
Examples
<ul>
 <li>
 To fetch Launch project logs based on the environment number and type of flags:
 
 $ csdx launch:logs -e "environment number or uid" --type "types of flags" 
 
 </li>
 <li>
 To fetch Launch project logs based on the environment number and deployment number:
 
 $ csdx launch:logs -e "environment number or uid" --deployment "deployment number or uid" 
 
 </li>
</ul>
<h2>Functions</h2>
You can test your Launch project Cloud Functions locally using the&nbsp;launch:functions&nbsp;command in CLI.
Usage
 
$ csdx launch:functions 
Options
<ul>
 <li>
 -d, --data-dir=data-dir: Current working directory.
 </li>
 <li>
 -c, --config=config: Path to the local config file.
 </li>
 <li>
 -p, --port=port: Port number.
 </li>
</ul>
Examples
<ul>
 <li>
 To test your Launch project Cloud Function locally:
 
 $ csdx launch:functions 
 
 </li>
 <li>
 To test your Launch project Cloud Function locally in a specific port:
 
 $ csdx launch:functions -p "port number" 
 
 </li>
</ul>
<h2>Deployments</h2>
You can display the list of deployments for an environment for Launch projects using the&nbsp;launch:deployments&nbsp;command in CLI.
<h3>Steps for execution</h3>
 
$ csdx launch:deployments 
<ol>
 <li>
 Open a terminal and fire the&nbsp;launch:deployments&nbsp;command:
 </li>
 <li>
 Select the organization which has your Launch project.
 </li>
 <li>
 Select your project.
 </li>
 <li>
 Select the environment for which you want to list the deployments.
 </li>
</ol>
You have successfully listed the deployments for the selected environment.
Usage
 
$ csdx launch:deployments 
Options
<ul>
 <li>
 -d,&nbsp;--data-dir=data-dir: Current working directory.
 </li>
 <li>
 -c,&nbsp;--config=config: Path to the local '.cs-launch.json' file.
 </li>
 <li>
 -e,&nbsp;--environment=environment: Environment name or UID.
 </li>
 <li>
 -–org=org: [Optional] Provide the organization UID.
 </li>
 <li>
 -–project=project: [Optional] Provide the project UID.
 </li>
</ul>
Examples
 
$ csdx launch:deployments -d "current working directory" 
 
$ csdx launch:deployments -e "environment number or uid" 
<ul>
 <li>
 To list the deployments in your current working directory
 </li>
 <li>
 To list the deployments for a given environment
 </li>
</ul>
<h2>Environments</h2>
You can display the list of environments that are available for a particular project using the&nbsp;launch:environments&nbsp;command in CLI.
<h3>Steps for execution</h3>
 
$ csdx launch:environments 
<ol>
 <li>
 Open a terminal and fire the&nbsp;launch:environments&nbsp;command:
 </li>
 <li>
 Select the organization which has your project.
 </li>
 <li>
 Select your project.
 </li>
</ol>
You have successfully listed the environments for the selected project.
Usage
 
$ csdx launch:environments 
Options
<ul>
 <li>
 -d,&nbsp;--data-dir=data-dir: Current working directory.
 </li>
 <li>
 -c,&nbsp;--config=config: Path to the local '.cs-launch.json' file.
 </li>
 <li>
 -–org=org: [Optional] Provide the organization UID.
 </li>
 <li>
 -–project=project: [Optional] Provide the project UID.
 </li>
</ul>
Examples
 
$ csdx launch:environments -d "current working directory" 
 
$ csdx launch:environments --org= --project= 
<ul>
 <li>
 To list the environments in your current working directory
 </li>
 <li>
 To list the environments for a specific project under a given organization
 </li>
</ul>
<h2>Open</h2>
You can open the live site for an environment of your Launch projects using the&nbsp;launch:open&nbsp;command in CLI.
<h3>Steps for execution</h3>
 
$ csdx launch:open 
<ol>
 <li>
 Open a terminal and fire the&nbsp;launch:open&nbsp;command:
 </li>
 <li>
 Select the organization which has your project.
 </li>
 <li>
 Select your project.
 </li>
 <li>
 Select the environment for which you want to view the live site.
 </li>
</ol>
You have successfully opened the live site for the selected environment.
Usage
 
$ csdx launch:open 
Options
<ul>
 <li>
 -d,&nbsp;--data-dir=data-dir: Current working directory.
 </li>
 <li>
 -c,&nbsp;--config=config: Path to the local '.cs-launch.json' file.
 </li>
 <li>
 -e,&nbsp;--environment=environment: Environment name or UID.
 </li>
 <li>
 -–org=org: [Optional] Provide the organization UID.
 </li>
 <li>
 -–project=project: [Optional] Provide the project UID.
 </li>
</ul>
Examples
 
$ csdx launch:open --environment=environment --data-dir 
 
$ csdx launch:open --environment=environment --config 
<ul>
 <li>
 To open the website for an environment by passing your current working directory
 </li>
 <li>
 To open the website for an environment for a given configuration
 </li>
</ul>

Using Launch with CLI

<h3>Launch Overview</h3><a href="https://www.contentstack.com/docs/developers/launch/about-launch/">About Launch</a><a href="https://www.contentstack.com/docs/developers/launch/quick-start-gatsby/">Quick Start Guide with Gatsby</a><a href="https://www.contentstack.com/docs/developers/launch/quick-start-nextjs/">Quick Start Guide with NextJS</a><h3>Launch Features</h3><a href="https://www.contentstack.com/docs/developers/launch/import-project-using-github/">Create a Project using GitHub</a><a href="https://www.contentstack.com/docs/developers/launch/import-project-using-file-upload/">Create a Project using File Upload</a><a href="https://www.contentstack.com/docs/developers/launch/deployments/">Deployments</a><a href="https://www.contentstack.com/docs/developers/launch/environments/">Environments</a><a href="https://www.contentstack.com/docs/developers/launch/environment-variables/">Environment Variables</a><a href="https://www.contentstack.com/docs/developers/launch/custom-domain/">Custom Domain</a><a href="https://www.contentstack.com/docs/developers/launch/deploy-hooks/">Deploy Hooks</a><a href="https://www.contentstack.com/docs/developers/launch/cloud-functions/">Cloud Functions</a><a href="https://www.contentstack.com/docs/developers/launch/password-protection/">Password Protection for Environments</a><h3>Launch How to Guides</h3><a href="https://www.contentstack.com/docs/developers/launch/add-api-endpoints-to-a-website/">Add API Endpoints to a Website in Launch</a><a href="https://www.contentstack.com/docs/developers/launch/deploy-a-gatsby-site/">Deploy a Gatsby Site</a><a href="https://www.contentstack.com/docs/developers/launch/deploy-a-nextjs-site/">Deploy a NextJS Site</a><a href="https://www.contentstack.com/docs/developers/launch/deploy-a-project-from-a-monorepo/">Deploy a Project from a Monorepo on Launch</a><a href="https://www.contentstack.com/docs/developers/launch/disable-automatic-redeployment/">Disable Automatic Redeployment</a><a href="https://www.contentstack.com/docs/developers/launch/host-a-static-site/">Host a Static Site on Launch</a><a href="https://www.contentstack.com/docs/developers/launch/redeploy-automatically-when-content-is-published-on-CMS/">Redeploy Automatically when Content is Published on CMS</a><a href="https://www.contentstack.com/docs/developers/launch/setup-production-and-non-production-environment/">Setup Production and Non-Production Environment</a><a href="https://www.contentstack.com/docs/developers/launch/auto-populate-environment-variables-from-a-linked-stack/">Auto-populate Environment Variables from a Linked Stack</a><a href="https://www.contentstack.com/docs/developers/launch/docker-support-in-launch/">Can I run a Docker container on Launch?</a><h3>Launch Command Line Interface</h3><a href="https://www.contentstack.com/docs/developers/cli/cli-for-launch/">CLI for Launch</a><h3>More about Contentstack Launch</h3><a href="https://www.contentstack.com/docs/faqs/#launch-faqs">Launch FAQs</a>

Additional Resources

Contentstack Launch is a frontend hosting and deployment platform for websites built on the Contentstack CMS,&nbsp;Refer&nbsp;<a href="https://www.contentstack.com/docs/developers/launch/about-launch/">here</a>&nbsp;for more.&nbsp;This comprehensive course provides a step-by-step guide to mastering Contentstack Launch and utilizing its capabilities to streamline content management, deployment, and distribution processes.The course begins with an introduction to Contentstack Launch, exploring its key features and benefits. You will quickly get started by learning how to integrate Contentstack Launch with popular frameworks such as Gatsby and Next.js, enabling you to leverage their strengths in conjunction with Contentstack's powerful CMS capabilities.Through hands-on exercises and practical examples, you will discover how to create projects using either GitHub or file uploads, providing you with flexibility and ease of use in managing your content. The course covers various aspects of deployments, including managing environments, environment variables, and custom domains, ensuring smooth and efficient deployment processes.You will dive deep into the functionality of deploy hooks and explore how they can be utilized to automate specific actions during the deployment process. Additionally, you will learn how to harness the power of cloud functions to extend the capabilities of Contentstack Launch, allowing you to implement custom logic and execute complex tasks.The course includes comprehensive how-to guides that cover a range of topics, from adding API endpoints to a website in Contentstack Launch to deploying Gatsby and Next.js sites. You will also gain insights into deploying projects from a monorepo, disabling automatic redeployment, and hosting static sites.Furthermore, you will learn how to integrate Contentstack Launch with your CMS workflow, enabling automatic redeployment whenever new content is published, ensuring that your digital content is always up to date.Finally, the course delves into setting up production and non-production environments, providing you with the knowledge to optimize your deployment strategies for different scenarios. You will also explore how to auto-populate environment variables from a linked stack, simplifying the configuration process and enhancing your development workflow.By the end of this course, you will have a comprehensive understanding of Contentstack Launch and be equipped with the skills necessary to effectively deploy and deliver digital content across multiple platforms and channels, ensuring a seamless experience for your users.

This course provides a comprehensive overview of deploying websites using Launch, Contentstack's front end hosting solution.

Deleting a Launch Project

Next Up

Launch Deployments