Publishing Environments define the controlled release path that moves your project's changes from your personal working state to a live customer experience. This feature is critical for ensuring that the correct integration data is applied to your application at each stage of the release process.

Environment Basics and Configuration

Configuring the environment structure requires the Administrator role. The default environments—Draft, Staging, and Production—are pre-configured, but the system allows the names and number of environments to be fully customized to match your internal workflow.

Core Environments

Shipcode provides the following publishing environments by default:

• Draft: Your current working environment, where content is being actively edited. When you use the "Preview for Web" link while designing, you are viewing the Draft environment.
• Staging: A pre-production environment used for privately testing the updates for both web and native applications before they go live.
• Production: The live environment where updates are accessible to end-users on your public-facing site and apps.

The Promotion Path

The Promotion Path dictates the mandatory sequence of releases defined in your Project Settings.

• Content must be promoted one level at a time through the predefined sequence (Draft -> Staging -> Production).
• A saved version must be promoted to all lower environments (specific to that path) before it can be made live on Production.

Editing Publishing Environments

When an Administrator selects an environment (Draft, Staging, or Production) to edit, a configuration modal opens, allowing precise control over its properties:

• Name: Customize the display name of the publishing environment (e.g., changing 'Draft' to 'Concept' or 'Dev-Preview').
• Domain: Input the custom URL that will serve as the public-facing address for this specific environment.
• CloudFront Distribution ID: An optional field used for configuring an Amazon CloudFront distribution endpoint for content delivery, if applicable to your company's infrastructure.
• Data Environment Selector: Assign a specific Data Environment from your configured list to this publishing stage. This is the critical step for controlling which data set is used when content is promoted to this environment.

Data Environment Dependency

To ensure the integrity of your live application, every Publishing Environment is tightly coupled with a Data Environment.

• Data Environments are where you define and store unique sets of values, such as API keys, endpoints, and testing data for all your project's integrations. You can create and configure any number of Data Environments for a project.
• Publishing Environments simply act as a selector to assign a single Data Environment to a specific publishing stage (Draft, Staging, or Production).

Data Configuration Flow

To ensure the correct data is applied during publication:

1. Configure Integrations: Install the required integration (e.g., Shopify) and fill out the necessary credentials in the Settings -> Integrations Marketplace. This initial data is automatically applied to your Draft data environment.
2. Customize Data Environments: Navigate to Data Environments in Project Settings to create or update API keys, endpoints, and values for each integration across all your necessary data sets (e.g., setting unique endpoints for Staging and Production).
3. Assign Data to Publishing: Go to Publishing Environments (also in Project Settings) and use the Data Environment dropdown for each stage (Draft, Staging, Production) to select which data set should be applied when content is published to that environment.

Custom Domains and Distribution

You can define the public-facing URL for each stage within the Publishing Environments configuration modal:

• Default Domains: If no custom URL is provided, Shipcode uses default URLs for previewing Staging and Production.
• Custom Domain: You can input a custom URL that has been configured in Project Settings to serve as the live domain name for that environment.

Previewing in the Editor

While designing, you can instantly test how your layouts interact with different data environments without promoting:

• The environment selector dropdown at the top of the design canvas displays the currently active environment (Environment: Draft).
• You can swap the active Data Environment here to see how your components render with that data set while you are designing.