📣 Attention Salesforce Certified Trailblazers! Link your Trailhead and Webassessor accounts and maintain your credentials by December 14th. Learn more.
close
trailhead

Configure the Production Environment

Heroku Pipelines is a Continuous Delivery tool. Pipelines are useful for managing multiple environments for your app. Using Pipelines removes manual work from the process of promoting code.

Enable Review apps.

  1. Go to https://dashboard.heroku.com.
  2. Click dreamhouse-pipeline.
  3. Click Enable Review Apps...
  4. A popup appears asking if you want to inherit the same configuration as the app that is being used for your staging environment. Select Create new review apps for new pull requests automatically.
  5. Click Enable.

In GitHub, add a new feature called Mortgage Calculator using a feature branch.

  1. Open a separate tab and navigate to your GitHub repo at https://github.com/YOUR_USERNAME/intro-to-heroku.
  2. Click the directory app.
  3. Click app.html.
  4. Click the pencil icon to edit the file.
  5. Copy this snippet of code and add it after line 20. This adds a new header called Mortgage Calculator in the DreamHouse navigation sidebar.
    <button menuClose ion-item><ion-icon item-left name="calculator"></ion-icon>Mortgage Calculator</button>

  6. Scroll to the bottom of the page. In the Commit Changes box, type New Feature: Mortgage Calculator. Change the description to Adding the Mortgage Calculator feature to navigation.
  7. Select Create a new branch for this commit and start a pull request.
  8. Keep the default branch name.
  9. Click Propose file change.
  10. Click Create pull request.
  11. Keep this tab open.

Review apps run the source code in any GitHub pull request in a complete-but-disposable app on Heroku. You can configure review apps to be created automatically for each pull request. 

