Deploy From An Existing Repository
Now that you have chosen to deploy from an existing repository, you can select the repository and deploy it to Atlas. Pushing code changes to the branch of your choice in GitHub will then deploy updates to Atlas automatically.
Create Atlas App
1. Prepare your app for deployment
Atlas supports Node.js applications using many popular frameworks with minimal configuration. You can view our framework guides to see what may be required of your particular framework:
Some newer frameworks may not have a framework guide yet, but can still run on the Atlas platform using whatever Node.js-based adapters are provided by the framework or as SSG using a Node.js package to serve static assets like
Custom build and start commands
By default, the Atlas platform will run
npm run build and
npm run start to build and start your application. If you want to run different commands to build or start your application, you can reference the docs on custom build commands or custom start commands to review the various ways this can be implemented.
Using the correct port
The platform expects your application to listen for traffic on one of the following ports:
3000. You may receive an error during deployment if your application is using a different port value. In some frameworks, you may be able to use an environment variable named
PORT to specify which port you application will listen on.
2. Connect to GitHub
Connect your GitHub account so you can select the repo to deploy to Atlas.
Repository Settingsview, select
GitHub opens in another tab of your web browser. Give WP Engine permission to access your repositories.
After Atlas connects to your GitHub account, the
Connect button indicates that you are
Connected. A list of repositories associated with your GitHub account appears.
3. Select the repository to deploy
Now that GitHub is connected, it's time to connect your repository.
- From the list of repositories, select the one with your application's code.
Continueto proceed to the WP Engine Settings page.
4. Set your application settings
WP Engine Settings screen:
Fill out a name for your application. We recommend choosing a name similar to your GitHub repository's name. The application name cannot be changed once it has been deployed.
Select a region for your application. The region you select will be used for all of your app's environments (production/staging/etc.) and cannot be changed once your Atlas application has been deployed.
5. Configure the environment
- From the list of your repository's branches, select the branch you want to base your environment on. Whenever changes are pushed to this branch, your app will be automatically re-deployed.
- If you want to create a production environment, you could use your repo's
- If you want to create a staging environment, you could use your repository's
- If your project is stored in a folder within your repository, specify the path to your root folder by clicking on the
Editicon in the
Enter a name for your Atlas environment. The name should represent how you intend to use the environment. For example, enter something like
prodif it's a production environment,
stagingif it's a staging environment, etc.
Every headless environment is associated with a WordPress environment. Choose either:
I already have a WordPress environment: Use a WordPress site from your WP Engine account. Select the search bar and search for the name of your WordPress site.
I want to create a new WordPress environment: WP Engine makes a new WordPress site and links it to your application. In the box, enter a name for your new WordPress site.
- In order for your WordPress environment to become "headless", Atlas can install the WP GraphQL, Atlas Content Modeler, FaustWP and Atlas Search plugins. It can also automatically set the required environment variables for you so that the FaustWP plugin will work properly out-of-the-box.
The Atlas app details page appears. When Atlas completes building your application, a checkmark appears under
- To visit your headless WordPress app once the first deploy finishes, click the link under the
Atlas URLheading. Your Atlas app opens in a new browser tab. Enjoy!
Set Environment Variables (Optional)
To add environment variables for your app, click
Add environment variable.
Value pairs for each environment variable.
For example, you may need to add a
NEXT_PUBLIC_WORDPRESS_URL key with a URL as its value to specify which WordPress site should be used as the data source for the app. You may also need to specify additional environment variables to store sensitive data such as API keys and secrets.
To make changes to the look and functionality of your app, see our Local App Development guide.