In this tutorial, you learn how to deploy your first Cloud Foundry application by using an automated deployment through an IBM Cloud DevOps toolchain. The toolchain will then build and deploy your application when you click the Deploy to IBM Cloud button in a later step.
The toolchain that will be created for you has four components:
- Issue management through a hosted GitLab instance on IBM Cloud.
- A Git repo hosted on IBM Cloud.
- The Eclipse Orion Web IDE.
- A delivery pipeline to build and deploy your application to IBM Cloud.
The pipeline that will build and deploy your application has the following two stages:
- Build. Your application code is pulled from your repo and the dependencies are built.
- Deploy. The build artifacts for your application are deployed to IBM Cloud.
Application and toolchain files
This simple application uses the Vue.js framework to display a simple, single-page application. It uses webpack to bundle the front-end files into static assets. Node.js and the Express framework then serve the application.
The Vue.js application files are located in the /src
directory of this tutorial’s GitHub repository. Those files are then bundled by webpack into the /dist
folder.
The Node.js files /bin/www
and app.js
use Express to serve the frontend application, while /routes
contains the file to route requests to the home page.
You use the default toolchain template in the Open Toolchain repo to build the toolchain. In that repo, the /.bluemix
directory contains the toolchain and pipeline files:
toolchain.yml
contains the structure of the toolchain, including the cloned repo, the pipeline, and the web IDE integration.pipeline.yml
contains the definition of the pipeline, which in this case only has two stages: build and deploy.
Prerequisites
You must register for an IBM Cloud account before you can complete this tutorial.
Estimated time
This tutorial should take you approximately 10 minutes to complete.
Steps
Click the following Deploy to IBM Cloud image:
You will be prompted to sign into your IBM Cloud account. Click Log in and enter your account information if you have not already signed in.
The Create a toolchain page opens. Enter a new name for your toolchain within the Toolchain Name field. Make a note of the default region that was automatically chosen from the Select Region drop down list. You will need to use this same region name in a later section. The region might not be Dallas as shown in the following screen capture image because the toolchain attempts to select the region closest to you.
Within the Tool Integrations section, click Delivery Pipeline to update your pipeline configuration settings.
Click the Create button located next to IBM Cloud API key field.
A pop-up window opens that asks if you want to create a new API key for this pipeline. Click OK.
You will see information such as Region, Space, and Organization displayed. If no organization or space displays, update the Region field. In particular, if
Washington DC
is selected, switch to theDallas
region.Click Create. Your new toolchain is displayed.
- You can click on the pipeline to view your application being built or you can remain on the toolchain page until the pipeline finishes building.
From the toolchain page, go to the application console by clicking View Console on the Deploy Stage pipeline tile.
Open the application from the App Console by clicking Visit App URL.
Note: Due to Internet Explorer and Microsoft Edge limitations, the application will not display in those browsers. We recommended that you open your application using Firefox, Chrome, or Safari instead.
If you have completed all the steps correctly, you will see the following image displayed on the home page of your new application:
Summary
In this tutorial, you deployed your first application using an IBM Cloud DevOps toolchain, which enabled you to automatically build and push the application to IBM Cloud.