Verify your change using Review Apps.

  1. Return to the Heroku dashboard, https://dashboard.heroku.com. Click dreamhouse-pipeline. Confirm you see the Review App column listing your pull request. Screenshot of the Review App that was created for the Mortgage Calculator feature. It displays the name of the pull request (dhdev-07312018-pr-1), the commit name (#1 New Feature: Mortgage Calculator), a log message (Creating app) and a link to view the logs labeled "View Log".

    If you are quick, you may get back to the Pipeline dashboard and notice your pull request is listed, but the review app has not been created yet.

    Screenshot of the review app for Mortgage Calculator It includes the name of the commit #3 New Feature: Mortgage Calculator and a button labeled, "Create Review App".

    No worries! It takes about 10 seconds for the deployment process to start after you submit your pull request on GitHub. So go ahead and click the Create Review App button to get the deployment process started.
         While the review app is building:
    • Click the View Log link to monitor the logs as the deployment is running.
    • Once the app has been deployed, click View to verify your changes.
        Screenshot of a completed deployment with two buttons. One labeled, "Manage App" and the other labeled, "View".
         After the review app is deployed
    • You can no longer view the logs from the Pipeline tab.
    • Click arrows iconand click Open app in browser.
      Screenshot of the Review App that was created for the Mortgage Calculator feature that has already been deployed. It displays the name of the pull request (dhdev-20180725-pr-1), the commit name (#1 New Feature: Mortgage Calculator), the time that was deployed and a button in the corner to view the logs or view the review app.
  2. Once the DreamHouse app opens, click the menu icon. Verify Mortgage Calculator is listed in the navigation.

Create a second pull request to trigger the creation of a review app.

  1. Navigate to your GitHub repo at https://github.com/YOUR_USERNAME/intro-to-heroku.
  2. Click the directory app > pages > welcome and open welcome.html.
  3. Click the pencil iconto edit the file.
  4. After line 4, copy and paste this line to add a title to the Welcome page.
    <ion-title>Welcome to DreamHouse Realty</ion-title>
  5. Scroll to the bottom of the page in the Commit Changes input box. Type Changed Title. Change the description to Title changed to Welcome to DreamHouse Realty.
  6. Select Create a new branch for this commit and start a pull request.
  7. Keep the default branch name.
  8. Click Propose file change.
  9. Click Create pull request.
  10. Verify the new welcome header by following the steps above in the "Verify your change using Review Apps" step.

When reviewing multiple open review apps, you can visually see that the apps are completely isolated branches. 

Change 1: New Feature: Mortgage Calculator

Screenshot of the Dreamhouse web app using pull request one with the Mortgage Calculator and without the title change.

Change 2: Changed Title

Screenshot of the Dreamhouse web app using pull request two with the Title change and without the Mortgage Calculator feature.

Merge the New Features into the master branch.

  1. Return to your GitHub repo and click the Pull Requests tab. There are two pull requests listed.

    Screenshot of GitHub displaying the two Pull requests for changing the title and adding a new feature.
  2. Click each pull request. Scroll down and click Merge pull request and Confirm merge.
  3. Return to the Heroku Pipeline tab. The review app has been removed, and the change is being deployed into staging. Once the changes have been deployed to the staging environment, you can promote your app to production to create a new version for users.
  4. Click Promote to production… and Promote.

You have now created a new version release for any user ready to start their house hunt! But wait—although the user interface is complete, the properties in the production environment are not mapped to any Trailhead Playground. Let’s use the existing Trailhead Playground to connect to our production environment. When creating production environments, you wouldn’t use the same database in staging as you would for production. Normally we would need to create a separate Trailhead Playground specifically for production. 

For the sake of time, we use our existing playground. But if you are interested in creating a separate production org, launch a new Trailhead Playground, reset the credentials, and install the Dreamhouse package. Once you create your new Trailhead Playground, return to this step to continue setting up your pipeline. 

Import Configurations for the Production Environment

  1. Navigate to the Heroku Pipelines Dashboard, https://dashboard.heroku.com/apps.
  2. Next to the name of your pipeline (dreamhouse-pipeline) it says 2 apps. Click the arrows icon next to 2 apps. 
    Screenshot of the Heroku Dashboard displaying the dreamhouse pipeline and the production and development Heroku Apps.
  3. Click the app named dhprod-UNIQUE_ID.
  4. Click the Resources tab and type connect in the Add-ons field.
  5. Select Heroku Connect to add this to the production app and click Provision.
  6. Click the Heroku Connect link under Add-ons. You are redirected to a new tab with the Heroku Connect dashboard and both of your apps are in separate tabs at the top of the screen. Screenshot of the Heroku Connect dashboard open to the production tab. Within the tab the Overview view is selected. The connection status is idle with a green check mark and the Salesforce Rows display the number 26.

  7. Click the dhdev-UNIQUE_ID tab.
  8. Click Settings then Import/Export Configuration.  We export the Heroku Connect configuration and use the same settings for the production app that we used in our development app.
  9. Click Export. The Heroku Connect configuration settings for our development app are downloaded locally in a JSON file.
  10. Save the file to your computer.
  11. To use the configurations we exported from the development Heroku app we import them into our production Heroku app.
  12. Click the dhprod-UNIQUE_ID tab at the top of the Heroku Connect dashboard.
  13. In the Overview tab, click Setup Connection.
  14. Click the schema name input and verify the text says salesforce, click Next.
  15. Click Authorize. Use your Trailhead credentials from either your original Trailhead Playground or your secondary production Trailhead Playground.
  16. Click Allow.
  17. Navigate to the Settings tab, choose Import/Export Configuration, click Import, click Choose file and find the .json file to import.
  18. Click Upload to begin the import. When the file has been imported successfully, Heroku Connect begins syncing data from your authorized Trailhead Playground into the database. You know it is complete when the Salesforce Rows and Database Rows display a value. 
    A larger view of the production view of the Heroku Connect dashboard in the overview view. Displays the Connect Status being idle, Salesforce rows are 26 and the database rows are 26.
  19. Go to the Heroku dashboard of your production app, https://dashboard.heroku.com/apps/dhprod-UNIQUE_ID.
  20. Click More and then Restart all dynos.
  21. Click More and then View Logs. Once the state has changed to up, click Open app to view the production app.

Congratulations! You have a completed Heroku Pipeline.

retargeting