30
Intro to IBM Bluemix DevOps Services A workshop By Lauren Schaefer Try me! I’m fabulous!

Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

Embed Size (px)

Citation preview

Page 1: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

Intro to IBM

Bluemix DevOps

Services

A workshop

By Lauren Schaefer

Try me

Irsquom fabulous

1

Table of Contents Part 1A Deploying amp Updating a Simple App 2

Part 1B Deploying an App that Uses a Bluemix Service 6

Part 1C Planning Tracking amp Leveraging New Bluemix Services 9

Part 1D Deploying Automatically Using the Delivery Pipeline 17

Part 2A Live Edit 23

Part 2B Bluemix Debug 27

2

Part 1A Deploying amp Updating a Simple App Part 1 of this lab is broken into three pieces and demonstrates how easy it is to use IBM Bluemix DevOps

Services to plan code and deploy applications In part 1A youll learn how to deploy and make changes to a

simple application In part 1B youll learn how to deploy an application that uses a Bluemix service In part 1C

youll learn how to use the planning capabilities in DevOps Services to plan and track your app how to add a

new Bluemix service to an application and how to write code that leverages a Bluemix service Finally in part

1D yoursquoll learn how to use a delivery pipeline to automatically deploy changes to your app whenever code is

pushed to your projectrsquos repository

As a bonus youll also get an application that checks the prices of items in online stores for you so you dont

have to surf the web to see if your favorite items are on sale

Before we get started lets discuss the products well be using in this lab

IBM Bluemix DevOps Services is a place where you can collaborate with others to develop track plan

and deploy software

IBM Bluemix is an open-standards cloud-based platform where you can run the applications you develop

in DevOps Services Bluemix provides a variety of services that you can leverage in your applications so

you dont have to start coding from scratch

In part 1A youll be working with a sample online store called Laurens Lovely Landscapes The store currently

sells three prints each prints page displays the name image and price associated with the print

3

Learn this

1 Forking a project means to take a copy of the code in an existing project and put it in to a new

project

2 Making changes to an application can be fast and simple when you use the DevOps Services

Web IDE However users of DevOps Services can use whatever IDE they prefer when coding

Try this

1 Sign up for Bluemix and DevOps Services

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Fork Laurenrsquos Lovely Landscapes

At DevOps Services forking a project means taking a copy of the code in an existing project and

putting it in a new project

a Go to the Laurens Lovely Landscapes project overview page httpsibmbizcds-lll

b Click Edit Code in the upper-right corner You might be prompted to authenticate if you

have not already done so The Web IDE opens

c Select Tools gt Fork

d Type a name for your project leave the Add features for Scrum development and Make

this a Bluemix Project boxes checked and click CREATE

e Note that when the project has finished forking your new project name is listed in the

upper-left corner

Now you have a copy of the code in your own project The next step is to deploy it

3 Deploy Laurenrsquos Lovely Landscapes

To deploy an application means to bundle the project artifacts create an app at Bluemix

transfer the bundled app to Bluemix and start the app Bluemix application names and URLs are

created using properties which are often defined in the manifestyml file in a project The

Laurens Lovely Landscapes project already has the manifest created for you

a In the left navigation pane of the Web IDE select manifestyml

b Click the deploy button ( ) in the top bar

4

Note When you deploy through the Web IDE you are deploying the changes that are in

your Web IDErsquos workspace For example you may have changes you are currently

working on that you have not yet pushed to your projectrsquos repository Those changes

will be deployed

4 See Laurenrsquos Lovely Landscapes running

After your application is deployed to Bluemix a green dot displays in the status area of the top

gray bar

a Click the Open URL button ( ) in the top bar

b Browse your application that is running live on Bluemix Click on the Antarctica page and

note that the current price is $10000

5 Update the price of an item

Make a change to the application by updating the price of an item

a In the left pane of the Web IDE expand views and select antarcticatpl

b Scroll down until you see ltdiv id=pricegt10000ltdivgt

c Replace 10000 with 9999 (Wow thats a big sale -) )

d Click File gt Save

e Click the Deploy button ( )

f If prompted to stop and redeploy your app click OK

g After your application is deployed click the Open URL button ( ) in the top gray bar

h In your app that opens click Antarctica

Notice that the price of the item has been updated Success

Tweet this

Getting SaaS-y Just deployed an app to the cloud by leveraging Bluemix DevOpsServices

Check it out [insert link to your app] [Feeling extra sassy Include a selfie of you looking sassy]

Get creative

Laurenrsquos Lovely Landscapes is yours now Change the name change the color scheme change

the pictures or go crazy and implement a shopping cart Make the site your own and redeploy

5

Additional resources

MQTT Starfighter JazzHub Bluemix and live Scaling Out

httpswwwyoutubecomwatchv=b9hkCHmH7H4

Computerworld Forecast Study 2015 httpwwwidgenterprisecomreportcomputerworld-

forecast-study-2015

Transforming Enterprise Cloud Services

httpbooksgooglecombooksid=yyiPyIXgbxMCamppg=PA55v=onepageampqampf=false

Rapidly create a Nodejs app using a Bluemix boilerplate and DevOps Services

httpwwwibmcomdeveloperworkslibraryd-Bluemix-devops90indexhtml

6

Part 1B Deploying an App that Uses a Bluemix Service In this part youll be working with the Laurens Lovely Landscapes app you created in part 1A Youll also be

working with The Fabulous Price Finder app The Fabulous Price Finder provides you with the current prices of

items youre interested in purchasing online with the simple click of a button

Learn this

Leveraging Bluemix services like database services Watson services and DevOps Services makes

creating and managing apps easier

Deploying apps that leverage Bluemix services can be fast and easy

Try this

1 Fork the Fabulous Price Finder

a Go to the Fabulous Price Finder project overview page httpsibmbizcds-fbf

b Click EDIT CODE in the upper-right corner You might be prompted to authenticate if

you have not already done so

c Select Tools gt Fork

d Type a name for your project leave the Add features for Scrum development and Make

this a Bluemix Project boxes checked and click CREATE

e Note that when the project has finished forking your new project name is listed in the

upper-left corner

7

2 Deploy the Fabulous Price Finder

The Fabulous Price Finder uses the Cloudant NoSQL DB service hosted at Bluemix The Cloudant

database service provides access to a fully managed NoSQL JSON data layer thatrsquos always on To

get the Fabulous Price Finder running you deploy the application and then bind a new Cloudant

NoSQL DB instance to the application

a In the left navigation pane select manifestyml

b Click the Deploy ( ) button in the top gray bar Note that when the app finishes

deploying the database functionality will not yet work because you have not bound a

Cloudant NoSQL DB instance to it

c When the application is deployed click the Open application dashboard button ( ) in

the top gray bar

d If you are not already authenticated at Bluemix you might be prompted to do so After

you are authenticated you are redirected to your applications page on Bluemix

e Click ADD A SERVICE OR API

f Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data and

Analytics section The catalog is constantly being updated with new services

g Click the Cloudant NoSQL DB service

h In the Cloudant NoSQL DB dialog leave the defaults in the dialog (the code assumes the

name of your Cloudant NoSQL DB service starts with cloudant) and click CREATE

i When prompted if you want to restage your application now click RESTAGE

j When the page indicates your app is running click your applications route to open it

3 Try the Fabulous Price Finder

Now that you have the Fabulous Price Finder running its time to explore

The home page of the Fabulous Price Finder enables you to record the items for which you want

to check prices You begin with the Antarctica print from the Laurens Lovely Landscapes app

you deployed

a In the form on the home page specify the name for the print (Antarctica) the URL for

the print from your online store (Hint Look for something similar to

httplaurenslovelylandscapes-some-long-string-of-random-

charactersmybluemixnetantarctica) and the id of the price field for the print

(price)

b Click Submit

You are redirected to the View Database page where you can see information about the item

you just stored You can record the details for other items if you like

8

4 Get Prices

After you have stored information about an item you can check its price

a On the home page click Get Prices

b On the Success page click View the database

Notice that the price of your item is now stored in the database If you like go back to your

Laurens Lovely Lanscapes project update the price of the Antarctica print (dont forget to

deploy your change) and click Get Prices again Note that the database reflects the new price of

the print

5 Explore the Cloudant Database

You can browse and update the contents of your Cloudant database which can be helpful when

debugging and working with your app

a Go to the Bluemix dashboard

b Log in if you are not already authenticated

c On the dashboard click on your FabulousPriceFinder app to open it

d Click your Cloudant NoSQL DB service tile to open it

e Click LAUNCH

f In the Databases section click on your database to open it

g Browse the documents youve added to your database

Tweet this

Check out the app I just deployed that leverages a Cloudant database on Bluemix [insert link

to your app]

Get creative

Enhance the apprsquos navigation so it is easier to move around the site or change the name of the

app to be less ldquofabulousrdquo and more you Make it your own

Additional resources

Cloudant-Python httpsgithubcomcloudant-labscloudant-python

Develop and manage Java apps with IBM Bluemix and DevOps Services

httpwwwibmcomdeveloperworkslibraryd-Bluemix-javadevopsindexhtml

9

Part 1C Planning Tracking amp Leveraging New Bluemix Services

Learn this

Leveraging software as a service that works well with the platform as a service of your choice

can greatly speed up your software delivery lifecycle

Agile planning and tracking is simple in the cloud and creates built-in traceability for all of your

teammateshellipwhether they are collocated or distributed

Writing code that leverages a Bluemix service can be fast and significantly reduce development

time

Try this

1 Plan a new feature to add to the Fabulous Price Finder

So far you have made use of existing code but you havent created anything new Time to

change that

When working with teammates or even by yourself organizing your ideas into user stories and

then organizing your user stories into a plan can be incredibly valuable

a Open Track amp Plan

i Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated

and clicking on your project on the My Projects page

ii Click the gear button ( ) in the upper-right corner to open the Project

Settings page

iii Click OPTIONS

iv On the page that loads select the Enable Track amp Plan checkbox (if it is not

already enabled) and click SAVE

v Click TRACK amp PLAN in the upper-right corner The Track amp Plan section is your

place to organize your ideas

b Create work items in your backlog

i On the left pane click Backlog

ii On the right pane type the following in the Create a work itemhellip field As a shopper I want a text message sent to me with the

price of each item so that I dont have to check the

website to view the prices

10

iii The tool will automatically detect the work item type is story and set the type

for you

iv In the icon bar below click the Owned By icon and select your username

v Click CREATE

vi Repeat Steps 2-5 to create work items for the following stories

1 As a shopper I want to organize my items by

store so that I only have to input the field ID

once per store instead of every item

2 As a shopper I want to see a graph of the price

of the items Im watching over time so I can

judge if its a good time to buy the items

3 As a shopper I want the prices to be retrieved

automatically for me on a daily basis so I dont

have to log in manually and click Get Prices

4 As a shopper I want the prices to be texted to

me only when the price has changed so Im not

getting inundated with text messages

vii Create a work item of type defect with the following summary The View

Database page fails to load when the database is empty

c Plan your work

Now that you have filled your backlog with stories its time to plan your first sprint

i On the left pane click Sprint Planning A sprint represents a period of time

Organize your user stories in sprints

ii Click Add Sprints

iii Configure the sprints so you have at least two and click Create

iv In the Backlog section rearrange your stories so they are in a ranked order by

dragging and dropping them Put As a shopper I want a text message sent to me with the price of each item so that

I dont have to check the website to view the prices as

the top item in the list and As a shopper I want the prices to be retrieved automatically for me on a daily basis so

I dont have to log in manually and click Get Prices as

the second highest item in the list

v Click the Sprint 1 dropbdown box and select Sprint 1 so that Sprint 1 appears to

the right of the backlog (You may need to click Sprint 2 and then click Sprint 1

in order for the sprint to appear)

11

vi Assume you have time to complete one user story per sprint Drag the topmost

item in the list to Sprint 1 (on the right)

vii In the sprint dropdown box select Sprint 2

viii Drag the new top most item to Sprint 2

d Track your work

Sprint 1 has begun Indicate that you have started working on the first work item by

marking it as In Progress

i In the sprint dropdown box select Sprint 1

ii In the Sprint 1 section click the Status New icon ( ) for the story planned

for Sprint 1

iii In the Status dialog click Start Working

iv Note the work item ID for your work item because you will need it later in this

lab

2 Implement the feature

Next implement the work item As a shopper I want a text message sent to me with the price of each item so that I dont have to check the

website to view the prices The idea of implementing a text messaging feature

might sound a bit daunting to you Fortunately Bluemix provides a Twilio service you can use

that handles sending the text message so you can implement this feature with only nine lines of

code

a Register with Twilio

If you do not already have an account with Twilio you need to register You also need

your Twilio AccountSID Auth Token and phone number

1 Go to httpswwwtwiliocom and sign up

2 Follow the on-screen instructions to verify your account

3 Note your Twilio phone number

4 After you have authenticated and are viewing your account click your ID in the

right corner and select Account

5 In the API Credentials section note your AccountSID and AuthToken (You

might want to leave this page open as you continue so you can easily copy the

credentials)

b If you do not want to receive text messages

If you do not want to receive text messages to your phone because your carrier charges

ridiculous amounts you can instead send the text messages to your Twilio account

12

phone number If yoursquore ok with receiving text messages on your phone skip this

section and continue on to step c

i In Twilio click NUMBERS in the top navigation bar

ii Click your phone number in the Number table

iii In the Messaging section replace the Request URL with any valid url (this

prevents a never ending loop of your phone number sending a response to the

text message it just received) For example you might replace the Request URL

with a link to your Laurenrsquos Lovely Landscapes app

iv Click Save

v Click Numbers in the top navigation bar

vi Click Verify a number

vii Click text you instead

viii Input your Twilio phone number in the Phone Number box

ix Click Text Me

x In a new tab or window navigate to twiliocom and click Account

xi Click NUMBERS in the top navigation bar

xii Click your number in the Number table

xiii Click Inbound in the Messaging section

xiv Hover over the text message in the table to see the incoming message Note

the verification number in the text messagersquos body

xv Return to your original tab or window and input the verification number

xvi Click Submit

When you want to view incoming text messages for your Twilio number return to the

details page for your number and click Inbound

c Add the Twilio service to the app

Begin by adding the Bluemix Twilio service to your app

i In DevOps Services click EDIT CODE in the upper-right corner

ii Click the Open application dashboard button ( ) The Bluemix page for your

app opens

iii Click ADD A SERVICE OR API

13

iv Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

v Click the Twilio service

vi In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

vii Click CREATE

viii When prompted restage your application now by clicking RESTAGE

ix Wait for the page to indicate that your app is running

d Add code that uses the Twilio service

Add code to your app that sends a text message whenever a price is retrieved for an

item Use the Twilio service to actually send the text message

i Add Twilio to requirementstxt

Your app needs the Twilio module so you must add it to the requirementstxt

file

1 In the Web IDE open requirementstxt

2 Add a new line to the end of the file and type twilio

3 Select File gt Save

ii Connect to the Twilio service

To effectively use your Twilio service you must connect to it

1 In the Web IDE open the wsgipy file

2 In the Imports section around Line 55 add the following line from twiliorest import TwilioRestClient

3 As part of the for loop that begins around Line 65 add the following

lines

Note Be sure your spacing before these two lines (spaces and tabs) is

identical to the if statement that checks if the key starts with

ldquocloudantrdquo

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

4 Your Twilio credentials are now stored in twilio_creds Your code

should now look like the following listing

14

for key value in decoded_configiteritems()

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

if keystartswith(cloudant)

cloudant_creds = decoded_config[key][0][credentials]

cloudant_host = cloudant_creds[host]

cloudant_port = int(cloudant_creds[port])

cloudant_username = cloudant_creds[username]

cloudant_password = cloudant_creds[password]

cloudant_url = str(cloudant_creds[url])

account = cloudantAccount(cloudant_username)

login = accountlogin(cloudant_username cloudant_password)

assert loginstatus_code == 200

db = accountdatabase(dbname)

response = dbput()

print responsejson

5 Save your changes by selecting File gt Save

e Add code to send the text message

Now comes the fun part Its time to code

Continue to work in the wsgipy file and create a new function around Line 89 that

sends a text message def sendTextWithMessage(message)

message = twilioClientmessagescreate(to=+15555555555 from_=+15555555555

body=message)

f Replace the to number with the cell phone number or Twilio number where you want

the text messages to be sent (dont forget the country code)

g Replace the from number with your Twilio phone number (dont forget the country

code)

h In the getCurrentPrice function inside of the if statement that checks if the

price is not None add the following line of code sendTextWithMessage(The current price of s is s (item[name] price))

i Save your changes by selecting File gt Save

Thats it Youve implemented your feature with only nine lines of code

3 Deploy and test the feature

Now its time to deploy your application to Bluemix so you can test it

a Click the Deploy button ( )

b If prompted if you want to stop and redeploy click OK

c After your application has finished deploying click the Open URL button ( ) in the top

gray bar

d In your app click Get Prices

15

e Check your phone or Twilio number for a text message

If you like update the prices of the items in the store and get the prices again

4 Push the feature to the repository

Now that your feature is tested its time to push your changes to the Git repository

a In the leftmost bar of icons click the Git Repository button ( )

b In the box in the Working Directory Changes section type a comment similar to the

following being sure to replace 20 with the work item ID associated with the work item

you created Changes to implement the text messaging feature as

described in work item 20

c Select each change in the Changed Files section and click the COMMIT button

d In the OUTGOING section click PUSH

e If you are prompted for your committer information enter it and click OK

5 Complete the feature

To indicate that you have finished your feature mark your work item as complete

a In the Web IDE click TRACK amp PLAN in the upper-right corner

b In the right pane find your work item associated with the text messaging feature and

click the Status In Progress icon

c Click Set Done

d In the right pane scroll right until you see the RESOLVED section Notice that your work

item is now marked done

6 Discover the traceability

When you added a comment in your commit that mentioned your work item a link was

automatically created for you between the change and the work item

a In the right pane scroll to the Resolved view if you are not currently viewing your

resolved work items

b Click the textual summary of the work item associated with the text messaging feature

to open it

c In the work item click the Links tab

d In the LINKS section notice that a link was automatically generated for you Click the

link The Git Log displays

e Observe that you have a summary of the git commit and its associated work items

f Click GIT LOG in the left navigation to see a list of all of your git commits

16

Tweet this

Collaborate with me on this Bluemix app I created [insert link to your app] [include a

screenshot of the Web IDE with your codemdashTweets with images are more likely to get noticed]

Get creative

Invite a friend to join your project Navigate to your projects home page click Members and

invite a friend to join

Create new work items for features yoursquod like to implement or defects you find

Implement some of the stories you created or fix the defects you recorded

Additional resources

Twilio SMS and MMS Python Quickstart httpswwwtwiliocomdocsquickstartpythonsms

Managing Distributed Teams

httpswwwscrumallianceorgcommunityarticles2013julymanaging-distributed-

teamsaspx

So Long Scrum Hello Kanban httpsstormpathcomblogso-long-scrum-hello-kanban

17

Part 1D Deploying Automatically Using the Delivery Pipeline

Learn this

Deployment automation is one of the keys to a successful DevOps approach

You can create a complete delivery pipeline with multiple stages automated tests and

automatic deploys using DevOps Services

Try this

You can configure a multi-stage build and deployment pipeline to support your DevOps approach to

software development In this section you will configure a builder a deployment to your

development (dev) space and a deployment to your production (prod) space

1 Create a production space

Organizations and spaces are organizational units in the Cloud Foundry infrastructure that can

be used to store and track application resources An organization contains domains spaces and

users a space contains applications and services By default a dev (development) space is

created for you

a Navigate to the Bluemix dashboard if you are not there already

b Click Create a Space in the left menu

c In the Create a Space dialog input prod as your space name and click CREATE

2 Create services for deployments to your dev space

When deploying to your dev and prod spaces you will likely want to have services dedicated to

those deployments For example you want to use separate databases for each space Wersquoll

begin by creating services for each space

a Navigate to the Bluemix dashboard if you are not there already

b Click CATALOG

c Create the Cloudant NoSQL DB service

i Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data

and Analytics section The catalog is constantly being updated with new

services

ii Click the Cloudant NoSQL DB service

iii In the Space dropdown choose dev

iv In the App dropdown choose Leave unbound

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 2: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

1

Table of Contents Part 1A Deploying amp Updating a Simple App 2

Part 1B Deploying an App that Uses a Bluemix Service 6

Part 1C Planning Tracking amp Leveraging New Bluemix Services 9

Part 1D Deploying Automatically Using the Delivery Pipeline 17

Part 2A Live Edit 23

Part 2B Bluemix Debug 27

2

Part 1A Deploying amp Updating a Simple App Part 1 of this lab is broken into three pieces and demonstrates how easy it is to use IBM Bluemix DevOps

Services to plan code and deploy applications In part 1A youll learn how to deploy and make changes to a

simple application In part 1B youll learn how to deploy an application that uses a Bluemix service In part 1C

youll learn how to use the planning capabilities in DevOps Services to plan and track your app how to add a

new Bluemix service to an application and how to write code that leverages a Bluemix service Finally in part

1D yoursquoll learn how to use a delivery pipeline to automatically deploy changes to your app whenever code is

pushed to your projectrsquos repository

As a bonus youll also get an application that checks the prices of items in online stores for you so you dont

have to surf the web to see if your favorite items are on sale

Before we get started lets discuss the products well be using in this lab

IBM Bluemix DevOps Services is a place where you can collaborate with others to develop track plan

and deploy software

IBM Bluemix is an open-standards cloud-based platform where you can run the applications you develop

in DevOps Services Bluemix provides a variety of services that you can leverage in your applications so

you dont have to start coding from scratch

In part 1A youll be working with a sample online store called Laurens Lovely Landscapes The store currently

sells three prints each prints page displays the name image and price associated with the print

3

Learn this

1 Forking a project means to take a copy of the code in an existing project and put it in to a new

project

2 Making changes to an application can be fast and simple when you use the DevOps Services

Web IDE However users of DevOps Services can use whatever IDE they prefer when coding

Try this

1 Sign up for Bluemix and DevOps Services

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Fork Laurenrsquos Lovely Landscapes

At DevOps Services forking a project means taking a copy of the code in an existing project and

putting it in a new project

a Go to the Laurens Lovely Landscapes project overview page httpsibmbizcds-lll

b Click Edit Code in the upper-right corner You might be prompted to authenticate if you

have not already done so The Web IDE opens

c Select Tools gt Fork

d Type a name for your project leave the Add features for Scrum development and Make

this a Bluemix Project boxes checked and click CREATE

e Note that when the project has finished forking your new project name is listed in the

upper-left corner

Now you have a copy of the code in your own project The next step is to deploy it

3 Deploy Laurenrsquos Lovely Landscapes

To deploy an application means to bundle the project artifacts create an app at Bluemix

transfer the bundled app to Bluemix and start the app Bluemix application names and URLs are

created using properties which are often defined in the manifestyml file in a project The

Laurens Lovely Landscapes project already has the manifest created for you

a In the left navigation pane of the Web IDE select manifestyml

b Click the deploy button ( ) in the top bar

4

Note When you deploy through the Web IDE you are deploying the changes that are in

your Web IDErsquos workspace For example you may have changes you are currently

working on that you have not yet pushed to your projectrsquos repository Those changes

will be deployed

4 See Laurenrsquos Lovely Landscapes running

After your application is deployed to Bluemix a green dot displays in the status area of the top

gray bar

a Click the Open URL button ( ) in the top bar

b Browse your application that is running live on Bluemix Click on the Antarctica page and

note that the current price is $10000

5 Update the price of an item

Make a change to the application by updating the price of an item

a In the left pane of the Web IDE expand views and select antarcticatpl

b Scroll down until you see ltdiv id=pricegt10000ltdivgt

c Replace 10000 with 9999 (Wow thats a big sale -) )

d Click File gt Save

e Click the Deploy button ( )

f If prompted to stop and redeploy your app click OK

g After your application is deployed click the Open URL button ( ) in the top gray bar

h In your app that opens click Antarctica

Notice that the price of the item has been updated Success

Tweet this

Getting SaaS-y Just deployed an app to the cloud by leveraging Bluemix DevOpsServices

Check it out [insert link to your app] [Feeling extra sassy Include a selfie of you looking sassy]

Get creative

Laurenrsquos Lovely Landscapes is yours now Change the name change the color scheme change

the pictures or go crazy and implement a shopping cart Make the site your own and redeploy

5

Additional resources

MQTT Starfighter JazzHub Bluemix and live Scaling Out

httpswwwyoutubecomwatchv=b9hkCHmH7H4

Computerworld Forecast Study 2015 httpwwwidgenterprisecomreportcomputerworld-

forecast-study-2015

Transforming Enterprise Cloud Services

httpbooksgooglecombooksid=yyiPyIXgbxMCamppg=PA55v=onepageampqampf=false

Rapidly create a Nodejs app using a Bluemix boilerplate and DevOps Services

httpwwwibmcomdeveloperworkslibraryd-Bluemix-devops90indexhtml

6

Part 1B Deploying an App that Uses a Bluemix Service In this part youll be working with the Laurens Lovely Landscapes app you created in part 1A Youll also be

working with The Fabulous Price Finder app The Fabulous Price Finder provides you with the current prices of

items youre interested in purchasing online with the simple click of a button

Learn this

Leveraging Bluemix services like database services Watson services and DevOps Services makes

creating and managing apps easier

Deploying apps that leverage Bluemix services can be fast and easy

Try this

1 Fork the Fabulous Price Finder

a Go to the Fabulous Price Finder project overview page httpsibmbizcds-fbf

b Click EDIT CODE in the upper-right corner You might be prompted to authenticate if

you have not already done so

c Select Tools gt Fork

d Type a name for your project leave the Add features for Scrum development and Make

this a Bluemix Project boxes checked and click CREATE

e Note that when the project has finished forking your new project name is listed in the

upper-left corner

7

2 Deploy the Fabulous Price Finder

The Fabulous Price Finder uses the Cloudant NoSQL DB service hosted at Bluemix The Cloudant

database service provides access to a fully managed NoSQL JSON data layer thatrsquos always on To

get the Fabulous Price Finder running you deploy the application and then bind a new Cloudant

NoSQL DB instance to the application

a In the left navigation pane select manifestyml

b Click the Deploy ( ) button in the top gray bar Note that when the app finishes

deploying the database functionality will not yet work because you have not bound a

Cloudant NoSQL DB instance to it

c When the application is deployed click the Open application dashboard button ( ) in

the top gray bar

d If you are not already authenticated at Bluemix you might be prompted to do so After

you are authenticated you are redirected to your applications page on Bluemix

e Click ADD A SERVICE OR API

f Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data and

Analytics section The catalog is constantly being updated with new services

g Click the Cloudant NoSQL DB service

h In the Cloudant NoSQL DB dialog leave the defaults in the dialog (the code assumes the

name of your Cloudant NoSQL DB service starts with cloudant) and click CREATE

i When prompted if you want to restage your application now click RESTAGE

j When the page indicates your app is running click your applications route to open it

3 Try the Fabulous Price Finder

Now that you have the Fabulous Price Finder running its time to explore

The home page of the Fabulous Price Finder enables you to record the items for which you want

to check prices You begin with the Antarctica print from the Laurens Lovely Landscapes app

you deployed

a In the form on the home page specify the name for the print (Antarctica) the URL for

the print from your online store (Hint Look for something similar to

httplaurenslovelylandscapes-some-long-string-of-random-

charactersmybluemixnetantarctica) and the id of the price field for the print

(price)

b Click Submit

You are redirected to the View Database page where you can see information about the item

you just stored You can record the details for other items if you like

8

4 Get Prices

After you have stored information about an item you can check its price

a On the home page click Get Prices

b On the Success page click View the database

Notice that the price of your item is now stored in the database If you like go back to your

Laurens Lovely Lanscapes project update the price of the Antarctica print (dont forget to

deploy your change) and click Get Prices again Note that the database reflects the new price of

the print

5 Explore the Cloudant Database

You can browse and update the contents of your Cloudant database which can be helpful when

debugging and working with your app

a Go to the Bluemix dashboard

b Log in if you are not already authenticated

c On the dashboard click on your FabulousPriceFinder app to open it

d Click your Cloudant NoSQL DB service tile to open it

e Click LAUNCH

f In the Databases section click on your database to open it

g Browse the documents youve added to your database

Tweet this

Check out the app I just deployed that leverages a Cloudant database on Bluemix [insert link

to your app]

Get creative

Enhance the apprsquos navigation so it is easier to move around the site or change the name of the

app to be less ldquofabulousrdquo and more you Make it your own

Additional resources

Cloudant-Python httpsgithubcomcloudant-labscloudant-python

Develop and manage Java apps with IBM Bluemix and DevOps Services

httpwwwibmcomdeveloperworkslibraryd-Bluemix-javadevopsindexhtml

9

Part 1C Planning Tracking amp Leveraging New Bluemix Services

Learn this

Leveraging software as a service that works well with the platform as a service of your choice

can greatly speed up your software delivery lifecycle

Agile planning and tracking is simple in the cloud and creates built-in traceability for all of your

teammateshellipwhether they are collocated or distributed

Writing code that leverages a Bluemix service can be fast and significantly reduce development

time

Try this

1 Plan a new feature to add to the Fabulous Price Finder

So far you have made use of existing code but you havent created anything new Time to

change that

When working with teammates or even by yourself organizing your ideas into user stories and

then organizing your user stories into a plan can be incredibly valuable

a Open Track amp Plan

i Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated

and clicking on your project on the My Projects page

ii Click the gear button ( ) in the upper-right corner to open the Project

Settings page

iii Click OPTIONS

iv On the page that loads select the Enable Track amp Plan checkbox (if it is not

already enabled) and click SAVE

v Click TRACK amp PLAN in the upper-right corner The Track amp Plan section is your

place to organize your ideas

b Create work items in your backlog

i On the left pane click Backlog

ii On the right pane type the following in the Create a work itemhellip field As a shopper I want a text message sent to me with the

price of each item so that I dont have to check the

website to view the prices

10

iii The tool will automatically detect the work item type is story and set the type

for you

iv In the icon bar below click the Owned By icon and select your username

v Click CREATE

vi Repeat Steps 2-5 to create work items for the following stories

1 As a shopper I want to organize my items by

store so that I only have to input the field ID

once per store instead of every item

2 As a shopper I want to see a graph of the price

of the items Im watching over time so I can

judge if its a good time to buy the items

3 As a shopper I want the prices to be retrieved

automatically for me on a daily basis so I dont

have to log in manually and click Get Prices

4 As a shopper I want the prices to be texted to

me only when the price has changed so Im not

getting inundated with text messages

vii Create a work item of type defect with the following summary The View

Database page fails to load when the database is empty

c Plan your work

Now that you have filled your backlog with stories its time to plan your first sprint

i On the left pane click Sprint Planning A sprint represents a period of time

Organize your user stories in sprints

ii Click Add Sprints

iii Configure the sprints so you have at least two and click Create

iv In the Backlog section rearrange your stories so they are in a ranked order by

dragging and dropping them Put As a shopper I want a text message sent to me with the price of each item so that

I dont have to check the website to view the prices as

the top item in the list and As a shopper I want the prices to be retrieved automatically for me on a daily basis so

I dont have to log in manually and click Get Prices as

the second highest item in the list

v Click the Sprint 1 dropbdown box and select Sprint 1 so that Sprint 1 appears to

the right of the backlog (You may need to click Sprint 2 and then click Sprint 1

in order for the sprint to appear)

11

vi Assume you have time to complete one user story per sprint Drag the topmost

item in the list to Sprint 1 (on the right)

vii In the sprint dropdown box select Sprint 2

viii Drag the new top most item to Sprint 2

d Track your work

Sprint 1 has begun Indicate that you have started working on the first work item by

marking it as In Progress

i In the sprint dropdown box select Sprint 1

ii In the Sprint 1 section click the Status New icon ( ) for the story planned

for Sprint 1

iii In the Status dialog click Start Working

iv Note the work item ID for your work item because you will need it later in this

lab

2 Implement the feature

Next implement the work item As a shopper I want a text message sent to me with the price of each item so that I dont have to check the

website to view the prices The idea of implementing a text messaging feature

might sound a bit daunting to you Fortunately Bluemix provides a Twilio service you can use

that handles sending the text message so you can implement this feature with only nine lines of

code

a Register with Twilio

If you do not already have an account with Twilio you need to register You also need

your Twilio AccountSID Auth Token and phone number

1 Go to httpswwwtwiliocom and sign up

2 Follow the on-screen instructions to verify your account

3 Note your Twilio phone number

4 After you have authenticated and are viewing your account click your ID in the

right corner and select Account

5 In the API Credentials section note your AccountSID and AuthToken (You

might want to leave this page open as you continue so you can easily copy the

credentials)

b If you do not want to receive text messages

If you do not want to receive text messages to your phone because your carrier charges

ridiculous amounts you can instead send the text messages to your Twilio account

12

phone number If yoursquore ok with receiving text messages on your phone skip this

section and continue on to step c

i In Twilio click NUMBERS in the top navigation bar

ii Click your phone number in the Number table

iii In the Messaging section replace the Request URL with any valid url (this

prevents a never ending loop of your phone number sending a response to the

text message it just received) For example you might replace the Request URL

with a link to your Laurenrsquos Lovely Landscapes app

iv Click Save

v Click Numbers in the top navigation bar

vi Click Verify a number

vii Click text you instead

viii Input your Twilio phone number in the Phone Number box

ix Click Text Me

x In a new tab or window navigate to twiliocom and click Account

xi Click NUMBERS in the top navigation bar

xii Click your number in the Number table

xiii Click Inbound in the Messaging section

xiv Hover over the text message in the table to see the incoming message Note

the verification number in the text messagersquos body

xv Return to your original tab or window and input the verification number

xvi Click Submit

When you want to view incoming text messages for your Twilio number return to the

details page for your number and click Inbound

c Add the Twilio service to the app

Begin by adding the Bluemix Twilio service to your app

i In DevOps Services click EDIT CODE in the upper-right corner

ii Click the Open application dashboard button ( ) The Bluemix page for your

app opens

iii Click ADD A SERVICE OR API

13

iv Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

v Click the Twilio service

vi In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

vii Click CREATE

viii When prompted restage your application now by clicking RESTAGE

ix Wait for the page to indicate that your app is running

d Add code that uses the Twilio service

Add code to your app that sends a text message whenever a price is retrieved for an

item Use the Twilio service to actually send the text message

i Add Twilio to requirementstxt

Your app needs the Twilio module so you must add it to the requirementstxt

file

1 In the Web IDE open requirementstxt

2 Add a new line to the end of the file and type twilio

3 Select File gt Save

ii Connect to the Twilio service

To effectively use your Twilio service you must connect to it

1 In the Web IDE open the wsgipy file

2 In the Imports section around Line 55 add the following line from twiliorest import TwilioRestClient

3 As part of the for loop that begins around Line 65 add the following

lines

Note Be sure your spacing before these two lines (spaces and tabs) is

identical to the if statement that checks if the key starts with

ldquocloudantrdquo

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

4 Your Twilio credentials are now stored in twilio_creds Your code

should now look like the following listing

14

for key value in decoded_configiteritems()

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

if keystartswith(cloudant)

cloudant_creds = decoded_config[key][0][credentials]

cloudant_host = cloudant_creds[host]

cloudant_port = int(cloudant_creds[port])

cloudant_username = cloudant_creds[username]

cloudant_password = cloudant_creds[password]

cloudant_url = str(cloudant_creds[url])

account = cloudantAccount(cloudant_username)

login = accountlogin(cloudant_username cloudant_password)

assert loginstatus_code == 200

db = accountdatabase(dbname)

response = dbput()

print responsejson

5 Save your changes by selecting File gt Save

e Add code to send the text message

Now comes the fun part Its time to code

Continue to work in the wsgipy file and create a new function around Line 89 that

sends a text message def sendTextWithMessage(message)

message = twilioClientmessagescreate(to=+15555555555 from_=+15555555555

body=message)

f Replace the to number with the cell phone number or Twilio number where you want

the text messages to be sent (dont forget the country code)

g Replace the from number with your Twilio phone number (dont forget the country

code)

h In the getCurrentPrice function inside of the if statement that checks if the

price is not None add the following line of code sendTextWithMessage(The current price of s is s (item[name] price))

i Save your changes by selecting File gt Save

Thats it Youve implemented your feature with only nine lines of code

3 Deploy and test the feature

Now its time to deploy your application to Bluemix so you can test it

a Click the Deploy button ( )

b If prompted if you want to stop and redeploy click OK

c After your application has finished deploying click the Open URL button ( ) in the top

gray bar

d In your app click Get Prices

15

e Check your phone or Twilio number for a text message

If you like update the prices of the items in the store and get the prices again

4 Push the feature to the repository

Now that your feature is tested its time to push your changes to the Git repository

a In the leftmost bar of icons click the Git Repository button ( )

b In the box in the Working Directory Changes section type a comment similar to the

following being sure to replace 20 with the work item ID associated with the work item

you created Changes to implement the text messaging feature as

described in work item 20

c Select each change in the Changed Files section and click the COMMIT button

d In the OUTGOING section click PUSH

e If you are prompted for your committer information enter it and click OK

5 Complete the feature

To indicate that you have finished your feature mark your work item as complete

a In the Web IDE click TRACK amp PLAN in the upper-right corner

b In the right pane find your work item associated with the text messaging feature and

click the Status In Progress icon

c Click Set Done

d In the right pane scroll right until you see the RESOLVED section Notice that your work

item is now marked done

6 Discover the traceability

When you added a comment in your commit that mentioned your work item a link was

automatically created for you between the change and the work item

a In the right pane scroll to the Resolved view if you are not currently viewing your

resolved work items

b Click the textual summary of the work item associated with the text messaging feature

to open it

c In the work item click the Links tab

d In the LINKS section notice that a link was automatically generated for you Click the

link The Git Log displays

e Observe that you have a summary of the git commit and its associated work items

f Click GIT LOG in the left navigation to see a list of all of your git commits

16

Tweet this

Collaborate with me on this Bluemix app I created [insert link to your app] [include a

screenshot of the Web IDE with your codemdashTweets with images are more likely to get noticed]

Get creative

Invite a friend to join your project Navigate to your projects home page click Members and

invite a friend to join

Create new work items for features yoursquod like to implement or defects you find

Implement some of the stories you created or fix the defects you recorded

Additional resources

Twilio SMS and MMS Python Quickstart httpswwwtwiliocomdocsquickstartpythonsms

Managing Distributed Teams

httpswwwscrumallianceorgcommunityarticles2013julymanaging-distributed-

teamsaspx

So Long Scrum Hello Kanban httpsstormpathcomblogso-long-scrum-hello-kanban

17

Part 1D Deploying Automatically Using the Delivery Pipeline

Learn this

Deployment automation is one of the keys to a successful DevOps approach

You can create a complete delivery pipeline with multiple stages automated tests and

automatic deploys using DevOps Services

Try this

You can configure a multi-stage build and deployment pipeline to support your DevOps approach to

software development In this section you will configure a builder a deployment to your

development (dev) space and a deployment to your production (prod) space

1 Create a production space

Organizations and spaces are organizational units in the Cloud Foundry infrastructure that can

be used to store and track application resources An organization contains domains spaces and

users a space contains applications and services By default a dev (development) space is

created for you

a Navigate to the Bluemix dashboard if you are not there already

b Click Create a Space in the left menu

c In the Create a Space dialog input prod as your space name and click CREATE

2 Create services for deployments to your dev space

When deploying to your dev and prod spaces you will likely want to have services dedicated to

those deployments For example you want to use separate databases for each space Wersquoll

begin by creating services for each space

a Navigate to the Bluemix dashboard if you are not there already

b Click CATALOG

c Create the Cloudant NoSQL DB service

i Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data

and Analytics section The catalog is constantly being updated with new

services

ii Click the Cloudant NoSQL DB service

iii In the Space dropdown choose dev

iv In the App dropdown choose Leave unbound

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 3: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

2

Part 1A Deploying amp Updating a Simple App Part 1 of this lab is broken into three pieces and demonstrates how easy it is to use IBM Bluemix DevOps

Services to plan code and deploy applications In part 1A youll learn how to deploy and make changes to a

simple application In part 1B youll learn how to deploy an application that uses a Bluemix service In part 1C

youll learn how to use the planning capabilities in DevOps Services to plan and track your app how to add a

new Bluemix service to an application and how to write code that leverages a Bluemix service Finally in part

1D yoursquoll learn how to use a delivery pipeline to automatically deploy changes to your app whenever code is

pushed to your projectrsquos repository

As a bonus youll also get an application that checks the prices of items in online stores for you so you dont

have to surf the web to see if your favorite items are on sale

Before we get started lets discuss the products well be using in this lab

IBM Bluemix DevOps Services is a place where you can collaborate with others to develop track plan

and deploy software

IBM Bluemix is an open-standards cloud-based platform where you can run the applications you develop

in DevOps Services Bluemix provides a variety of services that you can leverage in your applications so

you dont have to start coding from scratch

In part 1A youll be working with a sample online store called Laurens Lovely Landscapes The store currently

sells three prints each prints page displays the name image and price associated with the print

3

Learn this

1 Forking a project means to take a copy of the code in an existing project and put it in to a new

project

2 Making changes to an application can be fast and simple when you use the DevOps Services

Web IDE However users of DevOps Services can use whatever IDE they prefer when coding

Try this

1 Sign up for Bluemix and DevOps Services

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Fork Laurenrsquos Lovely Landscapes

At DevOps Services forking a project means taking a copy of the code in an existing project and

putting it in a new project

a Go to the Laurens Lovely Landscapes project overview page httpsibmbizcds-lll

b Click Edit Code in the upper-right corner You might be prompted to authenticate if you

have not already done so The Web IDE opens

c Select Tools gt Fork

d Type a name for your project leave the Add features for Scrum development and Make

this a Bluemix Project boxes checked and click CREATE

e Note that when the project has finished forking your new project name is listed in the

upper-left corner

Now you have a copy of the code in your own project The next step is to deploy it

3 Deploy Laurenrsquos Lovely Landscapes

To deploy an application means to bundle the project artifacts create an app at Bluemix

transfer the bundled app to Bluemix and start the app Bluemix application names and URLs are

created using properties which are often defined in the manifestyml file in a project The

Laurens Lovely Landscapes project already has the manifest created for you

a In the left navigation pane of the Web IDE select manifestyml

b Click the deploy button ( ) in the top bar

4

Note When you deploy through the Web IDE you are deploying the changes that are in

your Web IDErsquos workspace For example you may have changes you are currently

working on that you have not yet pushed to your projectrsquos repository Those changes

will be deployed

4 See Laurenrsquos Lovely Landscapes running

After your application is deployed to Bluemix a green dot displays in the status area of the top

gray bar

a Click the Open URL button ( ) in the top bar

b Browse your application that is running live on Bluemix Click on the Antarctica page and

note that the current price is $10000

5 Update the price of an item

Make a change to the application by updating the price of an item

a In the left pane of the Web IDE expand views and select antarcticatpl

b Scroll down until you see ltdiv id=pricegt10000ltdivgt

c Replace 10000 with 9999 (Wow thats a big sale -) )

d Click File gt Save

e Click the Deploy button ( )

f If prompted to stop and redeploy your app click OK

g After your application is deployed click the Open URL button ( ) in the top gray bar

h In your app that opens click Antarctica

Notice that the price of the item has been updated Success

Tweet this

Getting SaaS-y Just deployed an app to the cloud by leveraging Bluemix DevOpsServices

Check it out [insert link to your app] [Feeling extra sassy Include a selfie of you looking sassy]

Get creative

Laurenrsquos Lovely Landscapes is yours now Change the name change the color scheme change

the pictures or go crazy and implement a shopping cart Make the site your own and redeploy

5

Additional resources

MQTT Starfighter JazzHub Bluemix and live Scaling Out

httpswwwyoutubecomwatchv=b9hkCHmH7H4

Computerworld Forecast Study 2015 httpwwwidgenterprisecomreportcomputerworld-

forecast-study-2015

Transforming Enterprise Cloud Services

httpbooksgooglecombooksid=yyiPyIXgbxMCamppg=PA55v=onepageampqampf=false

Rapidly create a Nodejs app using a Bluemix boilerplate and DevOps Services

httpwwwibmcomdeveloperworkslibraryd-Bluemix-devops90indexhtml

6

Part 1B Deploying an App that Uses a Bluemix Service In this part youll be working with the Laurens Lovely Landscapes app you created in part 1A Youll also be

working with The Fabulous Price Finder app The Fabulous Price Finder provides you with the current prices of

items youre interested in purchasing online with the simple click of a button

Learn this

Leveraging Bluemix services like database services Watson services and DevOps Services makes

creating and managing apps easier

Deploying apps that leverage Bluemix services can be fast and easy

Try this

1 Fork the Fabulous Price Finder

a Go to the Fabulous Price Finder project overview page httpsibmbizcds-fbf

b Click EDIT CODE in the upper-right corner You might be prompted to authenticate if

you have not already done so

c Select Tools gt Fork

d Type a name for your project leave the Add features for Scrum development and Make

this a Bluemix Project boxes checked and click CREATE

e Note that when the project has finished forking your new project name is listed in the

upper-left corner

7

2 Deploy the Fabulous Price Finder

The Fabulous Price Finder uses the Cloudant NoSQL DB service hosted at Bluemix The Cloudant

database service provides access to a fully managed NoSQL JSON data layer thatrsquos always on To

get the Fabulous Price Finder running you deploy the application and then bind a new Cloudant

NoSQL DB instance to the application

a In the left navigation pane select manifestyml

b Click the Deploy ( ) button in the top gray bar Note that when the app finishes

deploying the database functionality will not yet work because you have not bound a

Cloudant NoSQL DB instance to it

c When the application is deployed click the Open application dashboard button ( ) in

the top gray bar

d If you are not already authenticated at Bluemix you might be prompted to do so After

you are authenticated you are redirected to your applications page on Bluemix

e Click ADD A SERVICE OR API

f Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data and

Analytics section The catalog is constantly being updated with new services

g Click the Cloudant NoSQL DB service

h In the Cloudant NoSQL DB dialog leave the defaults in the dialog (the code assumes the

name of your Cloudant NoSQL DB service starts with cloudant) and click CREATE

i When prompted if you want to restage your application now click RESTAGE

j When the page indicates your app is running click your applications route to open it

3 Try the Fabulous Price Finder

Now that you have the Fabulous Price Finder running its time to explore

The home page of the Fabulous Price Finder enables you to record the items for which you want

to check prices You begin with the Antarctica print from the Laurens Lovely Landscapes app

you deployed

a In the form on the home page specify the name for the print (Antarctica) the URL for

the print from your online store (Hint Look for something similar to

httplaurenslovelylandscapes-some-long-string-of-random-

charactersmybluemixnetantarctica) and the id of the price field for the print

(price)

b Click Submit

You are redirected to the View Database page where you can see information about the item

you just stored You can record the details for other items if you like

8

4 Get Prices

After you have stored information about an item you can check its price

a On the home page click Get Prices

b On the Success page click View the database

Notice that the price of your item is now stored in the database If you like go back to your

Laurens Lovely Lanscapes project update the price of the Antarctica print (dont forget to

deploy your change) and click Get Prices again Note that the database reflects the new price of

the print

5 Explore the Cloudant Database

You can browse and update the contents of your Cloudant database which can be helpful when

debugging and working with your app

a Go to the Bluemix dashboard

b Log in if you are not already authenticated

c On the dashboard click on your FabulousPriceFinder app to open it

d Click your Cloudant NoSQL DB service tile to open it

e Click LAUNCH

f In the Databases section click on your database to open it

g Browse the documents youve added to your database

Tweet this

Check out the app I just deployed that leverages a Cloudant database on Bluemix [insert link

to your app]

Get creative

Enhance the apprsquos navigation so it is easier to move around the site or change the name of the

app to be less ldquofabulousrdquo and more you Make it your own

Additional resources

Cloudant-Python httpsgithubcomcloudant-labscloudant-python

Develop and manage Java apps with IBM Bluemix and DevOps Services

httpwwwibmcomdeveloperworkslibraryd-Bluemix-javadevopsindexhtml

9

Part 1C Planning Tracking amp Leveraging New Bluemix Services

Learn this

Leveraging software as a service that works well with the platform as a service of your choice

can greatly speed up your software delivery lifecycle

Agile planning and tracking is simple in the cloud and creates built-in traceability for all of your

teammateshellipwhether they are collocated or distributed

Writing code that leverages a Bluemix service can be fast and significantly reduce development

time

Try this

1 Plan a new feature to add to the Fabulous Price Finder

So far you have made use of existing code but you havent created anything new Time to

change that

When working with teammates or even by yourself organizing your ideas into user stories and

then organizing your user stories into a plan can be incredibly valuable

a Open Track amp Plan

i Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated

and clicking on your project on the My Projects page

ii Click the gear button ( ) in the upper-right corner to open the Project

Settings page

iii Click OPTIONS

iv On the page that loads select the Enable Track amp Plan checkbox (if it is not

already enabled) and click SAVE

v Click TRACK amp PLAN in the upper-right corner The Track amp Plan section is your

place to organize your ideas

b Create work items in your backlog

i On the left pane click Backlog

ii On the right pane type the following in the Create a work itemhellip field As a shopper I want a text message sent to me with the

price of each item so that I dont have to check the

website to view the prices

10

iii The tool will automatically detect the work item type is story and set the type

for you

iv In the icon bar below click the Owned By icon and select your username

v Click CREATE

vi Repeat Steps 2-5 to create work items for the following stories

1 As a shopper I want to organize my items by

store so that I only have to input the field ID

once per store instead of every item

2 As a shopper I want to see a graph of the price

of the items Im watching over time so I can

judge if its a good time to buy the items

3 As a shopper I want the prices to be retrieved

automatically for me on a daily basis so I dont

have to log in manually and click Get Prices

4 As a shopper I want the prices to be texted to

me only when the price has changed so Im not

getting inundated with text messages

vii Create a work item of type defect with the following summary The View

Database page fails to load when the database is empty

c Plan your work

Now that you have filled your backlog with stories its time to plan your first sprint

i On the left pane click Sprint Planning A sprint represents a period of time

Organize your user stories in sprints

ii Click Add Sprints

iii Configure the sprints so you have at least two and click Create

iv In the Backlog section rearrange your stories so they are in a ranked order by

dragging and dropping them Put As a shopper I want a text message sent to me with the price of each item so that

I dont have to check the website to view the prices as

the top item in the list and As a shopper I want the prices to be retrieved automatically for me on a daily basis so

I dont have to log in manually and click Get Prices as

the second highest item in the list

v Click the Sprint 1 dropbdown box and select Sprint 1 so that Sprint 1 appears to

the right of the backlog (You may need to click Sprint 2 and then click Sprint 1

in order for the sprint to appear)

11

vi Assume you have time to complete one user story per sprint Drag the topmost

item in the list to Sprint 1 (on the right)

vii In the sprint dropdown box select Sprint 2

viii Drag the new top most item to Sprint 2

d Track your work

Sprint 1 has begun Indicate that you have started working on the first work item by

marking it as In Progress

i In the sprint dropdown box select Sprint 1

ii In the Sprint 1 section click the Status New icon ( ) for the story planned

for Sprint 1

iii In the Status dialog click Start Working

iv Note the work item ID for your work item because you will need it later in this

lab

2 Implement the feature

Next implement the work item As a shopper I want a text message sent to me with the price of each item so that I dont have to check the

website to view the prices The idea of implementing a text messaging feature

might sound a bit daunting to you Fortunately Bluemix provides a Twilio service you can use

that handles sending the text message so you can implement this feature with only nine lines of

code

a Register with Twilio

If you do not already have an account with Twilio you need to register You also need

your Twilio AccountSID Auth Token and phone number

1 Go to httpswwwtwiliocom and sign up

2 Follow the on-screen instructions to verify your account

3 Note your Twilio phone number

4 After you have authenticated and are viewing your account click your ID in the

right corner and select Account

5 In the API Credentials section note your AccountSID and AuthToken (You

might want to leave this page open as you continue so you can easily copy the

credentials)

b If you do not want to receive text messages

If you do not want to receive text messages to your phone because your carrier charges

ridiculous amounts you can instead send the text messages to your Twilio account

12

phone number If yoursquore ok with receiving text messages on your phone skip this

section and continue on to step c

i In Twilio click NUMBERS in the top navigation bar

ii Click your phone number in the Number table

iii In the Messaging section replace the Request URL with any valid url (this

prevents a never ending loop of your phone number sending a response to the

text message it just received) For example you might replace the Request URL

with a link to your Laurenrsquos Lovely Landscapes app

iv Click Save

v Click Numbers in the top navigation bar

vi Click Verify a number

vii Click text you instead

viii Input your Twilio phone number in the Phone Number box

ix Click Text Me

x In a new tab or window navigate to twiliocom and click Account

xi Click NUMBERS in the top navigation bar

xii Click your number in the Number table

xiii Click Inbound in the Messaging section

xiv Hover over the text message in the table to see the incoming message Note

the verification number in the text messagersquos body

xv Return to your original tab or window and input the verification number

xvi Click Submit

When you want to view incoming text messages for your Twilio number return to the

details page for your number and click Inbound

c Add the Twilio service to the app

Begin by adding the Bluemix Twilio service to your app

i In DevOps Services click EDIT CODE in the upper-right corner

ii Click the Open application dashboard button ( ) The Bluemix page for your

app opens

iii Click ADD A SERVICE OR API

13

iv Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

v Click the Twilio service

vi In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

vii Click CREATE

viii When prompted restage your application now by clicking RESTAGE

ix Wait for the page to indicate that your app is running

d Add code that uses the Twilio service

Add code to your app that sends a text message whenever a price is retrieved for an

item Use the Twilio service to actually send the text message

i Add Twilio to requirementstxt

Your app needs the Twilio module so you must add it to the requirementstxt

file

1 In the Web IDE open requirementstxt

2 Add a new line to the end of the file and type twilio

3 Select File gt Save

ii Connect to the Twilio service

To effectively use your Twilio service you must connect to it

1 In the Web IDE open the wsgipy file

2 In the Imports section around Line 55 add the following line from twiliorest import TwilioRestClient

3 As part of the for loop that begins around Line 65 add the following

lines

Note Be sure your spacing before these two lines (spaces and tabs) is

identical to the if statement that checks if the key starts with

ldquocloudantrdquo

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

4 Your Twilio credentials are now stored in twilio_creds Your code

should now look like the following listing

14

for key value in decoded_configiteritems()

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

if keystartswith(cloudant)

cloudant_creds = decoded_config[key][0][credentials]

cloudant_host = cloudant_creds[host]

cloudant_port = int(cloudant_creds[port])

cloudant_username = cloudant_creds[username]

cloudant_password = cloudant_creds[password]

cloudant_url = str(cloudant_creds[url])

account = cloudantAccount(cloudant_username)

login = accountlogin(cloudant_username cloudant_password)

assert loginstatus_code == 200

db = accountdatabase(dbname)

response = dbput()

print responsejson

5 Save your changes by selecting File gt Save

e Add code to send the text message

Now comes the fun part Its time to code

Continue to work in the wsgipy file and create a new function around Line 89 that

sends a text message def sendTextWithMessage(message)

message = twilioClientmessagescreate(to=+15555555555 from_=+15555555555

body=message)

f Replace the to number with the cell phone number or Twilio number where you want

the text messages to be sent (dont forget the country code)

g Replace the from number with your Twilio phone number (dont forget the country

code)

h In the getCurrentPrice function inside of the if statement that checks if the

price is not None add the following line of code sendTextWithMessage(The current price of s is s (item[name] price))

i Save your changes by selecting File gt Save

Thats it Youve implemented your feature with only nine lines of code

3 Deploy and test the feature

Now its time to deploy your application to Bluemix so you can test it

a Click the Deploy button ( )

b If prompted if you want to stop and redeploy click OK

c After your application has finished deploying click the Open URL button ( ) in the top

gray bar

d In your app click Get Prices

15

e Check your phone or Twilio number for a text message

If you like update the prices of the items in the store and get the prices again

4 Push the feature to the repository

Now that your feature is tested its time to push your changes to the Git repository

a In the leftmost bar of icons click the Git Repository button ( )

b In the box in the Working Directory Changes section type a comment similar to the

following being sure to replace 20 with the work item ID associated with the work item

you created Changes to implement the text messaging feature as

described in work item 20

c Select each change in the Changed Files section and click the COMMIT button

d In the OUTGOING section click PUSH

e If you are prompted for your committer information enter it and click OK

5 Complete the feature

To indicate that you have finished your feature mark your work item as complete

a In the Web IDE click TRACK amp PLAN in the upper-right corner

b In the right pane find your work item associated with the text messaging feature and

click the Status In Progress icon

c Click Set Done

d In the right pane scroll right until you see the RESOLVED section Notice that your work

item is now marked done

6 Discover the traceability

When you added a comment in your commit that mentioned your work item a link was

automatically created for you between the change and the work item

a In the right pane scroll to the Resolved view if you are not currently viewing your

resolved work items

b Click the textual summary of the work item associated with the text messaging feature

to open it

c In the work item click the Links tab

d In the LINKS section notice that a link was automatically generated for you Click the

link The Git Log displays

e Observe that you have a summary of the git commit and its associated work items

f Click GIT LOG in the left navigation to see a list of all of your git commits

16

Tweet this

Collaborate with me on this Bluemix app I created [insert link to your app] [include a

screenshot of the Web IDE with your codemdashTweets with images are more likely to get noticed]

Get creative

Invite a friend to join your project Navigate to your projects home page click Members and

invite a friend to join

Create new work items for features yoursquod like to implement or defects you find

Implement some of the stories you created or fix the defects you recorded

Additional resources

Twilio SMS and MMS Python Quickstart httpswwwtwiliocomdocsquickstartpythonsms

Managing Distributed Teams

httpswwwscrumallianceorgcommunityarticles2013julymanaging-distributed-

teamsaspx

So Long Scrum Hello Kanban httpsstormpathcomblogso-long-scrum-hello-kanban

17

Part 1D Deploying Automatically Using the Delivery Pipeline

Learn this

Deployment automation is one of the keys to a successful DevOps approach

You can create a complete delivery pipeline with multiple stages automated tests and

automatic deploys using DevOps Services

Try this

You can configure a multi-stage build and deployment pipeline to support your DevOps approach to

software development In this section you will configure a builder a deployment to your

development (dev) space and a deployment to your production (prod) space

1 Create a production space

Organizations and spaces are organizational units in the Cloud Foundry infrastructure that can

be used to store and track application resources An organization contains domains spaces and

users a space contains applications and services By default a dev (development) space is

created for you

a Navigate to the Bluemix dashboard if you are not there already

b Click Create a Space in the left menu

c In the Create a Space dialog input prod as your space name and click CREATE

2 Create services for deployments to your dev space

When deploying to your dev and prod spaces you will likely want to have services dedicated to

those deployments For example you want to use separate databases for each space Wersquoll

begin by creating services for each space

a Navigate to the Bluemix dashboard if you are not there already

b Click CATALOG

c Create the Cloudant NoSQL DB service

i Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data

and Analytics section The catalog is constantly being updated with new

services

ii Click the Cloudant NoSQL DB service

iii In the Space dropdown choose dev

iv In the App dropdown choose Leave unbound

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 4: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

3

Learn this

1 Forking a project means to take a copy of the code in an existing project and put it in to a new

project

2 Making changes to an application can be fast and simple when you use the DevOps Services

Web IDE However users of DevOps Services can use whatever IDE they prefer when coding

Try this

1 Sign up for Bluemix and DevOps Services

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Fork Laurenrsquos Lovely Landscapes

At DevOps Services forking a project means taking a copy of the code in an existing project and

putting it in a new project

a Go to the Laurens Lovely Landscapes project overview page httpsibmbizcds-lll

b Click Edit Code in the upper-right corner You might be prompted to authenticate if you

have not already done so The Web IDE opens

c Select Tools gt Fork

d Type a name for your project leave the Add features for Scrum development and Make

this a Bluemix Project boxes checked and click CREATE

e Note that when the project has finished forking your new project name is listed in the

upper-left corner

Now you have a copy of the code in your own project The next step is to deploy it

3 Deploy Laurenrsquos Lovely Landscapes

To deploy an application means to bundle the project artifacts create an app at Bluemix

transfer the bundled app to Bluemix and start the app Bluemix application names and URLs are

created using properties which are often defined in the manifestyml file in a project The

Laurens Lovely Landscapes project already has the manifest created for you

a In the left navigation pane of the Web IDE select manifestyml

b Click the deploy button ( ) in the top bar

4

Note When you deploy through the Web IDE you are deploying the changes that are in

your Web IDErsquos workspace For example you may have changes you are currently

working on that you have not yet pushed to your projectrsquos repository Those changes

will be deployed

4 See Laurenrsquos Lovely Landscapes running

After your application is deployed to Bluemix a green dot displays in the status area of the top

gray bar

a Click the Open URL button ( ) in the top bar

b Browse your application that is running live on Bluemix Click on the Antarctica page and

note that the current price is $10000

5 Update the price of an item

Make a change to the application by updating the price of an item

a In the left pane of the Web IDE expand views and select antarcticatpl

b Scroll down until you see ltdiv id=pricegt10000ltdivgt

c Replace 10000 with 9999 (Wow thats a big sale -) )

d Click File gt Save

e Click the Deploy button ( )

f If prompted to stop and redeploy your app click OK

g After your application is deployed click the Open URL button ( ) in the top gray bar

h In your app that opens click Antarctica

Notice that the price of the item has been updated Success

Tweet this

Getting SaaS-y Just deployed an app to the cloud by leveraging Bluemix DevOpsServices

Check it out [insert link to your app] [Feeling extra sassy Include a selfie of you looking sassy]

Get creative

Laurenrsquos Lovely Landscapes is yours now Change the name change the color scheme change

the pictures or go crazy and implement a shopping cart Make the site your own and redeploy

5

Additional resources

MQTT Starfighter JazzHub Bluemix and live Scaling Out

httpswwwyoutubecomwatchv=b9hkCHmH7H4

Computerworld Forecast Study 2015 httpwwwidgenterprisecomreportcomputerworld-

forecast-study-2015

Transforming Enterprise Cloud Services

httpbooksgooglecombooksid=yyiPyIXgbxMCamppg=PA55v=onepageampqampf=false

Rapidly create a Nodejs app using a Bluemix boilerplate and DevOps Services

httpwwwibmcomdeveloperworkslibraryd-Bluemix-devops90indexhtml

6

Part 1B Deploying an App that Uses a Bluemix Service In this part youll be working with the Laurens Lovely Landscapes app you created in part 1A Youll also be

working with The Fabulous Price Finder app The Fabulous Price Finder provides you with the current prices of

items youre interested in purchasing online with the simple click of a button

Learn this

Leveraging Bluemix services like database services Watson services and DevOps Services makes

creating and managing apps easier

Deploying apps that leverage Bluemix services can be fast and easy

Try this

1 Fork the Fabulous Price Finder

a Go to the Fabulous Price Finder project overview page httpsibmbizcds-fbf

b Click EDIT CODE in the upper-right corner You might be prompted to authenticate if

you have not already done so

c Select Tools gt Fork

d Type a name for your project leave the Add features for Scrum development and Make

this a Bluemix Project boxes checked and click CREATE

e Note that when the project has finished forking your new project name is listed in the

upper-left corner

7

2 Deploy the Fabulous Price Finder

The Fabulous Price Finder uses the Cloudant NoSQL DB service hosted at Bluemix The Cloudant

database service provides access to a fully managed NoSQL JSON data layer thatrsquos always on To

get the Fabulous Price Finder running you deploy the application and then bind a new Cloudant

NoSQL DB instance to the application

a In the left navigation pane select manifestyml

b Click the Deploy ( ) button in the top gray bar Note that when the app finishes

deploying the database functionality will not yet work because you have not bound a

Cloudant NoSQL DB instance to it

c When the application is deployed click the Open application dashboard button ( ) in

the top gray bar

d If you are not already authenticated at Bluemix you might be prompted to do so After

you are authenticated you are redirected to your applications page on Bluemix

e Click ADD A SERVICE OR API

f Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data and

Analytics section The catalog is constantly being updated with new services

g Click the Cloudant NoSQL DB service

h In the Cloudant NoSQL DB dialog leave the defaults in the dialog (the code assumes the

name of your Cloudant NoSQL DB service starts with cloudant) and click CREATE

i When prompted if you want to restage your application now click RESTAGE

j When the page indicates your app is running click your applications route to open it

3 Try the Fabulous Price Finder

Now that you have the Fabulous Price Finder running its time to explore

The home page of the Fabulous Price Finder enables you to record the items for which you want

to check prices You begin with the Antarctica print from the Laurens Lovely Landscapes app

you deployed

a In the form on the home page specify the name for the print (Antarctica) the URL for

the print from your online store (Hint Look for something similar to

httplaurenslovelylandscapes-some-long-string-of-random-

charactersmybluemixnetantarctica) and the id of the price field for the print

(price)

b Click Submit

You are redirected to the View Database page where you can see information about the item

you just stored You can record the details for other items if you like

8

4 Get Prices

After you have stored information about an item you can check its price

a On the home page click Get Prices

b On the Success page click View the database

Notice that the price of your item is now stored in the database If you like go back to your

Laurens Lovely Lanscapes project update the price of the Antarctica print (dont forget to

deploy your change) and click Get Prices again Note that the database reflects the new price of

the print

5 Explore the Cloudant Database

You can browse and update the contents of your Cloudant database which can be helpful when

debugging and working with your app

a Go to the Bluemix dashboard

b Log in if you are not already authenticated

c On the dashboard click on your FabulousPriceFinder app to open it

d Click your Cloudant NoSQL DB service tile to open it

e Click LAUNCH

f In the Databases section click on your database to open it

g Browse the documents youve added to your database

Tweet this

Check out the app I just deployed that leverages a Cloudant database on Bluemix [insert link

to your app]

Get creative

Enhance the apprsquos navigation so it is easier to move around the site or change the name of the

app to be less ldquofabulousrdquo and more you Make it your own

Additional resources

Cloudant-Python httpsgithubcomcloudant-labscloudant-python

Develop and manage Java apps with IBM Bluemix and DevOps Services

httpwwwibmcomdeveloperworkslibraryd-Bluemix-javadevopsindexhtml

9

Part 1C Planning Tracking amp Leveraging New Bluemix Services

Learn this

Leveraging software as a service that works well with the platform as a service of your choice

can greatly speed up your software delivery lifecycle

Agile planning and tracking is simple in the cloud and creates built-in traceability for all of your

teammateshellipwhether they are collocated or distributed

Writing code that leverages a Bluemix service can be fast and significantly reduce development

time

Try this

1 Plan a new feature to add to the Fabulous Price Finder

So far you have made use of existing code but you havent created anything new Time to

change that

When working with teammates or even by yourself organizing your ideas into user stories and

then organizing your user stories into a plan can be incredibly valuable

a Open Track amp Plan

i Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated

and clicking on your project on the My Projects page

ii Click the gear button ( ) in the upper-right corner to open the Project

Settings page

iii Click OPTIONS

iv On the page that loads select the Enable Track amp Plan checkbox (if it is not

already enabled) and click SAVE

v Click TRACK amp PLAN in the upper-right corner The Track amp Plan section is your

place to organize your ideas

b Create work items in your backlog

i On the left pane click Backlog

ii On the right pane type the following in the Create a work itemhellip field As a shopper I want a text message sent to me with the

price of each item so that I dont have to check the

website to view the prices

10

iii The tool will automatically detect the work item type is story and set the type

for you

iv In the icon bar below click the Owned By icon and select your username

v Click CREATE

vi Repeat Steps 2-5 to create work items for the following stories

1 As a shopper I want to organize my items by

store so that I only have to input the field ID

once per store instead of every item

2 As a shopper I want to see a graph of the price

of the items Im watching over time so I can

judge if its a good time to buy the items

3 As a shopper I want the prices to be retrieved

automatically for me on a daily basis so I dont

have to log in manually and click Get Prices

4 As a shopper I want the prices to be texted to

me only when the price has changed so Im not

getting inundated with text messages

vii Create a work item of type defect with the following summary The View

Database page fails to load when the database is empty

c Plan your work

Now that you have filled your backlog with stories its time to plan your first sprint

i On the left pane click Sprint Planning A sprint represents a period of time

Organize your user stories in sprints

ii Click Add Sprints

iii Configure the sprints so you have at least two and click Create

iv In the Backlog section rearrange your stories so they are in a ranked order by

dragging and dropping them Put As a shopper I want a text message sent to me with the price of each item so that

I dont have to check the website to view the prices as

the top item in the list and As a shopper I want the prices to be retrieved automatically for me on a daily basis so

I dont have to log in manually and click Get Prices as

the second highest item in the list

v Click the Sprint 1 dropbdown box and select Sprint 1 so that Sprint 1 appears to

the right of the backlog (You may need to click Sprint 2 and then click Sprint 1

in order for the sprint to appear)

11

vi Assume you have time to complete one user story per sprint Drag the topmost

item in the list to Sprint 1 (on the right)

vii In the sprint dropdown box select Sprint 2

viii Drag the new top most item to Sprint 2

d Track your work

Sprint 1 has begun Indicate that you have started working on the first work item by

marking it as In Progress

i In the sprint dropdown box select Sprint 1

ii In the Sprint 1 section click the Status New icon ( ) for the story planned

for Sprint 1

iii In the Status dialog click Start Working

iv Note the work item ID for your work item because you will need it later in this

lab

2 Implement the feature

Next implement the work item As a shopper I want a text message sent to me with the price of each item so that I dont have to check the

website to view the prices The idea of implementing a text messaging feature

might sound a bit daunting to you Fortunately Bluemix provides a Twilio service you can use

that handles sending the text message so you can implement this feature with only nine lines of

code

a Register with Twilio

If you do not already have an account with Twilio you need to register You also need

your Twilio AccountSID Auth Token and phone number

1 Go to httpswwwtwiliocom and sign up

2 Follow the on-screen instructions to verify your account

3 Note your Twilio phone number

4 After you have authenticated and are viewing your account click your ID in the

right corner and select Account

5 In the API Credentials section note your AccountSID and AuthToken (You

might want to leave this page open as you continue so you can easily copy the

credentials)

b If you do not want to receive text messages

If you do not want to receive text messages to your phone because your carrier charges

ridiculous amounts you can instead send the text messages to your Twilio account

12

phone number If yoursquore ok with receiving text messages on your phone skip this

section and continue on to step c

i In Twilio click NUMBERS in the top navigation bar

ii Click your phone number in the Number table

iii In the Messaging section replace the Request URL with any valid url (this

prevents a never ending loop of your phone number sending a response to the

text message it just received) For example you might replace the Request URL

with a link to your Laurenrsquos Lovely Landscapes app

iv Click Save

v Click Numbers in the top navigation bar

vi Click Verify a number

vii Click text you instead

viii Input your Twilio phone number in the Phone Number box

ix Click Text Me

x In a new tab or window navigate to twiliocom and click Account

xi Click NUMBERS in the top navigation bar

xii Click your number in the Number table

xiii Click Inbound in the Messaging section

xiv Hover over the text message in the table to see the incoming message Note

the verification number in the text messagersquos body

xv Return to your original tab or window and input the verification number

xvi Click Submit

When you want to view incoming text messages for your Twilio number return to the

details page for your number and click Inbound

c Add the Twilio service to the app

Begin by adding the Bluemix Twilio service to your app

i In DevOps Services click EDIT CODE in the upper-right corner

ii Click the Open application dashboard button ( ) The Bluemix page for your

app opens

iii Click ADD A SERVICE OR API

13

iv Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

v Click the Twilio service

vi In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

vii Click CREATE

viii When prompted restage your application now by clicking RESTAGE

ix Wait for the page to indicate that your app is running

d Add code that uses the Twilio service

Add code to your app that sends a text message whenever a price is retrieved for an

item Use the Twilio service to actually send the text message

i Add Twilio to requirementstxt

Your app needs the Twilio module so you must add it to the requirementstxt

file

1 In the Web IDE open requirementstxt

2 Add a new line to the end of the file and type twilio

3 Select File gt Save

ii Connect to the Twilio service

To effectively use your Twilio service you must connect to it

1 In the Web IDE open the wsgipy file

2 In the Imports section around Line 55 add the following line from twiliorest import TwilioRestClient

3 As part of the for loop that begins around Line 65 add the following

lines

Note Be sure your spacing before these two lines (spaces and tabs) is

identical to the if statement that checks if the key starts with

ldquocloudantrdquo

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

4 Your Twilio credentials are now stored in twilio_creds Your code

should now look like the following listing

14

for key value in decoded_configiteritems()

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

if keystartswith(cloudant)

cloudant_creds = decoded_config[key][0][credentials]

cloudant_host = cloudant_creds[host]

cloudant_port = int(cloudant_creds[port])

cloudant_username = cloudant_creds[username]

cloudant_password = cloudant_creds[password]

cloudant_url = str(cloudant_creds[url])

account = cloudantAccount(cloudant_username)

login = accountlogin(cloudant_username cloudant_password)

assert loginstatus_code == 200

db = accountdatabase(dbname)

response = dbput()

print responsejson

5 Save your changes by selecting File gt Save

e Add code to send the text message

Now comes the fun part Its time to code

Continue to work in the wsgipy file and create a new function around Line 89 that

sends a text message def sendTextWithMessage(message)

message = twilioClientmessagescreate(to=+15555555555 from_=+15555555555

body=message)

f Replace the to number with the cell phone number or Twilio number where you want

the text messages to be sent (dont forget the country code)

g Replace the from number with your Twilio phone number (dont forget the country

code)

h In the getCurrentPrice function inside of the if statement that checks if the

price is not None add the following line of code sendTextWithMessage(The current price of s is s (item[name] price))

i Save your changes by selecting File gt Save

Thats it Youve implemented your feature with only nine lines of code

3 Deploy and test the feature

Now its time to deploy your application to Bluemix so you can test it

a Click the Deploy button ( )

b If prompted if you want to stop and redeploy click OK

c After your application has finished deploying click the Open URL button ( ) in the top

gray bar

d In your app click Get Prices

15

e Check your phone or Twilio number for a text message

If you like update the prices of the items in the store and get the prices again

4 Push the feature to the repository

Now that your feature is tested its time to push your changes to the Git repository

a In the leftmost bar of icons click the Git Repository button ( )

b In the box in the Working Directory Changes section type a comment similar to the

following being sure to replace 20 with the work item ID associated with the work item

you created Changes to implement the text messaging feature as

described in work item 20

c Select each change in the Changed Files section and click the COMMIT button

d In the OUTGOING section click PUSH

e If you are prompted for your committer information enter it and click OK

5 Complete the feature

To indicate that you have finished your feature mark your work item as complete

a In the Web IDE click TRACK amp PLAN in the upper-right corner

b In the right pane find your work item associated with the text messaging feature and

click the Status In Progress icon

c Click Set Done

d In the right pane scroll right until you see the RESOLVED section Notice that your work

item is now marked done

6 Discover the traceability

When you added a comment in your commit that mentioned your work item a link was

automatically created for you between the change and the work item

a In the right pane scroll to the Resolved view if you are not currently viewing your

resolved work items

b Click the textual summary of the work item associated with the text messaging feature

to open it

c In the work item click the Links tab

d In the LINKS section notice that a link was automatically generated for you Click the

link The Git Log displays

e Observe that you have a summary of the git commit and its associated work items

f Click GIT LOG in the left navigation to see a list of all of your git commits

16

Tweet this

Collaborate with me on this Bluemix app I created [insert link to your app] [include a

screenshot of the Web IDE with your codemdashTweets with images are more likely to get noticed]

Get creative

Invite a friend to join your project Navigate to your projects home page click Members and

invite a friend to join

Create new work items for features yoursquod like to implement or defects you find

Implement some of the stories you created or fix the defects you recorded

Additional resources

Twilio SMS and MMS Python Quickstart httpswwwtwiliocomdocsquickstartpythonsms

Managing Distributed Teams

httpswwwscrumallianceorgcommunityarticles2013julymanaging-distributed-

teamsaspx

So Long Scrum Hello Kanban httpsstormpathcomblogso-long-scrum-hello-kanban

17

Part 1D Deploying Automatically Using the Delivery Pipeline

Learn this

Deployment automation is one of the keys to a successful DevOps approach

You can create a complete delivery pipeline with multiple stages automated tests and

automatic deploys using DevOps Services

Try this

You can configure a multi-stage build and deployment pipeline to support your DevOps approach to

software development In this section you will configure a builder a deployment to your

development (dev) space and a deployment to your production (prod) space

1 Create a production space

Organizations and spaces are organizational units in the Cloud Foundry infrastructure that can

be used to store and track application resources An organization contains domains spaces and

users a space contains applications and services By default a dev (development) space is

created for you

a Navigate to the Bluemix dashboard if you are not there already

b Click Create a Space in the left menu

c In the Create a Space dialog input prod as your space name and click CREATE

2 Create services for deployments to your dev space

When deploying to your dev and prod spaces you will likely want to have services dedicated to

those deployments For example you want to use separate databases for each space Wersquoll

begin by creating services for each space

a Navigate to the Bluemix dashboard if you are not there already

b Click CATALOG

c Create the Cloudant NoSQL DB service

i Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data

and Analytics section The catalog is constantly being updated with new

services

ii Click the Cloudant NoSQL DB service

iii In the Space dropdown choose dev

iv In the App dropdown choose Leave unbound

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 5: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

4

Note When you deploy through the Web IDE you are deploying the changes that are in

your Web IDErsquos workspace For example you may have changes you are currently

working on that you have not yet pushed to your projectrsquos repository Those changes

will be deployed

4 See Laurenrsquos Lovely Landscapes running

After your application is deployed to Bluemix a green dot displays in the status area of the top

gray bar

a Click the Open URL button ( ) in the top bar

b Browse your application that is running live on Bluemix Click on the Antarctica page and

note that the current price is $10000

5 Update the price of an item

Make a change to the application by updating the price of an item

a In the left pane of the Web IDE expand views and select antarcticatpl

b Scroll down until you see ltdiv id=pricegt10000ltdivgt

c Replace 10000 with 9999 (Wow thats a big sale -) )

d Click File gt Save

e Click the Deploy button ( )

f If prompted to stop and redeploy your app click OK

g After your application is deployed click the Open URL button ( ) in the top gray bar

h In your app that opens click Antarctica

Notice that the price of the item has been updated Success

Tweet this

Getting SaaS-y Just deployed an app to the cloud by leveraging Bluemix DevOpsServices

Check it out [insert link to your app] [Feeling extra sassy Include a selfie of you looking sassy]

Get creative

Laurenrsquos Lovely Landscapes is yours now Change the name change the color scheme change

the pictures or go crazy and implement a shopping cart Make the site your own and redeploy

5

Additional resources

MQTT Starfighter JazzHub Bluemix and live Scaling Out

httpswwwyoutubecomwatchv=b9hkCHmH7H4

Computerworld Forecast Study 2015 httpwwwidgenterprisecomreportcomputerworld-

forecast-study-2015

Transforming Enterprise Cloud Services

httpbooksgooglecombooksid=yyiPyIXgbxMCamppg=PA55v=onepageampqampf=false

Rapidly create a Nodejs app using a Bluemix boilerplate and DevOps Services

httpwwwibmcomdeveloperworkslibraryd-Bluemix-devops90indexhtml

6

Part 1B Deploying an App that Uses a Bluemix Service In this part youll be working with the Laurens Lovely Landscapes app you created in part 1A Youll also be

working with The Fabulous Price Finder app The Fabulous Price Finder provides you with the current prices of

items youre interested in purchasing online with the simple click of a button

Learn this

Leveraging Bluemix services like database services Watson services and DevOps Services makes

creating and managing apps easier

Deploying apps that leverage Bluemix services can be fast and easy

Try this

1 Fork the Fabulous Price Finder

a Go to the Fabulous Price Finder project overview page httpsibmbizcds-fbf

b Click EDIT CODE in the upper-right corner You might be prompted to authenticate if

you have not already done so

c Select Tools gt Fork

d Type a name for your project leave the Add features for Scrum development and Make

this a Bluemix Project boxes checked and click CREATE

e Note that when the project has finished forking your new project name is listed in the

upper-left corner

7

2 Deploy the Fabulous Price Finder

The Fabulous Price Finder uses the Cloudant NoSQL DB service hosted at Bluemix The Cloudant

database service provides access to a fully managed NoSQL JSON data layer thatrsquos always on To

get the Fabulous Price Finder running you deploy the application and then bind a new Cloudant

NoSQL DB instance to the application

a In the left navigation pane select manifestyml

b Click the Deploy ( ) button in the top gray bar Note that when the app finishes

deploying the database functionality will not yet work because you have not bound a

Cloudant NoSQL DB instance to it

c When the application is deployed click the Open application dashboard button ( ) in

the top gray bar

d If you are not already authenticated at Bluemix you might be prompted to do so After

you are authenticated you are redirected to your applications page on Bluemix

e Click ADD A SERVICE OR API

f Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data and

Analytics section The catalog is constantly being updated with new services

g Click the Cloudant NoSQL DB service

h In the Cloudant NoSQL DB dialog leave the defaults in the dialog (the code assumes the

name of your Cloudant NoSQL DB service starts with cloudant) and click CREATE

i When prompted if you want to restage your application now click RESTAGE

j When the page indicates your app is running click your applications route to open it

3 Try the Fabulous Price Finder

Now that you have the Fabulous Price Finder running its time to explore

The home page of the Fabulous Price Finder enables you to record the items for which you want

to check prices You begin with the Antarctica print from the Laurens Lovely Landscapes app

you deployed

a In the form on the home page specify the name for the print (Antarctica) the URL for

the print from your online store (Hint Look for something similar to

httplaurenslovelylandscapes-some-long-string-of-random-

charactersmybluemixnetantarctica) and the id of the price field for the print

(price)

b Click Submit

You are redirected to the View Database page where you can see information about the item

you just stored You can record the details for other items if you like

8

4 Get Prices

After you have stored information about an item you can check its price

a On the home page click Get Prices

b On the Success page click View the database

Notice that the price of your item is now stored in the database If you like go back to your

Laurens Lovely Lanscapes project update the price of the Antarctica print (dont forget to

deploy your change) and click Get Prices again Note that the database reflects the new price of

the print

5 Explore the Cloudant Database

You can browse and update the contents of your Cloudant database which can be helpful when

debugging and working with your app

a Go to the Bluemix dashboard

b Log in if you are not already authenticated

c On the dashboard click on your FabulousPriceFinder app to open it

d Click your Cloudant NoSQL DB service tile to open it

e Click LAUNCH

f In the Databases section click on your database to open it

g Browse the documents youve added to your database

Tweet this

Check out the app I just deployed that leverages a Cloudant database on Bluemix [insert link

to your app]

Get creative

Enhance the apprsquos navigation so it is easier to move around the site or change the name of the

app to be less ldquofabulousrdquo and more you Make it your own

Additional resources

Cloudant-Python httpsgithubcomcloudant-labscloudant-python

Develop and manage Java apps with IBM Bluemix and DevOps Services

httpwwwibmcomdeveloperworkslibraryd-Bluemix-javadevopsindexhtml

9

Part 1C Planning Tracking amp Leveraging New Bluemix Services

Learn this

Leveraging software as a service that works well with the platform as a service of your choice

can greatly speed up your software delivery lifecycle

Agile planning and tracking is simple in the cloud and creates built-in traceability for all of your

teammateshellipwhether they are collocated or distributed

Writing code that leverages a Bluemix service can be fast and significantly reduce development

time

Try this

1 Plan a new feature to add to the Fabulous Price Finder

So far you have made use of existing code but you havent created anything new Time to

change that

When working with teammates or even by yourself organizing your ideas into user stories and

then organizing your user stories into a plan can be incredibly valuable

a Open Track amp Plan

i Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated

and clicking on your project on the My Projects page

ii Click the gear button ( ) in the upper-right corner to open the Project

Settings page

iii Click OPTIONS

iv On the page that loads select the Enable Track amp Plan checkbox (if it is not

already enabled) and click SAVE

v Click TRACK amp PLAN in the upper-right corner The Track amp Plan section is your

place to organize your ideas

b Create work items in your backlog

i On the left pane click Backlog

ii On the right pane type the following in the Create a work itemhellip field As a shopper I want a text message sent to me with the

price of each item so that I dont have to check the

website to view the prices

10

iii The tool will automatically detect the work item type is story and set the type

for you

iv In the icon bar below click the Owned By icon and select your username

v Click CREATE

vi Repeat Steps 2-5 to create work items for the following stories

1 As a shopper I want to organize my items by

store so that I only have to input the field ID

once per store instead of every item

2 As a shopper I want to see a graph of the price

of the items Im watching over time so I can

judge if its a good time to buy the items

3 As a shopper I want the prices to be retrieved

automatically for me on a daily basis so I dont

have to log in manually and click Get Prices

4 As a shopper I want the prices to be texted to

me only when the price has changed so Im not

getting inundated with text messages

vii Create a work item of type defect with the following summary The View

Database page fails to load when the database is empty

c Plan your work

Now that you have filled your backlog with stories its time to plan your first sprint

i On the left pane click Sprint Planning A sprint represents a period of time

Organize your user stories in sprints

ii Click Add Sprints

iii Configure the sprints so you have at least two and click Create

iv In the Backlog section rearrange your stories so they are in a ranked order by

dragging and dropping them Put As a shopper I want a text message sent to me with the price of each item so that

I dont have to check the website to view the prices as

the top item in the list and As a shopper I want the prices to be retrieved automatically for me on a daily basis so

I dont have to log in manually and click Get Prices as

the second highest item in the list

v Click the Sprint 1 dropbdown box and select Sprint 1 so that Sprint 1 appears to

the right of the backlog (You may need to click Sprint 2 and then click Sprint 1

in order for the sprint to appear)

11

vi Assume you have time to complete one user story per sprint Drag the topmost

item in the list to Sprint 1 (on the right)

vii In the sprint dropdown box select Sprint 2

viii Drag the new top most item to Sprint 2

d Track your work

Sprint 1 has begun Indicate that you have started working on the first work item by

marking it as In Progress

i In the sprint dropdown box select Sprint 1

ii In the Sprint 1 section click the Status New icon ( ) for the story planned

for Sprint 1

iii In the Status dialog click Start Working

iv Note the work item ID for your work item because you will need it later in this

lab

2 Implement the feature

Next implement the work item As a shopper I want a text message sent to me with the price of each item so that I dont have to check the

website to view the prices The idea of implementing a text messaging feature

might sound a bit daunting to you Fortunately Bluemix provides a Twilio service you can use

that handles sending the text message so you can implement this feature with only nine lines of

code

a Register with Twilio

If you do not already have an account with Twilio you need to register You also need

your Twilio AccountSID Auth Token and phone number

1 Go to httpswwwtwiliocom and sign up

2 Follow the on-screen instructions to verify your account

3 Note your Twilio phone number

4 After you have authenticated and are viewing your account click your ID in the

right corner and select Account

5 In the API Credentials section note your AccountSID and AuthToken (You

might want to leave this page open as you continue so you can easily copy the

credentials)

b If you do not want to receive text messages

If you do not want to receive text messages to your phone because your carrier charges

ridiculous amounts you can instead send the text messages to your Twilio account

12

phone number If yoursquore ok with receiving text messages on your phone skip this

section and continue on to step c

i In Twilio click NUMBERS in the top navigation bar

ii Click your phone number in the Number table

iii In the Messaging section replace the Request URL with any valid url (this

prevents a never ending loop of your phone number sending a response to the

text message it just received) For example you might replace the Request URL

with a link to your Laurenrsquos Lovely Landscapes app

iv Click Save

v Click Numbers in the top navigation bar

vi Click Verify a number

vii Click text you instead

viii Input your Twilio phone number in the Phone Number box

ix Click Text Me

x In a new tab or window navigate to twiliocom and click Account

xi Click NUMBERS in the top navigation bar

xii Click your number in the Number table

xiii Click Inbound in the Messaging section

xiv Hover over the text message in the table to see the incoming message Note

the verification number in the text messagersquos body

xv Return to your original tab or window and input the verification number

xvi Click Submit

When you want to view incoming text messages for your Twilio number return to the

details page for your number and click Inbound

c Add the Twilio service to the app

Begin by adding the Bluemix Twilio service to your app

i In DevOps Services click EDIT CODE in the upper-right corner

ii Click the Open application dashboard button ( ) The Bluemix page for your

app opens

iii Click ADD A SERVICE OR API

13

iv Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

v Click the Twilio service

vi In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

vii Click CREATE

viii When prompted restage your application now by clicking RESTAGE

ix Wait for the page to indicate that your app is running

d Add code that uses the Twilio service

Add code to your app that sends a text message whenever a price is retrieved for an

item Use the Twilio service to actually send the text message

i Add Twilio to requirementstxt

Your app needs the Twilio module so you must add it to the requirementstxt

file

1 In the Web IDE open requirementstxt

2 Add a new line to the end of the file and type twilio

3 Select File gt Save

ii Connect to the Twilio service

To effectively use your Twilio service you must connect to it

1 In the Web IDE open the wsgipy file

2 In the Imports section around Line 55 add the following line from twiliorest import TwilioRestClient

3 As part of the for loop that begins around Line 65 add the following

lines

Note Be sure your spacing before these two lines (spaces and tabs) is

identical to the if statement that checks if the key starts with

ldquocloudantrdquo

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

4 Your Twilio credentials are now stored in twilio_creds Your code

should now look like the following listing

14

for key value in decoded_configiteritems()

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

if keystartswith(cloudant)

cloudant_creds = decoded_config[key][0][credentials]

cloudant_host = cloudant_creds[host]

cloudant_port = int(cloudant_creds[port])

cloudant_username = cloudant_creds[username]

cloudant_password = cloudant_creds[password]

cloudant_url = str(cloudant_creds[url])

account = cloudantAccount(cloudant_username)

login = accountlogin(cloudant_username cloudant_password)

assert loginstatus_code == 200

db = accountdatabase(dbname)

response = dbput()

print responsejson

5 Save your changes by selecting File gt Save

e Add code to send the text message

Now comes the fun part Its time to code

Continue to work in the wsgipy file and create a new function around Line 89 that

sends a text message def sendTextWithMessage(message)

message = twilioClientmessagescreate(to=+15555555555 from_=+15555555555

body=message)

f Replace the to number with the cell phone number or Twilio number where you want

the text messages to be sent (dont forget the country code)

g Replace the from number with your Twilio phone number (dont forget the country

code)

h In the getCurrentPrice function inside of the if statement that checks if the

price is not None add the following line of code sendTextWithMessage(The current price of s is s (item[name] price))

i Save your changes by selecting File gt Save

Thats it Youve implemented your feature with only nine lines of code

3 Deploy and test the feature

Now its time to deploy your application to Bluemix so you can test it

a Click the Deploy button ( )

b If prompted if you want to stop and redeploy click OK

c After your application has finished deploying click the Open URL button ( ) in the top

gray bar

d In your app click Get Prices

15

e Check your phone or Twilio number for a text message

If you like update the prices of the items in the store and get the prices again

4 Push the feature to the repository

Now that your feature is tested its time to push your changes to the Git repository

a In the leftmost bar of icons click the Git Repository button ( )

b In the box in the Working Directory Changes section type a comment similar to the

following being sure to replace 20 with the work item ID associated with the work item

you created Changes to implement the text messaging feature as

described in work item 20

c Select each change in the Changed Files section and click the COMMIT button

d In the OUTGOING section click PUSH

e If you are prompted for your committer information enter it and click OK

5 Complete the feature

To indicate that you have finished your feature mark your work item as complete

a In the Web IDE click TRACK amp PLAN in the upper-right corner

b In the right pane find your work item associated with the text messaging feature and

click the Status In Progress icon

c Click Set Done

d In the right pane scroll right until you see the RESOLVED section Notice that your work

item is now marked done

6 Discover the traceability

When you added a comment in your commit that mentioned your work item a link was

automatically created for you between the change and the work item

a In the right pane scroll to the Resolved view if you are not currently viewing your

resolved work items

b Click the textual summary of the work item associated with the text messaging feature

to open it

c In the work item click the Links tab

d In the LINKS section notice that a link was automatically generated for you Click the

link The Git Log displays

e Observe that you have a summary of the git commit and its associated work items

f Click GIT LOG in the left navigation to see a list of all of your git commits

16

Tweet this

Collaborate with me on this Bluemix app I created [insert link to your app] [include a

screenshot of the Web IDE with your codemdashTweets with images are more likely to get noticed]

Get creative

Invite a friend to join your project Navigate to your projects home page click Members and

invite a friend to join

Create new work items for features yoursquod like to implement or defects you find

Implement some of the stories you created or fix the defects you recorded

Additional resources

Twilio SMS and MMS Python Quickstart httpswwwtwiliocomdocsquickstartpythonsms

Managing Distributed Teams

httpswwwscrumallianceorgcommunityarticles2013julymanaging-distributed-

teamsaspx

So Long Scrum Hello Kanban httpsstormpathcomblogso-long-scrum-hello-kanban

17

Part 1D Deploying Automatically Using the Delivery Pipeline

Learn this

Deployment automation is one of the keys to a successful DevOps approach

You can create a complete delivery pipeline with multiple stages automated tests and

automatic deploys using DevOps Services

Try this

You can configure a multi-stage build and deployment pipeline to support your DevOps approach to

software development In this section you will configure a builder a deployment to your

development (dev) space and a deployment to your production (prod) space

1 Create a production space

Organizations and spaces are organizational units in the Cloud Foundry infrastructure that can

be used to store and track application resources An organization contains domains spaces and

users a space contains applications and services By default a dev (development) space is

created for you

a Navigate to the Bluemix dashboard if you are not there already

b Click Create a Space in the left menu

c In the Create a Space dialog input prod as your space name and click CREATE

2 Create services for deployments to your dev space

When deploying to your dev and prod spaces you will likely want to have services dedicated to

those deployments For example you want to use separate databases for each space Wersquoll

begin by creating services for each space

a Navigate to the Bluemix dashboard if you are not there already

b Click CATALOG

c Create the Cloudant NoSQL DB service

i Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data

and Analytics section The catalog is constantly being updated with new

services

ii Click the Cloudant NoSQL DB service

iii In the Space dropdown choose dev

iv In the App dropdown choose Leave unbound

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 6: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

5

Additional resources

MQTT Starfighter JazzHub Bluemix and live Scaling Out

httpswwwyoutubecomwatchv=b9hkCHmH7H4

Computerworld Forecast Study 2015 httpwwwidgenterprisecomreportcomputerworld-

forecast-study-2015

Transforming Enterprise Cloud Services

httpbooksgooglecombooksid=yyiPyIXgbxMCamppg=PA55v=onepageampqampf=false

Rapidly create a Nodejs app using a Bluemix boilerplate and DevOps Services

httpwwwibmcomdeveloperworkslibraryd-Bluemix-devops90indexhtml

6

Part 1B Deploying an App that Uses a Bluemix Service In this part youll be working with the Laurens Lovely Landscapes app you created in part 1A Youll also be

working with The Fabulous Price Finder app The Fabulous Price Finder provides you with the current prices of

items youre interested in purchasing online with the simple click of a button

Learn this

Leveraging Bluemix services like database services Watson services and DevOps Services makes

creating and managing apps easier

Deploying apps that leverage Bluemix services can be fast and easy

Try this

1 Fork the Fabulous Price Finder

a Go to the Fabulous Price Finder project overview page httpsibmbizcds-fbf

b Click EDIT CODE in the upper-right corner You might be prompted to authenticate if

you have not already done so

c Select Tools gt Fork

d Type a name for your project leave the Add features for Scrum development and Make

this a Bluemix Project boxes checked and click CREATE

e Note that when the project has finished forking your new project name is listed in the

upper-left corner

7

2 Deploy the Fabulous Price Finder

The Fabulous Price Finder uses the Cloudant NoSQL DB service hosted at Bluemix The Cloudant

database service provides access to a fully managed NoSQL JSON data layer thatrsquos always on To

get the Fabulous Price Finder running you deploy the application and then bind a new Cloudant

NoSQL DB instance to the application

a In the left navigation pane select manifestyml

b Click the Deploy ( ) button in the top gray bar Note that when the app finishes

deploying the database functionality will not yet work because you have not bound a

Cloudant NoSQL DB instance to it

c When the application is deployed click the Open application dashboard button ( ) in

the top gray bar

d If you are not already authenticated at Bluemix you might be prompted to do so After

you are authenticated you are redirected to your applications page on Bluemix

e Click ADD A SERVICE OR API

f Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data and

Analytics section The catalog is constantly being updated with new services

g Click the Cloudant NoSQL DB service

h In the Cloudant NoSQL DB dialog leave the defaults in the dialog (the code assumes the

name of your Cloudant NoSQL DB service starts with cloudant) and click CREATE

i When prompted if you want to restage your application now click RESTAGE

j When the page indicates your app is running click your applications route to open it

3 Try the Fabulous Price Finder

Now that you have the Fabulous Price Finder running its time to explore

The home page of the Fabulous Price Finder enables you to record the items for which you want

to check prices You begin with the Antarctica print from the Laurens Lovely Landscapes app

you deployed

a In the form on the home page specify the name for the print (Antarctica) the URL for

the print from your online store (Hint Look for something similar to

httplaurenslovelylandscapes-some-long-string-of-random-

charactersmybluemixnetantarctica) and the id of the price field for the print

(price)

b Click Submit

You are redirected to the View Database page where you can see information about the item

you just stored You can record the details for other items if you like

8

4 Get Prices

After you have stored information about an item you can check its price

a On the home page click Get Prices

b On the Success page click View the database

Notice that the price of your item is now stored in the database If you like go back to your

Laurens Lovely Lanscapes project update the price of the Antarctica print (dont forget to

deploy your change) and click Get Prices again Note that the database reflects the new price of

the print

5 Explore the Cloudant Database

You can browse and update the contents of your Cloudant database which can be helpful when

debugging and working with your app

a Go to the Bluemix dashboard

b Log in if you are not already authenticated

c On the dashboard click on your FabulousPriceFinder app to open it

d Click your Cloudant NoSQL DB service tile to open it

e Click LAUNCH

f In the Databases section click on your database to open it

g Browse the documents youve added to your database

Tweet this

Check out the app I just deployed that leverages a Cloudant database on Bluemix [insert link

to your app]

Get creative

Enhance the apprsquos navigation so it is easier to move around the site or change the name of the

app to be less ldquofabulousrdquo and more you Make it your own

Additional resources

Cloudant-Python httpsgithubcomcloudant-labscloudant-python

Develop and manage Java apps with IBM Bluemix and DevOps Services

httpwwwibmcomdeveloperworkslibraryd-Bluemix-javadevopsindexhtml

9

Part 1C Planning Tracking amp Leveraging New Bluemix Services

Learn this

Leveraging software as a service that works well with the platform as a service of your choice

can greatly speed up your software delivery lifecycle

Agile planning and tracking is simple in the cloud and creates built-in traceability for all of your

teammateshellipwhether they are collocated or distributed

Writing code that leverages a Bluemix service can be fast and significantly reduce development

time

Try this

1 Plan a new feature to add to the Fabulous Price Finder

So far you have made use of existing code but you havent created anything new Time to

change that

When working with teammates or even by yourself organizing your ideas into user stories and

then organizing your user stories into a plan can be incredibly valuable

a Open Track amp Plan

i Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated

and clicking on your project on the My Projects page

ii Click the gear button ( ) in the upper-right corner to open the Project

Settings page

iii Click OPTIONS

iv On the page that loads select the Enable Track amp Plan checkbox (if it is not

already enabled) and click SAVE

v Click TRACK amp PLAN in the upper-right corner The Track amp Plan section is your

place to organize your ideas

b Create work items in your backlog

i On the left pane click Backlog

ii On the right pane type the following in the Create a work itemhellip field As a shopper I want a text message sent to me with the

price of each item so that I dont have to check the

website to view the prices

10

iii The tool will automatically detect the work item type is story and set the type

for you

iv In the icon bar below click the Owned By icon and select your username

v Click CREATE

vi Repeat Steps 2-5 to create work items for the following stories

1 As a shopper I want to organize my items by

store so that I only have to input the field ID

once per store instead of every item

2 As a shopper I want to see a graph of the price

of the items Im watching over time so I can

judge if its a good time to buy the items

3 As a shopper I want the prices to be retrieved

automatically for me on a daily basis so I dont

have to log in manually and click Get Prices

4 As a shopper I want the prices to be texted to

me only when the price has changed so Im not

getting inundated with text messages

vii Create a work item of type defect with the following summary The View

Database page fails to load when the database is empty

c Plan your work

Now that you have filled your backlog with stories its time to plan your first sprint

i On the left pane click Sprint Planning A sprint represents a period of time

Organize your user stories in sprints

ii Click Add Sprints

iii Configure the sprints so you have at least two and click Create

iv In the Backlog section rearrange your stories so they are in a ranked order by

dragging and dropping them Put As a shopper I want a text message sent to me with the price of each item so that

I dont have to check the website to view the prices as

the top item in the list and As a shopper I want the prices to be retrieved automatically for me on a daily basis so

I dont have to log in manually and click Get Prices as

the second highest item in the list

v Click the Sprint 1 dropbdown box and select Sprint 1 so that Sprint 1 appears to

the right of the backlog (You may need to click Sprint 2 and then click Sprint 1

in order for the sprint to appear)

11

vi Assume you have time to complete one user story per sprint Drag the topmost

item in the list to Sprint 1 (on the right)

vii In the sprint dropdown box select Sprint 2

viii Drag the new top most item to Sprint 2

d Track your work

Sprint 1 has begun Indicate that you have started working on the first work item by

marking it as In Progress

i In the sprint dropdown box select Sprint 1

ii In the Sprint 1 section click the Status New icon ( ) for the story planned

for Sprint 1

iii In the Status dialog click Start Working

iv Note the work item ID for your work item because you will need it later in this

lab

2 Implement the feature

Next implement the work item As a shopper I want a text message sent to me with the price of each item so that I dont have to check the

website to view the prices The idea of implementing a text messaging feature

might sound a bit daunting to you Fortunately Bluemix provides a Twilio service you can use

that handles sending the text message so you can implement this feature with only nine lines of

code

a Register with Twilio

If you do not already have an account with Twilio you need to register You also need

your Twilio AccountSID Auth Token and phone number

1 Go to httpswwwtwiliocom and sign up

2 Follow the on-screen instructions to verify your account

3 Note your Twilio phone number

4 After you have authenticated and are viewing your account click your ID in the

right corner and select Account

5 In the API Credentials section note your AccountSID and AuthToken (You

might want to leave this page open as you continue so you can easily copy the

credentials)

b If you do not want to receive text messages

If you do not want to receive text messages to your phone because your carrier charges

ridiculous amounts you can instead send the text messages to your Twilio account

12

phone number If yoursquore ok with receiving text messages on your phone skip this

section and continue on to step c

i In Twilio click NUMBERS in the top navigation bar

ii Click your phone number in the Number table

iii In the Messaging section replace the Request URL with any valid url (this

prevents a never ending loop of your phone number sending a response to the

text message it just received) For example you might replace the Request URL

with a link to your Laurenrsquos Lovely Landscapes app

iv Click Save

v Click Numbers in the top navigation bar

vi Click Verify a number

vii Click text you instead

viii Input your Twilio phone number in the Phone Number box

ix Click Text Me

x In a new tab or window navigate to twiliocom and click Account

xi Click NUMBERS in the top navigation bar

xii Click your number in the Number table

xiii Click Inbound in the Messaging section

xiv Hover over the text message in the table to see the incoming message Note

the verification number in the text messagersquos body

xv Return to your original tab or window and input the verification number

xvi Click Submit

When you want to view incoming text messages for your Twilio number return to the

details page for your number and click Inbound

c Add the Twilio service to the app

Begin by adding the Bluemix Twilio service to your app

i In DevOps Services click EDIT CODE in the upper-right corner

ii Click the Open application dashboard button ( ) The Bluemix page for your

app opens

iii Click ADD A SERVICE OR API

13

iv Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

v Click the Twilio service

vi In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

vii Click CREATE

viii When prompted restage your application now by clicking RESTAGE

ix Wait for the page to indicate that your app is running

d Add code that uses the Twilio service

Add code to your app that sends a text message whenever a price is retrieved for an

item Use the Twilio service to actually send the text message

i Add Twilio to requirementstxt

Your app needs the Twilio module so you must add it to the requirementstxt

file

1 In the Web IDE open requirementstxt

2 Add a new line to the end of the file and type twilio

3 Select File gt Save

ii Connect to the Twilio service

To effectively use your Twilio service you must connect to it

1 In the Web IDE open the wsgipy file

2 In the Imports section around Line 55 add the following line from twiliorest import TwilioRestClient

3 As part of the for loop that begins around Line 65 add the following

lines

Note Be sure your spacing before these two lines (spaces and tabs) is

identical to the if statement that checks if the key starts with

ldquocloudantrdquo

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

4 Your Twilio credentials are now stored in twilio_creds Your code

should now look like the following listing

14

for key value in decoded_configiteritems()

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

if keystartswith(cloudant)

cloudant_creds = decoded_config[key][0][credentials]

cloudant_host = cloudant_creds[host]

cloudant_port = int(cloudant_creds[port])

cloudant_username = cloudant_creds[username]

cloudant_password = cloudant_creds[password]

cloudant_url = str(cloudant_creds[url])

account = cloudantAccount(cloudant_username)

login = accountlogin(cloudant_username cloudant_password)

assert loginstatus_code == 200

db = accountdatabase(dbname)

response = dbput()

print responsejson

5 Save your changes by selecting File gt Save

e Add code to send the text message

Now comes the fun part Its time to code

Continue to work in the wsgipy file and create a new function around Line 89 that

sends a text message def sendTextWithMessage(message)

message = twilioClientmessagescreate(to=+15555555555 from_=+15555555555

body=message)

f Replace the to number with the cell phone number or Twilio number where you want

the text messages to be sent (dont forget the country code)

g Replace the from number with your Twilio phone number (dont forget the country

code)

h In the getCurrentPrice function inside of the if statement that checks if the

price is not None add the following line of code sendTextWithMessage(The current price of s is s (item[name] price))

i Save your changes by selecting File gt Save

Thats it Youve implemented your feature with only nine lines of code

3 Deploy and test the feature

Now its time to deploy your application to Bluemix so you can test it

a Click the Deploy button ( )

b If prompted if you want to stop and redeploy click OK

c After your application has finished deploying click the Open URL button ( ) in the top

gray bar

d In your app click Get Prices

15

e Check your phone or Twilio number for a text message

If you like update the prices of the items in the store and get the prices again

4 Push the feature to the repository

Now that your feature is tested its time to push your changes to the Git repository

a In the leftmost bar of icons click the Git Repository button ( )

b In the box in the Working Directory Changes section type a comment similar to the

following being sure to replace 20 with the work item ID associated with the work item

you created Changes to implement the text messaging feature as

described in work item 20

c Select each change in the Changed Files section and click the COMMIT button

d In the OUTGOING section click PUSH

e If you are prompted for your committer information enter it and click OK

5 Complete the feature

To indicate that you have finished your feature mark your work item as complete

a In the Web IDE click TRACK amp PLAN in the upper-right corner

b In the right pane find your work item associated with the text messaging feature and

click the Status In Progress icon

c Click Set Done

d In the right pane scroll right until you see the RESOLVED section Notice that your work

item is now marked done

6 Discover the traceability

When you added a comment in your commit that mentioned your work item a link was

automatically created for you between the change and the work item

a In the right pane scroll to the Resolved view if you are not currently viewing your

resolved work items

b Click the textual summary of the work item associated with the text messaging feature

to open it

c In the work item click the Links tab

d In the LINKS section notice that a link was automatically generated for you Click the

link The Git Log displays

e Observe that you have a summary of the git commit and its associated work items

f Click GIT LOG in the left navigation to see a list of all of your git commits

16

Tweet this

Collaborate with me on this Bluemix app I created [insert link to your app] [include a

screenshot of the Web IDE with your codemdashTweets with images are more likely to get noticed]

Get creative

Invite a friend to join your project Navigate to your projects home page click Members and

invite a friend to join

Create new work items for features yoursquod like to implement or defects you find

Implement some of the stories you created or fix the defects you recorded

Additional resources

Twilio SMS and MMS Python Quickstart httpswwwtwiliocomdocsquickstartpythonsms

Managing Distributed Teams

httpswwwscrumallianceorgcommunityarticles2013julymanaging-distributed-

teamsaspx

So Long Scrum Hello Kanban httpsstormpathcomblogso-long-scrum-hello-kanban

17

Part 1D Deploying Automatically Using the Delivery Pipeline

Learn this

Deployment automation is one of the keys to a successful DevOps approach

You can create a complete delivery pipeline with multiple stages automated tests and

automatic deploys using DevOps Services

Try this

You can configure a multi-stage build and deployment pipeline to support your DevOps approach to

software development In this section you will configure a builder a deployment to your

development (dev) space and a deployment to your production (prod) space

1 Create a production space

Organizations and spaces are organizational units in the Cloud Foundry infrastructure that can

be used to store and track application resources An organization contains domains spaces and

users a space contains applications and services By default a dev (development) space is

created for you

a Navigate to the Bluemix dashboard if you are not there already

b Click Create a Space in the left menu

c In the Create a Space dialog input prod as your space name and click CREATE

2 Create services for deployments to your dev space

When deploying to your dev and prod spaces you will likely want to have services dedicated to

those deployments For example you want to use separate databases for each space Wersquoll

begin by creating services for each space

a Navigate to the Bluemix dashboard if you are not there already

b Click CATALOG

c Create the Cloudant NoSQL DB service

i Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data

and Analytics section The catalog is constantly being updated with new

services

ii Click the Cloudant NoSQL DB service

iii In the Space dropdown choose dev

iv In the App dropdown choose Leave unbound

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 7: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

6

Part 1B Deploying an App that Uses a Bluemix Service In this part youll be working with the Laurens Lovely Landscapes app you created in part 1A Youll also be

working with The Fabulous Price Finder app The Fabulous Price Finder provides you with the current prices of

items youre interested in purchasing online with the simple click of a button

Learn this

Leveraging Bluemix services like database services Watson services and DevOps Services makes

creating and managing apps easier

Deploying apps that leverage Bluemix services can be fast and easy

Try this

1 Fork the Fabulous Price Finder

a Go to the Fabulous Price Finder project overview page httpsibmbizcds-fbf

b Click EDIT CODE in the upper-right corner You might be prompted to authenticate if

you have not already done so

c Select Tools gt Fork

d Type a name for your project leave the Add features for Scrum development and Make

this a Bluemix Project boxes checked and click CREATE

e Note that when the project has finished forking your new project name is listed in the

upper-left corner

7

2 Deploy the Fabulous Price Finder

The Fabulous Price Finder uses the Cloudant NoSQL DB service hosted at Bluemix The Cloudant

database service provides access to a fully managed NoSQL JSON data layer thatrsquos always on To

get the Fabulous Price Finder running you deploy the application and then bind a new Cloudant

NoSQL DB instance to the application

a In the left navigation pane select manifestyml

b Click the Deploy ( ) button in the top gray bar Note that when the app finishes

deploying the database functionality will not yet work because you have not bound a

Cloudant NoSQL DB instance to it

c When the application is deployed click the Open application dashboard button ( ) in

the top gray bar

d If you are not already authenticated at Bluemix you might be prompted to do so After

you are authenticated you are redirected to your applications page on Bluemix

e Click ADD A SERVICE OR API

f Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data and

Analytics section The catalog is constantly being updated with new services

g Click the Cloudant NoSQL DB service

h In the Cloudant NoSQL DB dialog leave the defaults in the dialog (the code assumes the

name of your Cloudant NoSQL DB service starts with cloudant) and click CREATE

i When prompted if you want to restage your application now click RESTAGE

j When the page indicates your app is running click your applications route to open it

3 Try the Fabulous Price Finder

Now that you have the Fabulous Price Finder running its time to explore

The home page of the Fabulous Price Finder enables you to record the items for which you want

to check prices You begin with the Antarctica print from the Laurens Lovely Landscapes app

you deployed

a In the form on the home page specify the name for the print (Antarctica) the URL for

the print from your online store (Hint Look for something similar to

httplaurenslovelylandscapes-some-long-string-of-random-

charactersmybluemixnetantarctica) and the id of the price field for the print

(price)

b Click Submit

You are redirected to the View Database page where you can see information about the item

you just stored You can record the details for other items if you like

8

4 Get Prices

After you have stored information about an item you can check its price

a On the home page click Get Prices

b On the Success page click View the database

Notice that the price of your item is now stored in the database If you like go back to your

Laurens Lovely Lanscapes project update the price of the Antarctica print (dont forget to

deploy your change) and click Get Prices again Note that the database reflects the new price of

the print

5 Explore the Cloudant Database

You can browse and update the contents of your Cloudant database which can be helpful when

debugging and working with your app

a Go to the Bluemix dashboard

b Log in if you are not already authenticated

c On the dashboard click on your FabulousPriceFinder app to open it

d Click your Cloudant NoSQL DB service tile to open it

e Click LAUNCH

f In the Databases section click on your database to open it

g Browse the documents youve added to your database

Tweet this

Check out the app I just deployed that leverages a Cloudant database on Bluemix [insert link

to your app]

Get creative

Enhance the apprsquos navigation so it is easier to move around the site or change the name of the

app to be less ldquofabulousrdquo and more you Make it your own

Additional resources

Cloudant-Python httpsgithubcomcloudant-labscloudant-python

Develop and manage Java apps with IBM Bluemix and DevOps Services

httpwwwibmcomdeveloperworkslibraryd-Bluemix-javadevopsindexhtml

9

Part 1C Planning Tracking amp Leveraging New Bluemix Services

Learn this

Leveraging software as a service that works well with the platform as a service of your choice

can greatly speed up your software delivery lifecycle

Agile planning and tracking is simple in the cloud and creates built-in traceability for all of your

teammateshellipwhether they are collocated or distributed

Writing code that leverages a Bluemix service can be fast and significantly reduce development

time

Try this

1 Plan a new feature to add to the Fabulous Price Finder

So far you have made use of existing code but you havent created anything new Time to

change that

When working with teammates or even by yourself organizing your ideas into user stories and

then organizing your user stories into a plan can be incredibly valuable

a Open Track amp Plan

i Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated

and clicking on your project on the My Projects page

ii Click the gear button ( ) in the upper-right corner to open the Project

Settings page

iii Click OPTIONS

iv On the page that loads select the Enable Track amp Plan checkbox (if it is not

already enabled) and click SAVE

v Click TRACK amp PLAN in the upper-right corner The Track amp Plan section is your

place to organize your ideas

b Create work items in your backlog

i On the left pane click Backlog

ii On the right pane type the following in the Create a work itemhellip field As a shopper I want a text message sent to me with the

price of each item so that I dont have to check the

website to view the prices

10

iii The tool will automatically detect the work item type is story and set the type

for you

iv In the icon bar below click the Owned By icon and select your username

v Click CREATE

vi Repeat Steps 2-5 to create work items for the following stories

1 As a shopper I want to organize my items by

store so that I only have to input the field ID

once per store instead of every item

2 As a shopper I want to see a graph of the price

of the items Im watching over time so I can

judge if its a good time to buy the items

3 As a shopper I want the prices to be retrieved

automatically for me on a daily basis so I dont

have to log in manually and click Get Prices

4 As a shopper I want the prices to be texted to

me only when the price has changed so Im not

getting inundated with text messages

vii Create a work item of type defect with the following summary The View

Database page fails to load when the database is empty

c Plan your work

Now that you have filled your backlog with stories its time to plan your first sprint

i On the left pane click Sprint Planning A sprint represents a period of time

Organize your user stories in sprints

ii Click Add Sprints

iii Configure the sprints so you have at least two and click Create

iv In the Backlog section rearrange your stories so they are in a ranked order by

dragging and dropping them Put As a shopper I want a text message sent to me with the price of each item so that

I dont have to check the website to view the prices as

the top item in the list and As a shopper I want the prices to be retrieved automatically for me on a daily basis so

I dont have to log in manually and click Get Prices as

the second highest item in the list

v Click the Sprint 1 dropbdown box and select Sprint 1 so that Sprint 1 appears to

the right of the backlog (You may need to click Sprint 2 and then click Sprint 1

in order for the sprint to appear)

11

vi Assume you have time to complete one user story per sprint Drag the topmost

item in the list to Sprint 1 (on the right)

vii In the sprint dropdown box select Sprint 2

viii Drag the new top most item to Sprint 2

d Track your work

Sprint 1 has begun Indicate that you have started working on the first work item by

marking it as In Progress

i In the sprint dropdown box select Sprint 1

ii In the Sprint 1 section click the Status New icon ( ) for the story planned

for Sprint 1

iii In the Status dialog click Start Working

iv Note the work item ID for your work item because you will need it later in this

lab

2 Implement the feature

Next implement the work item As a shopper I want a text message sent to me with the price of each item so that I dont have to check the

website to view the prices The idea of implementing a text messaging feature

might sound a bit daunting to you Fortunately Bluemix provides a Twilio service you can use

that handles sending the text message so you can implement this feature with only nine lines of

code

a Register with Twilio

If you do not already have an account with Twilio you need to register You also need

your Twilio AccountSID Auth Token and phone number

1 Go to httpswwwtwiliocom and sign up

2 Follow the on-screen instructions to verify your account

3 Note your Twilio phone number

4 After you have authenticated and are viewing your account click your ID in the

right corner and select Account

5 In the API Credentials section note your AccountSID and AuthToken (You

might want to leave this page open as you continue so you can easily copy the

credentials)

b If you do not want to receive text messages

If you do not want to receive text messages to your phone because your carrier charges

ridiculous amounts you can instead send the text messages to your Twilio account

12

phone number If yoursquore ok with receiving text messages on your phone skip this

section and continue on to step c

i In Twilio click NUMBERS in the top navigation bar

ii Click your phone number in the Number table

iii In the Messaging section replace the Request URL with any valid url (this

prevents a never ending loop of your phone number sending a response to the

text message it just received) For example you might replace the Request URL

with a link to your Laurenrsquos Lovely Landscapes app

iv Click Save

v Click Numbers in the top navigation bar

vi Click Verify a number

vii Click text you instead

viii Input your Twilio phone number in the Phone Number box

ix Click Text Me

x In a new tab or window navigate to twiliocom and click Account

xi Click NUMBERS in the top navigation bar

xii Click your number in the Number table

xiii Click Inbound in the Messaging section

xiv Hover over the text message in the table to see the incoming message Note

the verification number in the text messagersquos body

xv Return to your original tab or window and input the verification number

xvi Click Submit

When you want to view incoming text messages for your Twilio number return to the

details page for your number and click Inbound

c Add the Twilio service to the app

Begin by adding the Bluemix Twilio service to your app

i In DevOps Services click EDIT CODE in the upper-right corner

ii Click the Open application dashboard button ( ) The Bluemix page for your

app opens

iii Click ADD A SERVICE OR API

13

iv Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

v Click the Twilio service

vi In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

vii Click CREATE

viii When prompted restage your application now by clicking RESTAGE

ix Wait for the page to indicate that your app is running

d Add code that uses the Twilio service

Add code to your app that sends a text message whenever a price is retrieved for an

item Use the Twilio service to actually send the text message

i Add Twilio to requirementstxt

Your app needs the Twilio module so you must add it to the requirementstxt

file

1 In the Web IDE open requirementstxt

2 Add a new line to the end of the file and type twilio

3 Select File gt Save

ii Connect to the Twilio service

To effectively use your Twilio service you must connect to it

1 In the Web IDE open the wsgipy file

2 In the Imports section around Line 55 add the following line from twiliorest import TwilioRestClient

3 As part of the for loop that begins around Line 65 add the following

lines

Note Be sure your spacing before these two lines (spaces and tabs) is

identical to the if statement that checks if the key starts with

ldquocloudantrdquo

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

4 Your Twilio credentials are now stored in twilio_creds Your code

should now look like the following listing

14

for key value in decoded_configiteritems()

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

if keystartswith(cloudant)

cloudant_creds = decoded_config[key][0][credentials]

cloudant_host = cloudant_creds[host]

cloudant_port = int(cloudant_creds[port])

cloudant_username = cloudant_creds[username]

cloudant_password = cloudant_creds[password]

cloudant_url = str(cloudant_creds[url])

account = cloudantAccount(cloudant_username)

login = accountlogin(cloudant_username cloudant_password)

assert loginstatus_code == 200

db = accountdatabase(dbname)

response = dbput()

print responsejson

5 Save your changes by selecting File gt Save

e Add code to send the text message

Now comes the fun part Its time to code

Continue to work in the wsgipy file and create a new function around Line 89 that

sends a text message def sendTextWithMessage(message)

message = twilioClientmessagescreate(to=+15555555555 from_=+15555555555

body=message)

f Replace the to number with the cell phone number or Twilio number where you want

the text messages to be sent (dont forget the country code)

g Replace the from number with your Twilio phone number (dont forget the country

code)

h In the getCurrentPrice function inside of the if statement that checks if the

price is not None add the following line of code sendTextWithMessage(The current price of s is s (item[name] price))

i Save your changes by selecting File gt Save

Thats it Youve implemented your feature with only nine lines of code

3 Deploy and test the feature

Now its time to deploy your application to Bluemix so you can test it

a Click the Deploy button ( )

b If prompted if you want to stop and redeploy click OK

c After your application has finished deploying click the Open URL button ( ) in the top

gray bar

d In your app click Get Prices

15

e Check your phone or Twilio number for a text message

If you like update the prices of the items in the store and get the prices again

4 Push the feature to the repository

Now that your feature is tested its time to push your changes to the Git repository

a In the leftmost bar of icons click the Git Repository button ( )

b In the box in the Working Directory Changes section type a comment similar to the

following being sure to replace 20 with the work item ID associated with the work item

you created Changes to implement the text messaging feature as

described in work item 20

c Select each change in the Changed Files section and click the COMMIT button

d In the OUTGOING section click PUSH

e If you are prompted for your committer information enter it and click OK

5 Complete the feature

To indicate that you have finished your feature mark your work item as complete

a In the Web IDE click TRACK amp PLAN in the upper-right corner

b In the right pane find your work item associated with the text messaging feature and

click the Status In Progress icon

c Click Set Done

d In the right pane scroll right until you see the RESOLVED section Notice that your work

item is now marked done

6 Discover the traceability

When you added a comment in your commit that mentioned your work item a link was

automatically created for you between the change and the work item

a In the right pane scroll to the Resolved view if you are not currently viewing your

resolved work items

b Click the textual summary of the work item associated with the text messaging feature

to open it

c In the work item click the Links tab

d In the LINKS section notice that a link was automatically generated for you Click the

link The Git Log displays

e Observe that you have a summary of the git commit and its associated work items

f Click GIT LOG in the left navigation to see a list of all of your git commits

16

Tweet this

Collaborate with me on this Bluemix app I created [insert link to your app] [include a

screenshot of the Web IDE with your codemdashTweets with images are more likely to get noticed]

Get creative

Invite a friend to join your project Navigate to your projects home page click Members and

invite a friend to join

Create new work items for features yoursquod like to implement or defects you find

Implement some of the stories you created or fix the defects you recorded

Additional resources

Twilio SMS and MMS Python Quickstart httpswwwtwiliocomdocsquickstartpythonsms

Managing Distributed Teams

httpswwwscrumallianceorgcommunityarticles2013julymanaging-distributed-

teamsaspx

So Long Scrum Hello Kanban httpsstormpathcomblogso-long-scrum-hello-kanban

17

Part 1D Deploying Automatically Using the Delivery Pipeline

Learn this

Deployment automation is one of the keys to a successful DevOps approach

You can create a complete delivery pipeline with multiple stages automated tests and

automatic deploys using DevOps Services

Try this

You can configure a multi-stage build and deployment pipeline to support your DevOps approach to

software development In this section you will configure a builder a deployment to your

development (dev) space and a deployment to your production (prod) space

1 Create a production space

Organizations and spaces are organizational units in the Cloud Foundry infrastructure that can

be used to store and track application resources An organization contains domains spaces and

users a space contains applications and services By default a dev (development) space is

created for you

a Navigate to the Bluemix dashboard if you are not there already

b Click Create a Space in the left menu

c In the Create a Space dialog input prod as your space name and click CREATE

2 Create services for deployments to your dev space

When deploying to your dev and prod spaces you will likely want to have services dedicated to

those deployments For example you want to use separate databases for each space Wersquoll

begin by creating services for each space

a Navigate to the Bluemix dashboard if you are not there already

b Click CATALOG

c Create the Cloudant NoSQL DB service

i Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data

and Analytics section The catalog is constantly being updated with new

services

ii Click the Cloudant NoSQL DB service

iii In the Space dropdown choose dev

iv In the App dropdown choose Leave unbound

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 8: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

7

2 Deploy the Fabulous Price Finder

The Fabulous Price Finder uses the Cloudant NoSQL DB service hosted at Bluemix The Cloudant

database service provides access to a fully managed NoSQL JSON data layer thatrsquos always on To

get the Fabulous Price Finder running you deploy the application and then bind a new Cloudant

NoSQL DB instance to the application

a In the left navigation pane select manifestyml

b Click the Deploy ( ) button in the top gray bar Note that when the app finishes

deploying the database functionality will not yet work because you have not bound a

Cloudant NoSQL DB instance to it

c When the application is deployed click the Open application dashboard button ( ) in

the top gray bar

d If you are not already authenticated at Bluemix you might be prompted to do so After

you are authenticated you are redirected to your applications page on Bluemix

e Click ADD A SERVICE OR API

f Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data and

Analytics section The catalog is constantly being updated with new services

g Click the Cloudant NoSQL DB service

h In the Cloudant NoSQL DB dialog leave the defaults in the dialog (the code assumes the

name of your Cloudant NoSQL DB service starts with cloudant) and click CREATE

i When prompted if you want to restage your application now click RESTAGE

j When the page indicates your app is running click your applications route to open it

3 Try the Fabulous Price Finder

Now that you have the Fabulous Price Finder running its time to explore

The home page of the Fabulous Price Finder enables you to record the items for which you want

to check prices You begin with the Antarctica print from the Laurens Lovely Landscapes app

you deployed

a In the form on the home page specify the name for the print (Antarctica) the URL for

the print from your online store (Hint Look for something similar to

httplaurenslovelylandscapes-some-long-string-of-random-

charactersmybluemixnetantarctica) and the id of the price field for the print

(price)

b Click Submit

You are redirected to the View Database page where you can see information about the item

you just stored You can record the details for other items if you like

8

4 Get Prices

After you have stored information about an item you can check its price

a On the home page click Get Prices

b On the Success page click View the database

Notice that the price of your item is now stored in the database If you like go back to your

Laurens Lovely Lanscapes project update the price of the Antarctica print (dont forget to

deploy your change) and click Get Prices again Note that the database reflects the new price of

the print

5 Explore the Cloudant Database

You can browse and update the contents of your Cloudant database which can be helpful when

debugging and working with your app

a Go to the Bluemix dashboard

b Log in if you are not already authenticated

c On the dashboard click on your FabulousPriceFinder app to open it

d Click your Cloudant NoSQL DB service tile to open it

e Click LAUNCH

f In the Databases section click on your database to open it

g Browse the documents youve added to your database

Tweet this

Check out the app I just deployed that leverages a Cloudant database on Bluemix [insert link

to your app]

Get creative

Enhance the apprsquos navigation so it is easier to move around the site or change the name of the

app to be less ldquofabulousrdquo and more you Make it your own

Additional resources

Cloudant-Python httpsgithubcomcloudant-labscloudant-python

Develop and manage Java apps with IBM Bluemix and DevOps Services

httpwwwibmcomdeveloperworkslibraryd-Bluemix-javadevopsindexhtml

9

Part 1C Planning Tracking amp Leveraging New Bluemix Services

Learn this

Leveraging software as a service that works well with the platform as a service of your choice

can greatly speed up your software delivery lifecycle

Agile planning and tracking is simple in the cloud and creates built-in traceability for all of your

teammateshellipwhether they are collocated or distributed

Writing code that leverages a Bluemix service can be fast and significantly reduce development

time

Try this

1 Plan a new feature to add to the Fabulous Price Finder

So far you have made use of existing code but you havent created anything new Time to

change that

When working with teammates or even by yourself organizing your ideas into user stories and

then organizing your user stories into a plan can be incredibly valuable

a Open Track amp Plan

i Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated

and clicking on your project on the My Projects page

ii Click the gear button ( ) in the upper-right corner to open the Project

Settings page

iii Click OPTIONS

iv On the page that loads select the Enable Track amp Plan checkbox (if it is not

already enabled) and click SAVE

v Click TRACK amp PLAN in the upper-right corner The Track amp Plan section is your

place to organize your ideas

b Create work items in your backlog

i On the left pane click Backlog

ii On the right pane type the following in the Create a work itemhellip field As a shopper I want a text message sent to me with the

price of each item so that I dont have to check the

website to view the prices

10

iii The tool will automatically detect the work item type is story and set the type

for you

iv In the icon bar below click the Owned By icon and select your username

v Click CREATE

vi Repeat Steps 2-5 to create work items for the following stories

1 As a shopper I want to organize my items by

store so that I only have to input the field ID

once per store instead of every item

2 As a shopper I want to see a graph of the price

of the items Im watching over time so I can

judge if its a good time to buy the items

3 As a shopper I want the prices to be retrieved

automatically for me on a daily basis so I dont

have to log in manually and click Get Prices

4 As a shopper I want the prices to be texted to

me only when the price has changed so Im not

getting inundated with text messages

vii Create a work item of type defect with the following summary The View

Database page fails to load when the database is empty

c Plan your work

Now that you have filled your backlog with stories its time to plan your first sprint

i On the left pane click Sprint Planning A sprint represents a period of time

Organize your user stories in sprints

ii Click Add Sprints

iii Configure the sprints so you have at least two and click Create

iv In the Backlog section rearrange your stories so they are in a ranked order by

dragging and dropping them Put As a shopper I want a text message sent to me with the price of each item so that

I dont have to check the website to view the prices as

the top item in the list and As a shopper I want the prices to be retrieved automatically for me on a daily basis so

I dont have to log in manually and click Get Prices as

the second highest item in the list

v Click the Sprint 1 dropbdown box and select Sprint 1 so that Sprint 1 appears to

the right of the backlog (You may need to click Sprint 2 and then click Sprint 1

in order for the sprint to appear)

11

vi Assume you have time to complete one user story per sprint Drag the topmost

item in the list to Sprint 1 (on the right)

vii In the sprint dropdown box select Sprint 2

viii Drag the new top most item to Sprint 2

d Track your work

Sprint 1 has begun Indicate that you have started working on the first work item by

marking it as In Progress

i In the sprint dropdown box select Sprint 1

ii In the Sprint 1 section click the Status New icon ( ) for the story planned

for Sprint 1

iii In the Status dialog click Start Working

iv Note the work item ID for your work item because you will need it later in this

lab

2 Implement the feature

Next implement the work item As a shopper I want a text message sent to me with the price of each item so that I dont have to check the

website to view the prices The idea of implementing a text messaging feature

might sound a bit daunting to you Fortunately Bluemix provides a Twilio service you can use

that handles sending the text message so you can implement this feature with only nine lines of

code

a Register with Twilio

If you do not already have an account with Twilio you need to register You also need

your Twilio AccountSID Auth Token and phone number

1 Go to httpswwwtwiliocom and sign up

2 Follow the on-screen instructions to verify your account

3 Note your Twilio phone number

4 After you have authenticated and are viewing your account click your ID in the

right corner and select Account

5 In the API Credentials section note your AccountSID and AuthToken (You

might want to leave this page open as you continue so you can easily copy the

credentials)

b If you do not want to receive text messages

If you do not want to receive text messages to your phone because your carrier charges

ridiculous amounts you can instead send the text messages to your Twilio account

12

phone number If yoursquore ok with receiving text messages on your phone skip this

section and continue on to step c

i In Twilio click NUMBERS in the top navigation bar

ii Click your phone number in the Number table

iii In the Messaging section replace the Request URL with any valid url (this

prevents a never ending loop of your phone number sending a response to the

text message it just received) For example you might replace the Request URL

with a link to your Laurenrsquos Lovely Landscapes app

iv Click Save

v Click Numbers in the top navigation bar

vi Click Verify a number

vii Click text you instead

viii Input your Twilio phone number in the Phone Number box

ix Click Text Me

x In a new tab or window navigate to twiliocom and click Account

xi Click NUMBERS in the top navigation bar

xii Click your number in the Number table

xiii Click Inbound in the Messaging section

xiv Hover over the text message in the table to see the incoming message Note

the verification number in the text messagersquos body

xv Return to your original tab or window and input the verification number

xvi Click Submit

When you want to view incoming text messages for your Twilio number return to the

details page for your number and click Inbound

c Add the Twilio service to the app

Begin by adding the Bluemix Twilio service to your app

i In DevOps Services click EDIT CODE in the upper-right corner

ii Click the Open application dashboard button ( ) The Bluemix page for your

app opens

iii Click ADD A SERVICE OR API

13

iv Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

v Click the Twilio service

vi In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

vii Click CREATE

viii When prompted restage your application now by clicking RESTAGE

ix Wait for the page to indicate that your app is running

d Add code that uses the Twilio service

Add code to your app that sends a text message whenever a price is retrieved for an

item Use the Twilio service to actually send the text message

i Add Twilio to requirementstxt

Your app needs the Twilio module so you must add it to the requirementstxt

file

1 In the Web IDE open requirementstxt

2 Add a new line to the end of the file and type twilio

3 Select File gt Save

ii Connect to the Twilio service

To effectively use your Twilio service you must connect to it

1 In the Web IDE open the wsgipy file

2 In the Imports section around Line 55 add the following line from twiliorest import TwilioRestClient

3 As part of the for loop that begins around Line 65 add the following

lines

Note Be sure your spacing before these two lines (spaces and tabs) is

identical to the if statement that checks if the key starts with

ldquocloudantrdquo

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

4 Your Twilio credentials are now stored in twilio_creds Your code

should now look like the following listing

14

for key value in decoded_configiteritems()

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

if keystartswith(cloudant)

cloudant_creds = decoded_config[key][0][credentials]

cloudant_host = cloudant_creds[host]

cloudant_port = int(cloudant_creds[port])

cloudant_username = cloudant_creds[username]

cloudant_password = cloudant_creds[password]

cloudant_url = str(cloudant_creds[url])

account = cloudantAccount(cloudant_username)

login = accountlogin(cloudant_username cloudant_password)

assert loginstatus_code == 200

db = accountdatabase(dbname)

response = dbput()

print responsejson

5 Save your changes by selecting File gt Save

e Add code to send the text message

Now comes the fun part Its time to code

Continue to work in the wsgipy file and create a new function around Line 89 that

sends a text message def sendTextWithMessage(message)

message = twilioClientmessagescreate(to=+15555555555 from_=+15555555555

body=message)

f Replace the to number with the cell phone number or Twilio number where you want

the text messages to be sent (dont forget the country code)

g Replace the from number with your Twilio phone number (dont forget the country

code)

h In the getCurrentPrice function inside of the if statement that checks if the

price is not None add the following line of code sendTextWithMessage(The current price of s is s (item[name] price))

i Save your changes by selecting File gt Save

Thats it Youve implemented your feature with only nine lines of code

3 Deploy and test the feature

Now its time to deploy your application to Bluemix so you can test it

a Click the Deploy button ( )

b If prompted if you want to stop and redeploy click OK

c After your application has finished deploying click the Open URL button ( ) in the top

gray bar

d In your app click Get Prices

15

e Check your phone or Twilio number for a text message

If you like update the prices of the items in the store and get the prices again

4 Push the feature to the repository

Now that your feature is tested its time to push your changes to the Git repository

a In the leftmost bar of icons click the Git Repository button ( )

b In the box in the Working Directory Changes section type a comment similar to the

following being sure to replace 20 with the work item ID associated with the work item

you created Changes to implement the text messaging feature as

described in work item 20

c Select each change in the Changed Files section and click the COMMIT button

d In the OUTGOING section click PUSH

e If you are prompted for your committer information enter it and click OK

5 Complete the feature

To indicate that you have finished your feature mark your work item as complete

a In the Web IDE click TRACK amp PLAN in the upper-right corner

b In the right pane find your work item associated with the text messaging feature and

click the Status In Progress icon

c Click Set Done

d In the right pane scroll right until you see the RESOLVED section Notice that your work

item is now marked done

6 Discover the traceability

When you added a comment in your commit that mentioned your work item a link was

automatically created for you between the change and the work item

a In the right pane scroll to the Resolved view if you are not currently viewing your

resolved work items

b Click the textual summary of the work item associated with the text messaging feature

to open it

c In the work item click the Links tab

d In the LINKS section notice that a link was automatically generated for you Click the

link The Git Log displays

e Observe that you have a summary of the git commit and its associated work items

f Click GIT LOG in the left navigation to see a list of all of your git commits

16

Tweet this

Collaborate with me on this Bluemix app I created [insert link to your app] [include a

screenshot of the Web IDE with your codemdashTweets with images are more likely to get noticed]

Get creative

Invite a friend to join your project Navigate to your projects home page click Members and

invite a friend to join

Create new work items for features yoursquod like to implement or defects you find

Implement some of the stories you created or fix the defects you recorded

Additional resources

Twilio SMS and MMS Python Quickstart httpswwwtwiliocomdocsquickstartpythonsms

Managing Distributed Teams

httpswwwscrumallianceorgcommunityarticles2013julymanaging-distributed-

teamsaspx

So Long Scrum Hello Kanban httpsstormpathcomblogso-long-scrum-hello-kanban

17

Part 1D Deploying Automatically Using the Delivery Pipeline

Learn this

Deployment automation is one of the keys to a successful DevOps approach

You can create a complete delivery pipeline with multiple stages automated tests and

automatic deploys using DevOps Services

Try this

You can configure a multi-stage build and deployment pipeline to support your DevOps approach to

software development In this section you will configure a builder a deployment to your

development (dev) space and a deployment to your production (prod) space

1 Create a production space

Organizations and spaces are organizational units in the Cloud Foundry infrastructure that can

be used to store and track application resources An organization contains domains spaces and

users a space contains applications and services By default a dev (development) space is

created for you

a Navigate to the Bluemix dashboard if you are not there already

b Click Create a Space in the left menu

c In the Create a Space dialog input prod as your space name and click CREATE

2 Create services for deployments to your dev space

When deploying to your dev and prod spaces you will likely want to have services dedicated to

those deployments For example you want to use separate databases for each space Wersquoll

begin by creating services for each space

a Navigate to the Bluemix dashboard if you are not there already

b Click CATALOG

c Create the Cloudant NoSQL DB service

i Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data

and Analytics section The catalog is constantly being updated with new

services

ii Click the Cloudant NoSQL DB service

iii In the Space dropdown choose dev

iv In the App dropdown choose Leave unbound

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 9: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

8

4 Get Prices

After you have stored information about an item you can check its price

a On the home page click Get Prices

b On the Success page click View the database

Notice that the price of your item is now stored in the database If you like go back to your

Laurens Lovely Lanscapes project update the price of the Antarctica print (dont forget to

deploy your change) and click Get Prices again Note that the database reflects the new price of

the print

5 Explore the Cloudant Database

You can browse and update the contents of your Cloudant database which can be helpful when

debugging and working with your app

a Go to the Bluemix dashboard

b Log in if you are not already authenticated

c On the dashboard click on your FabulousPriceFinder app to open it

d Click your Cloudant NoSQL DB service tile to open it

e Click LAUNCH

f In the Databases section click on your database to open it

g Browse the documents youve added to your database

Tweet this

Check out the app I just deployed that leverages a Cloudant database on Bluemix [insert link

to your app]

Get creative

Enhance the apprsquos navigation so it is easier to move around the site or change the name of the

app to be less ldquofabulousrdquo and more you Make it your own

Additional resources

Cloudant-Python httpsgithubcomcloudant-labscloudant-python

Develop and manage Java apps with IBM Bluemix and DevOps Services

httpwwwibmcomdeveloperworkslibraryd-Bluemix-javadevopsindexhtml

9

Part 1C Planning Tracking amp Leveraging New Bluemix Services

Learn this

Leveraging software as a service that works well with the platform as a service of your choice

can greatly speed up your software delivery lifecycle

Agile planning and tracking is simple in the cloud and creates built-in traceability for all of your

teammateshellipwhether they are collocated or distributed

Writing code that leverages a Bluemix service can be fast and significantly reduce development

time

Try this

1 Plan a new feature to add to the Fabulous Price Finder

So far you have made use of existing code but you havent created anything new Time to

change that

When working with teammates or even by yourself organizing your ideas into user stories and

then organizing your user stories into a plan can be incredibly valuable

a Open Track amp Plan

i Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated

and clicking on your project on the My Projects page

ii Click the gear button ( ) in the upper-right corner to open the Project

Settings page

iii Click OPTIONS

iv On the page that loads select the Enable Track amp Plan checkbox (if it is not

already enabled) and click SAVE

v Click TRACK amp PLAN in the upper-right corner The Track amp Plan section is your

place to organize your ideas

b Create work items in your backlog

i On the left pane click Backlog

ii On the right pane type the following in the Create a work itemhellip field As a shopper I want a text message sent to me with the

price of each item so that I dont have to check the

website to view the prices

10

iii The tool will automatically detect the work item type is story and set the type

for you

iv In the icon bar below click the Owned By icon and select your username

v Click CREATE

vi Repeat Steps 2-5 to create work items for the following stories

1 As a shopper I want to organize my items by

store so that I only have to input the field ID

once per store instead of every item

2 As a shopper I want to see a graph of the price

of the items Im watching over time so I can

judge if its a good time to buy the items

3 As a shopper I want the prices to be retrieved

automatically for me on a daily basis so I dont

have to log in manually and click Get Prices

4 As a shopper I want the prices to be texted to

me only when the price has changed so Im not

getting inundated with text messages

vii Create a work item of type defect with the following summary The View

Database page fails to load when the database is empty

c Plan your work

Now that you have filled your backlog with stories its time to plan your first sprint

i On the left pane click Sprint Planning A sprint represents a period of time

Organize your user stories in sprints

ii Click Add Sprints

iii Configure the sprints so you have at least two and click Create

iv In the Backlog section rearrange your stories so they are in a ranked order by

dragging and dropping them Put As a shopper I want a text message sent to me with the price of each item so that

I dont have to check the website to view the prices as

the top item in the list and As a shopper I want the prices to be retrieved automatically for me on a daily basis so

I dont have to log in manually and click Get Prices as

the second highest item in the list

v Click the Sprint 1 dropbdown box and select Sprint 1 so that Sprint 1 appears to

the right of the backlog (You may need to click Sprint 2 and then click Sprint 1

in order for the sprint to appear)

11

vi Assume you have time to complete one user story per sprint Drag the topmost

item in the list to Sprint 1 (on the right)

vii In the sprint dropdown box select Sprint 2

viii Drag the new top most item to Sprint 2

d Track your work

Sprint 1 has begun Indicate that you have started working on the first work item by

marking it as In Progress

i In the sprint dropdown box select Sprint 1

ii In the Sprint 1 section click the Status New icon ( ) for the story planned

for Sprint 1

iii In the Status dialog click Start Working

iv Note the work item ID for your work item because you will need it later in this

lab

2 Implement the feature

Next implement the work item As a shopper I want a text message sent to me with the price of each item so that I dont have to check the

website to view the prices The idea of implementing a text messaging feature

might sound a bit daunting to you Fortunately Bluemix provides a Twilio service you can use

that handles sending the text message so you can implement this feature with only nine lines of

code

a Register with Twilio

If you do not already have an account with Twilio you need to register You also need

your Twilio AccountSID Auth Token and phone number

1 Go to httpswwwtwiliocom and sign up

2 Follow the on-screen instructions to verify your account

3 Note your Twilio phone number

4 After you have authenticated and are viewing your account click your ID in the

right corner and select Account

5 In the API Credentials section note your AccountSID and AuthToken (You

might want to leave this page open as you continue so you can easily copy the

credentials)

b If you do not want to receive text messages

If you do not want to receive text messages to your phone because your carrier charges

ridiculous amounts you can instead send the text messages to your Twilio account

12

phone number If yoursquore ok with receiving text messages on your phone skip this

section and continue on to step c

i In Twilio click NUMBERS in the top navigation bar

ii Click your phone number in the Number table

iii In the Messaging section replace the Request URL with any valid url (this

prevents a never ending loop of your phone number sending a response to the

text message it just received) For example you might replace the Request URL

with a link to your Laurenrsquos Lovely Landscapes app

iv Click Save

v Click Numbers in the top navigation bar

vi Click Verify a number

vii Click text you instead

viii Input your Twilio phone number in the Phone Number box

ix Click Text Me

x In a new tab or window navigate to twiliocom and click Account

xi Click NUMBERS in the top navigation bar

xii Click your number in the Number table

xiii Click Inbound in the Messaging section

xiv Hover over the text message in the table to see the incoming message Note

the verification number in the text messagersquos body

xv Return to your original tab or window and input the verification number

xvi Click Submit

When you want to view incoming text messages for your Twilio number return to the

details page for your number and click Inbound

c Add the Twilio service to the app

Begin by adding the Bluemix Twilio service to your app

i In DevOps Services click EDIT CODE in the upper-right corner

ii Click the Open application dashboard button ( ) The Bluemix page for your

app opens

iii Click ADD A SERVICE OR API

13

iv Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

v Click the Twilio service

vi In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

vii Click CREATE

viii When prompted restage your application now by clicking RESTAGE

ix Wait for the page to indicate that your app is running

d Add code that uses the Twilio service

Add code to your app that sends a text message whenever a price is retrieved for an

item Use the Twilio service to actually send the text message

i Add Twilio to requirementstxt

Your app needs the Twilio module so you must add it to the requirementstxt

file

1 In the Web IDE open requirementstxt

2 Add a new line to the end of the file and type twilio

3 Select File gt Save

ii Connect to the Twilio service

To effectively use your Twilio service you must connect to it

1 In the Web IDE open the wsgipy file

2 In the Imports section around Line 55 add the following line from twiliorest import TwilioRestClient

3 As part of the for loop that begins around Line 65 add the following

lines

Note Be sure your spacing before these two lines (spaces and tabs) is

identical to the if statement that checks if the key starts with

ldquocloudantrdquo

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

4 Your Twilio credentials are now stored in twilio_creds Your code

should now look like the following listing

14

for key value in decoded_configiteritems()

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

if keystartswith(cloudant)

cloudant_creds = decoded_config[key][0][credentials]

cloudant_host = cloudant_creds[host]

cloudant_port = int(cloudant_creds[port])

cloudant_username = cloudant_creds[username]

cloudant_password = cloudant_creds[password]

cloudant_url = str(cloudant_creds[url])

account = cloudantAccount(cloudant_username)

login = accountlogin(cloudant_username cloudant_password)

assert loginstatus_code == 200

db = accountdatabase(dbname)

response = dbput()

print responsejson

5 Save your changes by selecting File gt Save

e Add code to send the text message

Now comes the fun part Its time to code

Continue to work in the wsgipy file and create a new function around Line 89 that

sends a text message def sendTextWithMessage(message)

message = twilioClientmessagescreate(to=+15555555555 from_=+15555555555

body=message)

f Replace the to number with the cell phone number or Twilio number where you want

the text messages to be sent (dont forget the country code)

g Replace the from number with your Twilio phone number (dont forget the country

code)

h In the getCurrentPrice function inside of the if statement that checks if the

price is not None add the following line of code sendTextWithMessage(The current price of s is s (item[name] price))

i Save your changes by selecting File gt Save

Thats it Youve implemented your feature with only nine lines of code

3 Deploy and test the feature

Now its time to deploy your application to Bluemix so you can test it

a Click the Deploy button ( )

b If prompted if you want to stop and redeploy click OK

c After your application has finished deploying click the Open URL button ( ) in the top

gray bar

d In your app click Get Prices

15

e Check your phone or Twilio number for a text message

If you like update the prices of the items in the store and get the prices again

4 Push the feature to the repository

Now that your feature is tested its time to push your changes to the Git repository

a In the leftmost bar of icons click the Git Repository button ( )

b In the box in the Working Directory Changes section type a comment similar to the

following being sure to replace 20 with the work item ID associated with the work item

you created Changes to implement the text messaging feature as

described in work item 20

c Select each change in the Changed Files section and click the COMMIT button

d In the OUTGOING section click PUSH

e If you are prompted for your committer information enter it and click OK

5 Complete the feature

To indicate that you have finished your feature mark your work item as complete

a In the Web IDE click TRACK amp PLAN in the upper-right corner

b In the right pane find your work item associated with the text messaging feature and

click the Status In Progress icon

c Click Set Done

d In the right pane scroll right until you see the RESOLVED section Notice that your work

item is now marked done

6 Discover the traceability

When you added a comment in your commit that mentioned your work item a link was

automatically created for you between the change and the work item

a In the right pane scroll to the Resolved view if you are not currently viewing your

resolved work items

b Click the textual summary of the work item associated with the text messaging feature

to open it

c In the work item click the Links tab

d In the LINKS section notice that a link was automatically generated for you Click the

link The Git Log displays

e Observe that you have a summary of the git commit and its associated work items

f Click GIT LOG in the left navigation to see a list of all of your git commits

16

Tweet this

Collaborate with me on this Bluemix app I created [insert link to your app] [include a

screenshot of the Web IDE with your codemdashTweets with images are more likely to get noticed]

Get creative

Invite a friend to join your project Navigate to your projects home page click Members and

invite a friend to join

Create new work items for features yoursquod like to implement or defects you find

Implement some of the stories you created or fix the defects you recorded

Additional resources

Twilio SMS and MMS Python Quickstart httpswwwtwiliocomdocsquickstartpythonsms

Managing Distributed Teams

httpswwwscrumallianceorgcommunityarticles2013julymanaging-distributed-

teamsaspx

So Long Scrum Hello Kanban httpsstormpathcomblogso-long-scrum-hello-kanban

17

Part 1D Deploying Automatically Using the Delivery Pipeline

Learn this

Deployment automation is one of the keys to a successful DevOps approach

You can create a complete delivery pipeline with multiple stages automated tests and

automatic deploys using DevOps Services

Try this

You can configure a multi-stage build and deployment pipeline to support your DevOps approach to

software development In this section you will configure a builder a deployment to your

development (dev) space and a deployment to your production (prod) space

1 Create a production space

Organizations and spaces are organizational units in the Cloud Foundry infrastructure that can

be used to store and track application resources An organization contains domains spaces and

users a space contains applications and services By default a dev (development) space is

created for you

a Navigate to the Bluemix dashboard if you are not there already

b Click Create a Space in the left menu

c In the Create a Space dialog input prod as your space name and click CREATE

2 Create services for deployments to your dev space

When deploying to your dev and prod spaces you will likely want to have services dedicated to

those deployments For example you want to use separate databases for each space Wersquoll

begin by creating services for each space

a Navigate to the Bluemix dashboard if you are not there already

b Click CATALOG

c Create the Cloudant NoSQL DB service

i Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data

and Analytics section The catalog is constantly being updated with new

services

ii Click the Cloudant NoSQL DB service

iii In the Space dropdown choose dev

iv In the App dropdown choose Leave unbound

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 10: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

9

Part 1C Planning Tracking amp Leveraging New Bluemix Services

Learn this

Leveraging software as a service that works well with the platform as a service of your choice

can greatly speed up your software delivery lifecycle

Agile planning and tracking is simple in the cloud and creates built-in traceability for all of your

teammateshellipwhether they are collocated or distributed

Writing code that leverages a Bluemix service can be fast and significantly reduce development

time

Try this

1 Plan a new feature to add to the Fabulous Price Finder

So far you have made use of existing code but you havent created anything new Time to

change that

When working with teammates or even by yourself organizing your ideas into user stories and

then organizing your user stories into a plan can be incredibly valuable

a Open Track amp Plan

i Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated

and clicking on your project on the My Projects page

ii Click the gear button ( ) in the upper-right corner to open the Project

Settings page

iii Click OPTIONS

iv On the page that loads select the Enable Track amp Plan checkbox (if it is not

already enabled) and click SAVE

v Click TRACK amp PLAN in the upper-right corner The Track amp Plan section is your

place to organize your ideas

b Create work items in your backlog

i On the left pane click Backlog

ii On the right pane type the following in the Create a work itemhellip field As a shopper I want a text message sent to me with the

price of each item so that I dont have to check the

website to view the prices

10

iii The tool will automatically detect the work item type is story and set the type

for you

iv In the icon bar below click the Owned By icon and select your username

v Click CREATE

vi Repeat Steps 2-5 to create work items for the following stories

1 As a shopper I want to organize my items by

store so that I only have to input the field ID

once per store instead of every item

2 As a shopper I want to see a graph of the price

of the items Im watching over time so I can

judge if its a good time to buy the items

3 As a shopper I want the prices to be retrieved

automatically for me on a daily basis so I dont

have to log in manually and click Get Prices

4 As a shopper I want the prices to be texted to

me only when the price has changed so Im not

getting inundated with text messages

vii Create a work item of type defect with the following summary The View

Database page fails to load when the database is empty

c Plan your work

Now that you have filled your backlog with stories its time to plan your first sprint

i On the left pane click Sprint Planning A sprint represents a period of time

Organize your user stories in sprints

ii Click Add Sprints

iii Configure the sprints so you have at least two and click Create

iv In the Backlog section rearrange your stories so they are in a ranked order by

dragging and dropping them Put As a shopper I want a text message sent to me with the price of each item so that

I dont have to check the website to view the prices as

the top item in the list and As a shopper I want the prices to be retrieved automatically for me on a daily basis so

I dont have to log in manually and click Get Prices as

the second highest item in the list

v Click the Sprint 1 dropbdown box and select Sprint 1 so that Sprint 1 appears to

the right of the backlog (You may need to click Sprint 2 and then click Sprint 1

in order for the sprint to appear)

11

vi Assume you have time to complete one user story per sprint Drag the topmost

item in the list to Sprint 1 (on the right)

vii In the sprint dropdown box select Sprint 2

viii Drag the new top most item to Sprint 2

d Track your work

Sprint 1 has begun Indicate that you have started working on the first work item by

marking it as In Progress

i In the sprint dropdown box select Sprint 1

ii In the Sprint 1 section click the Status New icon ( ) for the story planned

for Sprint 1

iii In the Status dialog click Start Working

iv Note the work item ID for your work item because you will need it later in this

lab

2 Implement the feature

Next implement the work item As a shopper I want a text message sent to me with the price of each item so that I dont have to check the

website to view the prices The idea of implementing a text messaging feature

might sound a bit daunting to you Fortunately Bluemix provides a Twilio service you can use

that handles sending the text message so you can implement this feature with only nine lines of

code

a Register with Twilio

If you do not already have an account with Twilio you need to register You also need

your Twilio AccountSID Auth Token and phone number

1 Go to httpswwwtwiliocom and sign up

2 Follow the on-screen instructions to verify your account

3 Note your Twilio phone number

4 After you have authenticated and are viewing your account click your ID in the

right corner and select Account

5 In the API Credentials section note your AccountSID and AuthToken (You

might want to leave this page open as you continue so you can easily copy the

credentials)

b If you do not want to receive text messages

If you do not want to receive text messages to your phone because your carrier charges

ridiculous amounts you can instead send the text messages to your Twilio account

12

phone number If yoursquore ok with receiving text messages on your phone skip this

section and continue on to step c

i In Twilio click NUMBERS in the top navigation bar

ii Click your phone number in the Number table

iii In the Messaging section replace the Request URL with any valid url (this

prevents a never ending loop of your phone number sending a response to the

text message it just received) For example you might replace the Request URL

with a link to your Laurenrsquos Lovely Landscapes app

iv Click Save

v Click Numbers in the top navigation bar

vi Click Verify a number

vii Click text you instead

viii Input your Twilio phone number in the Phone Number box

ix Click Text Me

x In a new tab or window navigate to twiliocom and click Account

xi Click NUMBERS in the top navigation bar

xii Click your number in the Number table

xiii Click Inbound in the Messaging section

xiv Hover over the text message in the table to see the incoming message Note

the verification number in the text messagersquos body

xv Return to your original tab or window and input the verification number

xvi Click Submit

When you want to view incoming text messages for your Twilio number return to the

details page for your number and click Inbound

c Add the Twilio service to the app

Begin by adding the Bluemix Twilio service to your app

i In DevOps Services click EDIT CODE in the upper-right corner

ii Click the Open application dashboard button ( ) The Bluemix page for your

app opens

iii Click ADD A SERVICE OR API

13

iv Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

v Click the Twilio service

vi In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

vii Click CREATE

viii When prompted restage your application now by clicking RESTAGE

ix Wait for the page to indicate that your app is running

d Add code that uses the Twilio service

Add code to your app that sends a text message whenever a price is retrieved for an

item Use the Twilio service to actually send the text message

i Add Twilio to requirementstxt

Your app needs the Twilio module so you must add it to the requirementstxt

file

1 In the Web IDE open requirementstxt

2 Add a new line to the end of the file and type twilio

3 Select File gt Save

ii Connect to the Twilio service

To effectively use your Twilio service you must connect to it

1 In the Web IDE open the wsgipy file

2 In the Imports section around Line 55 add the following line from twiliorest import TwilioRestClient

3 As part of the for loop that begins around Line 65 add the following

lines

Note Be sure your spacing before these two lines (spaces and tabs) is

identical to the if statement that checks if the key starts with

ldquocloudantrdquo

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

4 Your Twilio credentials are now stored in twilio_creds Your code

should now look like the following listing

14

for key value in decoded_configiteritems()

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

if keystartswith(cloudant)

cloudant_creds = decoded_config[key][0][credentials]

cloudant_host = cloudant_creds[host]

cloudant_port = int(cloudant_creds[port])

cloudant_username = cloudant_creds[username]

cloudant_password = cloudant_creds[password]

cloudant_url = str(cloudant_creds[url])

account = cloudantAccount(cloudant_username)

login = accountlogin(cloudant_username cloudant_password)

assert loginstatus_code == 200

db = accountdatabase(dbname)

response = dbput()

print responsejson

5 Save your changes by selecting File gt Save

e Add code to send the text message

Now comes the fun part Its time to code

Continue to work in the wsgipy file and create a new function around Line 89 that

sends a text message def sendTextWithMessage(message)

message = twilioClientmessagescreate(to=+15555555555 from_=+15555555555

body=message)

f Replace the to number with the cell phone number or Twilio number where you want

the text messages to be sent (dont forget the country code)

g Replace the from number with your Twilio phone number (dont forget the country

code)

h In the getCurrentPrice function inside of the if statement that checks if the

price is not None add the following line of code sendTextWithMessage(The current price of s is s (item[name] price))

i Save your changes by selecting File gt Save

Thats it Youve implemented your feature with only nine lines of code

3 Deploy and test the feature

Now its time to deploy your application to Bluemix so you can test it

a Click the Deploy button ( )

b If prompted if you want to stop and redeploy click OK

c After your application has finished deploying click the Open URL button ( ) in the top

gray bar

d In your app click Get Prices

15

e Check your phone or Twilio number for a text message

If you like update the prices of the items in the store and get the prices again

4 Push the feature to the repository

Now that your feature is tested its time to push your changes to the Git repository

a In the leftmost bar of icons click the Git Repository button ( )

b In the box in the Working Directory Changes section type a comment similar to the

following being sure to replace 20 with the work item ID associated with the work item

you created Changes to implement the text messaging feature as

described in work item 20

c Select each change in the Changed Files section and click the COMMIT button

d In the OUTGOING section click PUSH

e If you are prompted for your committer information enter it and click OK

5 Complete the feature

To indicate that you have finished your feature mark your work item as complete

a In the Web IDE click TRACK amp PLAN in the upper-right corner

b In the right pane find your work item associated with the text messaging feature and

click the Status In Progress icon

c Click Set Done

d In the right pane scroll right until you see the RESOLVED section Notice that your work

item is now marked done

6 Discover the traceability

When you added a comment in your commit that mentioned your work item a link was

automatically created for you between the change and the work item

a In the right pane scroll to the Resolved view if you are not currently viewing your

resolved work items

b Click the textual summary of the work item associated with the text messaging feature

to open it

c In the work item click the Links tab

d In the LINKS section notice that a link was automatically generated for you Click the

link The Git Log displays

e Observe that you have a summary of the git commit and its associated work items

f Click GIT LOG in the left navigation to see a list of all of your git commits

16

Tweet this

Collaborate with me on this Bluemix app I created [insert link to your app] [include a

screenshot of the Web IDE with your codemdashTweets with images are more likely to get noticed]

Get creative

Invite a friend to join your project Navigate to your projects home page click Members and

invite a friend to join

Create new work items for features yoursquod like to implement or defects you find

Implement some of the stories you created or fix the defects you recorded

Additional resources

Twilio SMS and MMS Python Quickstart httpswwwtwiliocomdocsquickstartpythonsms

Managing Distributed Teams

httpswwwscrumallianceorgcommunityarticles2013julymanaging-distributed-

teamsaspx

So Long Scrum Hello Kanban httpsstormpathcomblogso-long-scrum-hello-kanban

17

Part 1D Deploying Automatically Using the Delivery Pipeline

Learn this

Deployment automation is one of the keys to a successful DevOps approach

You can create a complete delivery pipeline with multiple stages automated tests and

automatic deploys using DevOps Services

Try this

You can configure a multi-stage build and deployment pipeline to support your DevOps approach to

software development In this section you will configure a builder a deployment to your

development (dev) space and a deployment to your production (prod) space

1 Create a production space

Organizations and spaces are organizational units in the Cloud Foundry infrastructure that can

be used to store and track application resources An organization contains domains spaces and

users a space contains applications and services By default a dev (development) space is

created for you

a Navigate to the Bluemix dashboard if you are not there already

b Click Create a Space in the left menu

c In the Create a Space dialog input prod as your space name and click CREATE

2 Create services for deployments to your dev space

When deploying to your dev and prod spaces you will likely want to have services dedicated to

those deployments For example you want to use separate databases for each space Wersquoll

begin by creating services for each space

a Navigate to the Bluemix dashboard if you are not there already

b Click CATALOG

c Create the Cloudant NoSQL DB service

i Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data

and Analytics section The catalog is constantly being updated with new

services

ii Click the Cloudant NoSQL DB service

iii In the Space dropdown choose dev

iv In the App dropdown choose Leave unbound

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 11: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

10

iii The tool will automatically detect the work item type is story and set the type

for you

iv In the icon bar below click the Owned By icon and select your username

v Click CREATE

vi Repeat Steps 2-5 to create work items for the following stories

1 As a shopper I want to organize my items by

store so that I only have to input the field ID

once per store instead of every item

2 As a shopper I want to see a graph of the price

of the items Im watching over time so I can

judge if its a good time to buy the items

3 As a shopper I want the prices to be retrieved

automatically for me on a daily basis so I dont

have to log in manually and click Get Prices

4 As a shopper I want the prices to be texted to

me only when the price has changed so Im not

getting inundated with text messages

vii Create a work item of type defect with the following summary The View

Database page fails to load when the database is empty

c Plan your work

Now that you have filled your backlog with stories its time to plan your first sprint

i On the left pane click Sprint Planning A sprint represents a period of time

Organize your user stories in sprints

ii Click Add Sprints

iii Configure the sprints so you have at least two and click Create

iv In the Backlog section rearrange your stories so they are in a ranked order by

dragging and dropping them Put As a shopper I want a text message sent to me with the price of each item so that

I dont have to check the website to view the prices as

the top item in the list and As a shopper I want the prices to be retrieved automatically for me on a daily basis so

I dont have to log in manually and click Get Prices as

the second highest item in the list

v Click the Sprint 1 dropbdown box and select Sprint 1 so that Sprint 1 appears to

the right of the backlog (You may need to click Sprint 2 and then click Sprint 1

in order for the sprint to appear)

11

vi Assume you have time to complete one user story per sprint Drag the topmost

item in the list to Sprint 1 (on the right)

vii In the sprint dropdown box select Sprint 2

viii Drag the new top most item to Sprint 2

d Track your work

Sprint 1 has begun Indicate that you have started working on the first work item by

marking it as In Progress

i In the sprint dropdown box select Sprint 1

ii In the Sprint 1 section click the Status New icon ( ) for the story planned

for Sprint 1

iii In the Status dialog click Start Working

iv Note the work item ID for your work item because you will need it later in this

lab

2 Implement the feature

Next implement the work item As a shopper I want a text message sent to me with the price of each item so that I dont have to check the

website to view the prices The idea of implementing a text messaging feature

might sound a bit daunting to you Fortunately Bluemix provides a Twilio service you can use

that handles sending the text message so you can implement this feature with only nine lines of

code

a Register with Twilio

If you do not already have an account with Twilio you need to register You also need

your Twilio AccountSID Auth Token and phone number

1 Go to httpswwwtwiliocom and sign up

2 Follow the on-screen instructions to verify your account

3 Note your Twilio phone number

4 After you have authenticated and are viewing your account click your ID in the

right corner and select Account

5 In the API Credentials section note your AccountSID and AuthToken (You

might want to leave this page open as you continue so you can easily copy the

credentials)

b If you do not want to receive text messages

If you do not want to receive text messages to your phone because your carrier charges

ridiculous amounts you can instead send the text messages to your Twilio account

12

phone number If yoursquore ok with receiving text messages on your phone skip this

section and continue on to step c

i In Twilio click NUMBERS in the top navigation bar

ii Click your phone number in the Number table

iii In the Messaging section replace the Request URL with any valid url (this

prevents a never ending loop of your phone number sending a response to the

text message it just received) For example you might replace the Request URL

with a link to your Laurenrsquos Lovely Landscapes app

iv Click Save

v Click Numbers in the top navigation bar

vi Click Verify a number

vii Click text you instead

viii Input your Twilio phone number in the Phone Number box

ix Click Text Me

x In a new tab or window navigate to twiliocom and click Account

xi Click NUMBERS in the top navigation bar

xii Click your number in the Number table

xiii Click Inbound in the Messaging section

xiv Hover over the text message in the table to see the incoming message Note

the verification number in the text messagersquos body

xv Return to your original tab or window and input the verification number

xvi Click Submit

When you want to view incoming text messages for your Twilio number return to the

details page for your number and click Inbound

c Add the Twilio service to the app

Begin by adding the Bluemix Twilio service to your app

i In DevOps Services click EDIT CODE in the upper-right corner

ii Click the Open application dashboard button ( ) The Bluemix page for your

app opens

iii Click ADD A SERVICE OR API

13

iv Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

v Click the Twilio service

vi In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

vii Click CREATE

viii When prompted restage your application now by clicking RESTAGE

ix Wait for the page to indicate that your app is running

d Add code that uses the Twilio service

Add code to your app that sends a text message whenever a price is retrieved for an

item Use the Twilio service to actually send the text message

i Add Twilio to requirementstxt

Your app needs the Twilio module so you must add it to the requirementstxt

file

1 In the Web IDE open requirementstxt

2 Add a new line to the end of the file and type twilio

3 Select File gt Save

ii Connect to the Twilio service

To effectively use your Twilio service you must connect to it

1 In the Web IDE open the wsgipy file

2 In the Imports section around Line 55 add the following line from twiliorest import TwilioRestClient

3 As part of the for loop that begins around Line 65 add the following

lines

Note Be sure your spacing before these two lines (spaces and tabs) is

identical to the if statement that checks if the key starts with

ldquocloudantrdquo

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

4 Your Twilio credentials are now stored in twilio_creds Your code

should now look like the following listing

14

for key value in decoded_configiteritems()

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

if keystartswith(cloudant)

cloudant_creds = decoded_config[key][0][credentials]

cloudant_host = cloudant_creds[host]

cloudant_port = int(cloudant_creds[port])

cloudant_username = cloudant_creds[username]

cloudant_password = cloudant_creds[password]

cloudant_url = str(cloudant_creds[url])

account = cloudantAccount(cloudant_username)

login = accountlogin(cloudant_username cloudant_password)

assert loginstatus_code == 200

db = accountdatabase(dbname)

response = dbput()

print responsejson

5 Save your changes by selecting File gt Save

e Add code to send the text message

Now comes the fun part Its time to code

Continue to work in the wsgipy file and create a new function around Line 89 that

sends a text message def sendTextWithMessage(message)

message = twilioClientmessagescreate(to=+15555555555 from_=+15555555555

body=message)

f Replace the to number with the cell phone number or Twilio number where you want

the text messages to be sent (dont forget the country code)

g Replace the from number with your Twilio phone number (dont forget the country

code)

h In the getCurrentPrice function inside of the if statement that checks if the

price is not None add the following line of code sendTextWithMessage(The current price of s is s (item[name] price))

i Save your changes by selecting File gt Save

Thats it Youve implemented your feature with only nine lines of code

3 Deploy and test the feature

Now its time to deploy your application to Bluemix so you can test it

a Click the Deploy button ( )

b If prompted if you want to stop and redeploy click OK

c After your application has finished deploying click the Open URL button ( ) in the top

gray bar

d In your app click Get Prices

15

e Check your phone or Twilio number for a text message

If you like update the prices of the items in the store and get the prices again

4 Push the feature to the repository

Now that your feature is tested its time to push your changes to the Git repository

a In the leftmost bar of icons click the Git Repository button ( )

b In the box in the Working Directory Changes section type a comment similar to the

following being sure to replace 20 with the work item ID associated with the work item

you created Changes to implement the text messaging feature as

described in work item 20

c Select each change in the Changed Files section and click the COMMIT button

d In the OUTGOING section click PUSH

e If you are prompted for your committer information enter it and click OK

5 Complete the feature

To indicate that you have finished your feature mark your work item as complete

a In the Web IDE click TRACK amp PLAN in the upper-right corner

b In the right pane find your work item associated with the text messaging feature and

click the Status In Progress icon

c Click Set Done

d In the right pane scroll right until you see the RESOLVED section Notice that your work

item is now marked done

6 Discover the traceability

When you added a comment in your commit that mentioned your work item a link was

automatically created for you between the change and the work item

a In the right pane scroll to the Resolved view if you are not currently viewing your

resolved work items

b Click the textual summary of the work item associated with the text messaging feature

to open it

c In the work item click the Links tab

d In the LINKS section notice that a link was automatically generated for you Click the

link The Git Log displays

e Observe that you have a summary of the git commit and its associated work items

f Click GIT LOG in the left navigation to see a list of all of your git commits

16

Tweet this

Collaborate with me on this Bluemix app I created [insert link to your app] [include a

screenshot of the Web IDE with your codemdashTweets with images are more likely to get noticed]

Get creative

Invite a friend to join your project Navigate to your projects home page click Members and

invite a friend to join

Create new work items for features yoursquod like to implement or defects you find

Implement some of the stories you created or fix the defects you recorded

Additional resources

Twilio SMS and MMS Python Quickstart httpswwwtwiliocomdocsquickstartpythonsms

Managing Distributed Teams

httpswwwscrumallianceorgcommunityarticles2013julymanaging-distributed-

teamsaspx

So Long Scrum Hello Kanban httpsstormpathcomblogso-long-scrum-hello-kanban

17

Part 1D Deploying Automatically Using the Delivery Pipeline

Learn this

Deployment automation is one of the keys to a successful DevOps approach

You can create a complete delivery pipeline with multiple stages automated tests and

automatic deploys using DevOps Services

Try this

You can configure a multi-stage build and deployment pipeline to support your DevOps approach to

software development In this section you will configure a builder a deployment to your

development (dev) space and a deployment to your production (prod) space

1 Create a production space

Organizations and spaces are organizational units in the Cloud Foundry infrastructure that can

be used to store and track application resources An organization contains domains spaces and

users a space contains applications and services By default a dev (development) space is

created for you

a Navigate to the Bluemix dashboard if you are not there already

b Click Create a Space in the left menu

c In the Create a Space dialog input prod as your space name and click CREATE

2 Create services for deployments to your dev space

When deploying to your dev and prod spaces you will likely want to have services dedicated to

those deployments For example you want to use separate databases for each space Wersquoll

begin by creating services for each space

a Navigate to the Bluemix dashboard if you are not there already

b Click CATALOG

c Create the Cloudant NoSQL DB service

i Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data

and Analytics section The catalog is constantly being updated with new

services

ii Click the Cloudant NoSQL DB service

iii In the Space dropdown choose dev

iv In the App dropdown choose Leave unbound

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 12: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

11

vi Assume you have time to complete one user story per sprint Drag the topmost

item in the list to Sprint 1 (on the right)

vii In the sprint dropdown box select Sprint 2

viii Drag the new top most item to Sprint 2

d Track your work

Sprint 1 has begun Indicate that you have started working on the first work item by

marking it as In Progress

i In the sprint dropdown box select Sprint 1

ii In the Sprint 1 section click the Status New icon ( ) for the story planned

for Sprint 1

iii In the Status dialog click Start Working

iv Note the work item ID for your work item because you will need it later in this

lab

2 Implement the feature

Next implement the work item As a shopper I want a text message sent to me with the price of each item so that I dont have to check the

website to view the prices The idea of implementing a text messaging feature

might sound a bit daunting to you Fortunately Bluemix provides a Twilio service you can use

that handles sending the text message so you can implement this feature with only nine lines of

code

a Register with Twilio

If you do not already have an account with Twilio you need to register You also need

your Twilio AccountSID Auth Token and phone number

1 Go to httpswwwtwiliocom and sign up

2 Follow the on-screen instructions to verify your account

3 Note your Twilio phone number

4 After you have authenticated and are viewing your account click your ID in the

right corner and select Account

5 In the API Credentials section note your AccountSID and AuthToken (You

might want to leave this page open as you continue so you can easily copy the

credentials)

b If you do not want to receive text messages

If you do not want to receive text messages to your phone because your carrier charges

ridiculous amounts you can instead send the text messages to your Twilio account

12

phone number If yoursquore ok with receiving text messages on your phone skip this

section and continue on to step c

i In Twilio click NUMBERS in the top navigation bar

ii Click your phone number in the Number table

iii In the Messaging section replace the Request URL with any valid url (this

prevents a never ending loop of your phone number sending a response to the

text message it just received) For example you might replace the Request URL

with a link to your Laurenrsquos Lovely Landscapes app

iv Click Save

v Click Numbers in the top navigation bar

vi Click Verify a number

vii Click text you instead

viii Input your Twilio phone number in the Phone Number box

ix Click Text Me

x In a new tab or window navigate to twiliocom and click Account

xi Click NUMBERS in the top navigation bar

xii Click your number in the Number table

xiii Click Inbound in the Messaging section

xiv Hover over the text message in the table to see the incoming message Note

the verification number in the text messagersquos body

xv Return to your original tab or window and input the verification number

xvi Click Submit

When you want to view incoming text messages for your Twilio number return to the

details page for your number and click Inbound

c Add the Twilio service to the app

Begin by adding the Bluemix Twilio service to your app

i In DevOps Services click EDIT CODE in the upper-right corner

ii Click the Open application dashboard button ( ) The Bluemix page for your

app opens

iii Click ADD A SERVICE OR API

13

iv Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

v Click the Twilio service

vi In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

vii Click CREATE

viii When prompted restage your application now by clicking RESTAGE

ix Wait for the page to indicate that your app is running

d Add code that uses the Twilio service

Add code to your app that sends a text message whenever a price is retrieved for an

item Use the Twilio service to actually send the text message

i Add Twilio to requirementstxt

Your app needs the Twilio module so you must add it to the requirementstxt

file

1 In the Web IDE open requirementstxt

2 Add a new line to the end of the file and type twilio

3 Select File gt Save

ii Connect to the Twilio service

To effectively use your Twilio service you must connect to it

1 In the Web IDE open the wsgipy file

2 In the Imports section around Line 55 add the following line from twiliorest import TwilioRestClient

3 As part of the for loop that begins around Line 65 add the following

lines

Note Be sure your spacing before these two lines (spaces and tabs) is

identical to the if statement that checks if the key starts with

ldquocloudantrdquo

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

4 Your Twilio credentials are now stored in twilio_creds Your code

should now look like the following listing

14

for key value in decoded_configiteritems()

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

if keystartswith(cloudant)

cloudant_creds = decoded_config[key][0][credentials]

cloudant_host = cloudant_creds[host]

cloudant_port = int(cloudant_creds[port])

cloudant_username = cloudant_creds[username]

cloudant_password = cloudant_creds[password]

cloudant_url = str(cloudant_creds[url])

account = cloudantAccount(cloudant_username)

login = accountlogin(cloudant_username cloudant_password)

assert loginstatus_code == 200

db = accountdatabase(dbname)

response = dbput()

print responsejson

5 Save your changes by selecting File gt Save

e Add code to send the text message

Now comes the fun part Its time to code

Continue to work in the wsgipy file and create a new function around Line 89 that

sends a text message def sendTextWithMessage(message)

message = twilioClientmessagescreate(to=+15555555555 from_=+15555555555

body=message)

f Replace the to number with the cell phone number or Twilio number where you want

the text messages to be sent (dont forget the country code)

g Replace the from number with your Twilio phone number (dont forget the country

code)

h In the getCurrentPrice function inside of the if statement that checks if the

price is not None add the following line of code sendTextWithMessage(The current price of s is s (item[name] price))

i Save your changes by selecting File gt Save

Thats it Youve implemented your feature with only nine lines of code

3 Deploy and test the feature

Now its time to deploy your application to Bluemix so you can test it

a Click the Deploy button ( )

b If prompted if you want to stop and redeploy click OK

c After your application has finished deploying click the Open URL button ( ) in the top

gray bar

d In your app click Get Prices

15

e Check your phone or Twilio number for a text message

If you like update the prices of the items in the store and get the prices again

4 Push the feature to the repository

Now that your feature is tested its time to push your changes to the Git repository

a In the leftmost bar of icons click the Git Repository button ( )

b In the box in the Working Directory Changes section type a comment similar to the

following being sure to replace 20 with the work item ID associated with the work item

you created Changes to implement the text messaging feature as

described in work item 20

c Select each change in the Changed Files section and click the COMMIT button

d In the OUTGOING section click PUSH

e If you are prompted for your committer information enter it and click OK

5 Complete the feature

To indicate that you have finished your feature mark your work item as complete

a In the Web IDE click TRACK amp PLAN in the upper-right corner

b In the right pane find your work item associated with the text messaging feature and

click the Status In Progress icon

c Click Set Done

d In the right pane scroll right until you see the RESOLVED section Notice that your work

item is now marked done

6 Discover the traceability

When you added a comment in your commit that mentioned your work item a link was

automatically created for you between the change and the work item

a In the right pane scroll to the Resolved view if you are not currently viewing your

resolved work items

b Click the textual summary of the work item associated with the text messaging feature

to open it

c In the work item click the Links tab

d In the LINKS section notice that a link was automatically generated for you Click the

link The Git Log displays

e Observe that you have a summary of the git commit and its associated work items

f Click GIT LOG in the left navigation to see a list of all of your git commits

16

Tweet this

Collaborate with me on this Bluemix app I created [insert link to your app] [include a

screenshot of the Web IDE with your codemdashTweets with images are more likely to get noticed]

Get creative

Invite a friend to join your project Navigate to your projects home page click Members and

invite a friend to join

Create new work items for features yoursquod like to implement or defects you find

Implement some of the stories you created or fix the defects you recorded

Additional resources

Twilio SMS and MMS Python Quickstart httpswwwtwiliocomdocsquickstartpythonsms

Managing Distributed Teams

httpswwwscrumallianceorgcommunityarticles2013julymanaging-distributed-

teamsaspx

So Long Scrum Hello Kanban httpsstormpathcomblogso-long-scrum-hello-kanban

17

Part 1D Deploying Automatically Using the Delivery Pipeline

Learn this

Deployment automation is one of the keys to a successful DevOps approach

You can create a complete delivery pipeline with multiple stages automated tests and

automatic deploys using DevOps Services

Try this

You can configure a multi-stage build and deployment pipeline to support your DevOps approach to

software development In this section you will configure a builder a deployment to your

development (dev) space and a deployment to your production (prod) space

1 Create a production space

Organizations and spaces are organizational units in the Cloud Foundry infrastructure that can

be used to store and track application resources An organization contains domains spaces and

users a space contains applications and services By default a dev (development) space is

created for you

a Navigate to the Bluemix dashboard if you are not there already

b Click Create a Space in the left menu

c In the Create a Space dialog input prod as your space name and click CREATE

2 Create services for deployments to your dev space

When deploying to your dev and prod spaces you will likely want to have services dedicated to

those deployments For example you want to use separate databases for each space Wersquoll

begin by creating services for each space

a Navigate to the Bluemix dashboard if you are not there already

b Click CATALOG

c Create the Cloudant NoSQL DB service

i Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data

and Analytics section The catalog is constantly being updated with new

services

ii Click the Cloudant NoSQL DB service

iii In the Space dropdown choose dev

iv In the App dropdown choose Leave unbound

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 13: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

12

phone number If yoursquore ok with receiving text messages on your phone skip this

section and continue on to step c

i In Twilio click NUMBERS in the top navigation bar

ii Click your phone number in the Number table

iii In the Messaging section replace the Request URL with any valid url (this

prevents a never ending loop of your phone number sending a response to the

text message it just received) For example you might replace the Request URL

with a link to your Laurenrsquos Lovely Landscapes app

iv Click Save

v Click Numbers in the top navigation bar

vi Click Verify a number

vii Click text you instead

viii Input your Twilio phone number in the Phone Number box

ix Click Text Me

x In a new tab or window navigate to twiliocom and click Account

xi Click NUMBERS in the top navigation bar

xii Click your number in the Number table

xiii Click Inbound in the Messaging section

xiv Hover over the text message in the table to see the incoming message Note

the verification number in the text messagersquos body

xv Return to your original tab or window and input the verification number

xvi Click Submit

When you want to view incoming text messages for your Twilio number return to the

details page for your number and click Inbound

c Add the Twilio service to the app

Begin by adding the Bluemix Twilio service to your app

i In DevOps Services click EDIT CODE in the upper-right corner

ii Click the Open application dashboard button ( ) The Bluemix page for your

app opens

iii Click ADD A SERVICE OR API

13

iv Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

v Click the Twilio service

vi In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

vii Click CREATE

viii When prompted restage your application now by clicking RESTAGE

ix Wait for the page to indicate that your app is running

d Add code that uses the Twilio service

Add code to your app that sends a text message whenever a price is retrieved for an

item Use the Twilio service to actually send the text message

i Add Twilio to requirementstxt

Your app needs the Twilio module so you must add it to the requirementstxt

file

1 In the Web IDE open requirementstxt

2 Add a new line to the end of the file and type twilio

3 Select File gt Save

ii Connect to the Twilio service

To effectively use your Twilio service you must connect to it

1 In the Web IDE open the wsgipy file

2 In the Imports section around Line 55 add the following line from twiliorest import TwilioRestClient

3 As part of the for loop that begins around Line 65 add the following

lines

Note Be sure your spacing before these two lines (spaces and tabs) is

identical to the if statement that checks if the key starts with

ldquocloudantrdquo

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

4 Your Twilio credentials are now stored in twilio_creds Your code

should now look like the following listing

14

for key value in decoded_configiteritems()

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

if keystartswith(cloudant)

cloudant_creds = decoded_config[key][0][credentials]

cloudant_host = cloudant_creds[host]

cloudant_port = int(cloudant_creds[port])

cloudant_username = cloudant_creds[username]

cloudant_password = cloudant_creds[password]

cloudant_url = str(cloudant_creds[url])

account = cloudantAccount(cloudant_username)

login = accountlogin(cloudant_username cloudant_password)

assert loginstatus_code == 200

db = accountdatabase(dbname)

response = dbput()

print responsejson

5 Save your changes by selecting File gt Save

e Add code to send the text message

Now comes the fun part Its time to code

Continue to work in the wsgipy file and create a new function around Line 89 that

sends a text message def sendTextWithMessage(message)

message = twilioClientmessagescreate(to=+15555555555 from_=+15555555555

body=message)

f Replace the to number with the cell phone number or Twilio number where you want

the text messages to be sent (dont forget the country code)

g Replace the from number with your Twilio phone number (dont forget the country

code)

h In the getCurrentPrice function inside of the if statement that checks if the

price is not None add the following line of code sendTextWithMessage(The current price of s is s (item[name] price))

i Save your changes by selecting File gt Save

Thats it Youve implemented your feature with only nine lines of code

3 Deploy and test the feature

Now its time to deploy your application to Bluemix so you can test it

a Click the Deploy button ( )

b If prompted if you want to stop and redeploy click OK

c After your application has finished deploying click the Open URL button ( ) in the top

gray bar

d In your app click Get Prices

15

e Check your phone or Twilio number for a text message

If you like update the prices of the items in the store and get the prices again

4 Push the feature to the repository

Now that your feature is tested its time to push your changes to the Git repository

a In the leftmost bar of icons click the Git Repository button ( )

b In the box in the Working Directory Changes section type a comment similar to the

following being sure to replace 20 with the work item ID associated with the work item

you created Changes to implement the text messaging feature as

described in work item 20

c Select each change in the Changed Files section and click the COMMIT button

d In the OUTGOING section click PUSH

e If you are prompted for your committer information enter it and click OK

5 Complete the feature

To indicate that you have finished your feature mark your work item as complete

a In the Web IDE click TRACK amp PLAN in the upper-right corner

b In the right pane find your work item associated with the text messaging feature and

click the Status In Progress icon

c Click Set Done

d In the right pane scroll right until you see the RESOLVED section Notice that your work

item is now marked done

6 Discover the traceability

When you added a comment in your commit that mentioned your work item a link was

automatically created for you between the change and the work item

a In the right pane scroll to the Resolved view if you are not currently viewing your

resolved work items

b Click the textual summary of the work item associated with the text messaging feature

to open it

c In the work item click the Links tab

d In the LINKS section notice that a link was automatically generated for you Click the

link The Git Log displays

e Observe that you have a summary of the git commit and its associated work items

f Click GIT LOG in the left navigation to see a list of all of your git commits

16

Tweet this

Collaborate with me on this Bluemix app I created [insert link to your app] [include a

screenshot of the Web IDE with your codemdashTweets with images are more likely to get noticed]

Get creative

Invite a friend to join your project Navigate to your projects home page click Members and

invite a friend to join

Create new work items for features yoursquod like to implement or defects you find

Implement some of the stories you created or fix the defects you recorded

Additional resources

Twilio SMS and MMS Python Quickstart httpswwwtwiliocomdocsquickstartpythonsms

Managing Distributed Teams

httpswwwscrumallianceorgcommunityarticles2013julymanaging-distributed-

teamsaspx

So Long Scrum Hello Kanban httpsstormpathcomblogso-long-scrum-hello-kanban

17

Part 1D Deploying Automatically Using the Delivery Pipeline

Learn this

Deployment automation is one of the keys to a successful DevOps approach

You can create a complete delivery pipeline with multiple stages automated tests and

automatic deploys using DevOps Services

Try this

You can configure a multi-stage build and deployment pipeline to support your DevOps approach to

software development In this section you will configure a builder a deployment to your

development (dev) space and a deployment to your production (prod) space

1 Create a production space

Organizations and spaces are organizational units in the Cloud Foundry infrastructure that can

be used to store and track application resources An organization contains domains spaces and

users a space contains applications and services By default a dev (development) space is

created for you

a Navigate to the Bluemix dashboard if you are not there already

b Click Create a Space in the left menu

c In the Create a Space dialog input prod as your space name and click CREATE

2 Create services for deployments to your dev space

When deploying to your dev and prod spaces you will likely want to have services dedicated to

those deployments For example you want to use separate databases for each space Wersquoll

begin by creating services for each space

a Navigate to the Bluemix dashboard if you are not there already

b Click CATALOG

c Create the Cloudant NoSQL DB service

i Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data

and Analytics section The catalog is constantly being updated with new

services

ii Click the Cloudant NoSQL DB service

iii In the Space dropdown choose dev

iv In the App dropdown choose Leave unbound

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 14: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

13

iv Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

v Click the Twilio service

vi In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

vii Click CREATE

viii When prompted restage your application now by clicking RESTAGE

ix Wait for the page to indicate that your app is running

d Add code that uses the Twilio service

Add code to your app that sends a text message whenever a price is retrieved for an

item Use the Twilio service to actually send the text message

i Add Twilio to requirementstxt

Your app needs the Twilio module so you must add it to the requirementstxt

file

1 In the Web IDE open requirementstxt

2 Add a new line to the end of the file and type twilio

3 Select File gt Save

ii Connect to the Twilio service

To effectively use your Twilio service you must connect to it

1 In the Web IDE open the wsgipy file

2 In the Imports section around Line 55 add the following line from twiliorest import TwilioRestClient

3 As part of the for loop that begins around Line 65 add the following

lines

Note Be sure your spacing before these two lines (spaces and tabs) is

identical to the if statement that checks if the key starts with

ldquocloudantrdquo

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

4 Your Twilio credentials are now stored in twilio_creds Your code

should now look like the following listing

14

for key value in decoded_configiteritems()

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

if keystartswith(cloudant)

cloudant_creds = decoded_config[key][0][credentials]

cloudant_host = cloudant_creds[host]

cloudant_port = int(cloudant_creds[port])

cloudant_username = cloudant_creds[username]

cloudant_password = cloudant_creds[password]

cloudant_url = str(cloudant_creds[url])

account = cloudantAccount(cloudant_username)

login = accountlogin(cloudant_username cloudant_password)

assert loginstatus_code == 200

db = accountdatabase(dbname)

response = dbput()

print responsejson

5 Save your changes by selecting File gt Save

e Add code to send the text message

Now comes the fun part Its time to code

Continue to work in the wsgipy file and create a new function around Line 89 that

sends a text message def sendTextWithMessage(message)

message = twilioClientmessagescreate(to=+15555555555 from_=+15555555555

body=message)

f Replace the to number with the cell phone number or Twilio number where you want

the text messages to be sent (dont forget the country code)

g Replace the from number with your Twilio phone number (dont forget the country

code)

h In the getCurrentPrice function inside of the if statement that checks if the

price is not None add the following line of code sendTextWithMessage(The current price of s is s (item[name] price))

i Save your changes by selecting File gt Save

Thats it Youve implemented your feature with only nine lines of code

3 Deploy and test the feature

Now its time to deploy your application to Bluemix so you can test it

a Click the Deploy button ( )

b If prompted if you want to stop and redeploy click OK

c After your application has finished deploying click the Open URL button ( ) in the top

gray bar

d In your app click Get Prices

15

e Check your phone or Twilio number for a text message

If you like update the prices of the items in the store and get the prices again

4 Push the feature to the repository

Now that your feature is tested its time to push your changes to the Git repository

a In the leftmost bar of icons click the Git Repository button ( )

b In the box in the Working Directory Changes section type a comment similar to the

following being sure to replace 20 with the work item ID associated with the work item

you created Changes to implement the text messaging feature as

described in work item 20

c Select each change in the Changed Files section and click the COMMIT button

d In the OUTGOING section click PUSH

e If you are prompted for your committer information enter it and click OK

5 Complete the feature

To indicate that you have finished your feature mark your work item as complete

a In the Web IDE click TRACK amp PLAN in the upper-right corner

b In the right pane find your work item associated with the text messaging feature and

click the Status In Progress icon

c Click Set Done

d In the right pane scroll right until you see the RESOLVED section Notice that your work

item is now marked done

6 Discover the traceability

When you added a comment in your commit that mentioned your work item a link was

automatically created for you between the change and the work item

a In the right pane scroll to the Resolved view if you are not currently viewing your

resolved work items

b Click the textual summary of the work item associated with the text messaging feature

to open it

c In the work item click the Links tab

d In the LINKS section notice that a link was automatically generated for you Click the

link The Git Log displays

e Observe that you have a summary of the git commit and its associated work items

f Click GIT LOG in the left navigation to see a list of all of your git commits

16

Tweet this

Collaborate with me on this Bluemix app I created [insert link to your app] [include a

screenshot of the Web IDE with your codemdashTweets with images are more likely to get noticed]

Get creative

Invite a friend to join your project Navigate to your projects home page click Members and

invite a friend to join

Create new work items for features yoursquod like to implement or defects you find

Implement some of the stories you created or fix the defects you recorded

Additional resources

Twilio SMS and MMS Python Quickstart httpswwwtwiliocomdocsquickstartpythonsms

Managing Distributed Teams

httpswwwscrumallianceorgcommunityarticles2013julymanaging-distributed-

teamsaspx

So Long Scrum Hello Kanban httpsstormpathcomblogso-long-scrum-hello-kanban

17

Part 1D Deploying Automatically Using the Delivery Pipeline

Learn this

Deployment automation is one of the keys to a successful DevOps approach

You can create a complete delivery pipeline with multiple stages automated tests and

automatic deploys using DevOps Services

Try this

You can configure a multi-stage build and deployment pipeline to support your DevOps approach to

software development In this section you will configure a builder a deployment to your

development (dev) space and a deployment to your production (prod) space

1 Create a production space

Organizations and spaces are organizational units in the Cloud Foundry infrastructure that can

be used to store and track application resources An organization contains domains spaces and

users a space contains applications and services By default a dev (development) space is

created for you

a Navigate to the Bluemix dashboard if you are not there already

b Click Create a Space in the left menu

c In the Create a Space dialog input prod as your space name and click CREATE

2 Create services for deployments to your dev space

When deploying to your dev and prod spaces you will likely want to have services dedicated to

those deployments For example you want to use separate databases for each space Wersquoll

begin by creating services for each space

a Navigate to the Bluemix dashboard if you are not there already

b Click CATALOG

c Create the Cloudant NoSQL DB service

i Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data

and Analytics section The catalog is constantly being updated with new

services

ii Click the Cloudant NoSQL DB service

iii In the Space dropdown choose dev

iv In the App dropdown choose Leave unbound

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 15: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

14

for key value in decoded_configiteritems()

if decoded_config[key][0][name]startswith(Twilio)

twilio_creds = decoded_config[key][0][credentials]

twilio_authToken = twilio_creds[authToken]

twilio_accountSID = twilio_creds[accountSID]

twilioClient = TwilioRestClient(twilio_accountSID twilio_authToken)

if keystartswith(cloudant)

cloudant_creds = decoded_config[key][0][credentials]

cloudant_host = cloudant_creds[host]

cloudant_port = int(cloudant_creds[port])

cloudant_username = cloudant_creds[username]

cloudant_password = cloudant_creds[password]

cloudant_url = str(cloudant_creds[url])

account = cloudantAccount(cloudant_username)

login = accountlogin(cloudant_username cloudant_password)

assert loginstatus_code == 200

db = accountdatabase(dbname)

response = dbput()

print responsejson

5 Save your changes by selecting File gt Save

e Add code to send the text message

Now comes the fun part Its time to code

Continue to work in the wsgipy file and create a new function around Line 89 that

sends a text message def sendTextWithMessage(message)

message = twilioClientmessagescreate(to=+15555555555 from_=+15555555555

body=message)

f Replace the to number with the cell phone number or Twilio number where you want

the text messages to be sent (dont forget the country code)

g Replace the from number with your Twilio phone number (dont forget the country

code)

h In the getCurrentPrice function inside of the if statement that checks if the

price is not None add the following line of code sendTextWithMessage(The current price of s is s (item[name] price))

i Save your changes by selecting File gt Save

Thats it Youve implemented your feature with only nine lines of code

3 Deploy and test the feature

Now its time to deploy your application to Bluemix so you can test it

a Click the Deploy button ( )

b If prompted if you want to stop and redeploy click OK

c After your application has finished deploying click the Open URL button ( ) in the top

gray bar

d In your app click Get Prices

15

e Check your phone or Twilio number for a text message

If you like update the prices of the items in the store and get the prices again

4 Push the feature to the repository

Now that your feature is tested its time to push your changes to the Git repository

a In the leftmost bar of icons click the Git Repository button ( )

b In the box in the Working Directory Changes section type a comment similar to the

following being sure to replace 20 with the work item ID associated with the work item

you created Changes to implement the text messaging feature as

described in work item 20

c Select each change in the Changed Files section and click the COMMIT button

d In the OUTGOING section click PUSH

e If you are prompted for your committer information enter it and click OK

5 Complete the feature

To indicate that you have finished your feature mark your work item as complete

a In the Web IDE click TRACK amp PLAN in the upper-right corner

b In the right pane find your work item associated with the text messaging feature and

click the Status In Progress icon

c Click Set Done

d In the right pane scroll right until you see the RESOLVED section Notice that your work

item is now marked done

6 Discover the traceability

When you added a comment in your commit that mentioned your work item a link was

automatically created for you between the change and the work item

a In the right pane scroll to the Resolved view if you are not currently viewing your

resolved work items

b Click the textual summary of the work item associated with the text messaging feature

to open it

c In the work item click the Links tab

d In the LINKS section notice that a link was automatically generated for you Click the

link The Git Log displays

e Observe that you have a summary of the git commit and its associated work items

f Click GIT LOG in the left navigation to see a list of all of your git commits

16

Tweet this

Collaborate with me on this Bluemix app I created [insert link to your app] [include a

screenshot of the Web IDE with your codemdashTweets with images are more likely to get noticed]

Get creative

Invite a friend to join your project Navigate to your projects home page click Members and

invite a friend to join

Create new work items for features yoursquod like to implement or defects you find

Implement some of the stories you created or fix the defects you recorded

Additional resources

Twilio SMS and MMS Python Quickstart httpswwwtwiliocomdocsquickstartpythonsms

Managing Distributed Teams

httpswwwscrumallianceorgcommunityarticles2013julymanaging-distributed-

teamsaspx

So Long Scrum Hello Kanban httpsstormpathcomblogso-long-scrum-hello-kanban

17

Part 1D Deploying Automatically Using the Delivery Pipeline

Learn this

Deployment automation is one of the keys to a successful DevOps approach

You can create a complete delivery pipeline with multiple stages automated tests and

automatic deploys using DevOps Services

Try this

You can configure a multi-stage build and deployment pipeline to support your DevOps approach to

software development In this section you will configure a builder a deployment to your

development (dev) space and a deployment to your production (prod) space

1 Create a production space

Organizations and spaces are organizational units in the Cloud Foundry infrastructure that can

be used to store and track application resources An organization contains domains spaces and

users a space contains applications and services By default a dev (development) space is

created for you

a Navigate to the Bluemix dashboard if you are not there already

b Click Create a Space in the left menu

c In the Create a Space dialog input prod as your space name and click CREATE

2 Create services for deployments to your dev space

When deploying to your dev and prod spaces you will likely want to have services dedicated to

those deployments For example you want to use separate databases for each space Wersquoll

begin by creating services for each space

a Navigate to the Bluemix dashboard if you are not there already

b Click CATALOG

c Create the Cloudant NoSQL DB service

i Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data

and Analytics section The catalog is constantly being updated with new

services

ii Click the Cloudant NoSQL DB service

iii In the Space dropdown choose dev

iv In the App dropdown choose Leave unbound

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 16: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

15

e Check your phone or Twilio number for a text message

If you like update the prices of the items in the store and get the prices again

4 Push the feature to the repository

Now that your feature is tested its time to push your changes to the Git repository

a In the leftmost bar of icons click the Git Repository button ( )

b In the box in the Working Directory Changes section type a comment similar to the

following being sure to replace 20 with the work item ID associated with the work item

you created Changes to implement the text messaging feature as

described in work item 20

c Select each change in the Changed Files section and click the COMMIT button

d In the OUTGOING section click PUSH

e If you are prompted for your committer information enter it and click OK

5 Complete the feature

To indicate that you have finished your feature mark your work item as complete

a In the Web IDE click TRACK amp PLAN in the upper-right corner

b In the right pane find your work item associated with the text messaging feature and

click the Status In Progress icon

c Click Set Done

d In the right pane scroll right until you see the RESOLVED section Notice that your work

item is now marked done

6 Discover the traceability

When you added a comment in your commit that mentioned your work item a link was

automatically created for you between the change and the work item

a In the right pane scroll to the Resolved view if you are not currently viewing your

resolved work items

b Click the textual summary of the work item associated with the text messaging feature

to open it

c In the work item click the Links tab

d In the LINKS section notice that a link was automatically generated for you Click the

link The Git Log displays

e Observe that you have a summary of the git commit and its associated work items

f Click GIT LOG in the left navigation to see a list of all of your git commits

16

Tweet this

Collaborate with me on this Bluemix app I created [insert link to your app] [include a

screenshot of the Web IDE with your codemdashTweets with images are more likely to get noticed]

Get creative

Invite a friend to join your project Navigate to your projects home page click Members and

invite a friend to join

Create new work items for features yoursquod like to implement or defects you find

Implement some of the stories you created or fix the defects you recorded

Additional resources

Twilio SMS and MMS Python Quickstart httpswwwtwiliocomdocsquickstartpythonsms

Managing Distributed Teams

httpswwwscrumallianceorgcommunityarticles2013julymanaging-distributed-

teamsaspx

So Long Scrum Hello Kanban httpsstormpathcomblogso-long-scrum-hello-kanban

17

Part 1D Deploying Automatically Using the Delivery Pipeline

Learn this

Deployment automation is one of the keys to a successful DevOps approach

You can create a complete delivery pipeline with multiple stages automated tests and

automatic deploys using DevOps Services

Try this

You can configure a multi-stage build and deployment pipeline to support your DevOps approach to

software development In this section you will configure a builder a deployment to your

development (dev) space and a deployment to your production (prod) space

1 Create a production space

Organizations and spaces are organizational units in the Cloud Foundry infrastructure that can

be used to store and track application resources An organization contains domains spaces and

users a space contains applications and services By default a dev (development) space is

created for you

a Navigate to the Bluemix dashboard if you are not there already

b Click Create a Space in the left menu

c In the Create a Space dialog input prod as your space name and click CREATE

2 Create services for deployments to your dev space

When deploying to your dev and prod spaces you will likely want to have services dedicated to

those deployments For example you want to use separate databases for each space Wersquoll

begin by creating services for each space

a Navigate to the Bluemix dashboard if you are not there already

b Click CATALOG

c Create the Cloudant NoSQL DB service

i Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data

and Analytics section The catalog is constantly being updated with new

services

ii Click the Cloudant NoSQL DB service

iii In the Space dropdown choose dev

iv In the App dropdown choose Leave unbound

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 17: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

16

Tweet this

Collaborate with me on this Bluemix app I created [insert link to your app] [include a

screenshot of the Web IDE with your codemdashTweets with images are more likely to get noticed]

Get creative

Invite a friend to join your project Navigate to your projects home page click Members and

invite a friend to join

Create new work items for features yoursquod like to implement or defects you find

Implement some of the stories you created or fix the defects you recorded

Additional resources

Twilio SMS and MMS Python Quickstart httpswwwtwiliocomdocsquickstartpythonsms

Managing Distributed Teams

httpswwwscrumallianceorgcommunityarticles2013julymanaging-distributed-

teamsaspx

So Long Scrum Hello Kanban httpsstormpathcomblogso-long-scrum-hello-kanban

17

Part 1D Deploying Automatically Using the Delivery Pipeline

Learn this

Deployment automation is one of the keys to a successful DevOps approach

You can create a complete delivery pipeline with multiple stages automated tests and

automatic deploys using DevOps Services

Try this

You can configure a multi-stage build and deployment pipeline to support your DevOps approach to

software development In this section you will configure a builder a deployment to your

development (dev) space and a deployment to your production (prod) space

1 Create a production space

Organizations and spaces are organizational units in the Cloud Foundry infrastructure that can

be used to store and track application resources An organization contains domains spaces and

users a space contains applications and services By default a dev (development) space is

created for you

a Navigate to the Bluemix dashboard if you are not there already

b Click Create a Space in the left menu

c In the Create a Space dialog input prod as your space name and click CREATE

2 Create services for deployments to your dev space

When deploying to your dev and prod spaces you will likely want to have services dedicated to

those deployments For example you want to use separate databases for each space Wersquoll

begin by creating services for each space

a Navigate to the Bluemix dashboard if you are not there already

b Click CATALOG

c Create the Cloudant NoSQL DB service

i Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data

and Analytics section The catalog is constantly being updated with new

services

ii Click the Cloudant NoSQL DB service

iii In the Space dropdown choose dev

iv In the App dropdown choose Leave unbound

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 18: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

17

Part 1D Deploying Automatically Using the Delivery Pipeline

Learn this

Deployment automation is one of the keys to a successful DevOps approach

You can create a complete delivery pipeline with multiple stages automated tests and

automatic deploys using DevOps Services

Try this

You can configure a multi-stage build and deployment pipeline to support your DevOps approach to

software development In this section you will configure a builder a deployment to your

development (dev) space and a deployment to your production (prod) space

1 Create a production space

Organizations and spaces are organizational units in the Cloud Foundry infrastructure that can

be used to store and track application resources An organization contains domains spaces and

users a space contains applications and services By default a dev (development) space is

created for you

a Navigate to the Bluemix dashboard if you are not there already

b Click Create a Space in the left menu

c In the Create a Space dialog input prod as your space name and click CREATE

2 Create services for deployments to your dev space

When deploying to your dev and prod spaces you will likely want to have services dedicated to

those deployments For example you want to use separate databases for each space Wersquoll

begin by creating services for each space

a Navigate to the Bluemix dashboard if you are not there already

b Click CATALOG

c Create the Cloudant NoSQL DB service

i Scroll down until you see the Cloudant NoSQL DB service Hint Check the Data

and Analytics section The catalog is constantly being updated with new

services

ii Click the Cloudant NoSQL DB service

iii In the Space dropdown choose dev

iv In the App dropdown choose Leave unbound

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 19: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

18

v In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquocloudantrdquo as that is how

the code identifies the service

vi Note the name of your service as you will need it later

vii Click CREATE

d Create the Twilio service

i Navigate to the Catalog if you are not there already

ii Scroll down until you see the Twilio service Hint Check the Mobile section The

catalog is constantly being updated with new services

iii Click the Twilio service

iv In the Space dropdown choose dev

v In the App dropdown choose Leave unbound

vi In the Service name box leave the default or change the name to something

you like Be sure the name you choose begins with ldquotwiliordquo as that is how the

code identifies the service Note the name you choose as you will need it later

vii In the Account SID and Auth Token fields paste your Twilio AccountSID and

AuthToken from your Twilio Account Settings page

viii Click CREATE

3 Create services for deployments to your prod space

Repeat the steps from 2 above to create Cloudant NoSQL DB and Twilio services for

deployments to your prod space Be sure to select ldquoprodrdquo as the Space instead of ldquodevrdquo

4 Enable Advanced Build amp Deploy

You can configure a multi-stage build and deployment pipeline to support your DevOps

approach to software development Note that the pipeline only includes changes that have

been pushed to your projectrsquos repository changes that are in your workspace in the Web IDE

that have not been pushed to your projectrsquos repository will NOT be deployed as part of the

pipeline

a Open the Fabulous Price Finder project you created in the previous section by

navigating to DevOps Services signing in if youre not already authenticated and

clicking on your project on the My Projects page

b Click BUILD amp DEPLOY in the upper-right corner

5 Add a builder stage

The first stage we will create is a builder stage

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 20: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

19

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Build Stage

c Notice that the Input Type is set to SCM Repository by default This means the input for

the stage will be your git repository

d Notice that Run jobs whenever a change is pushed to Git is selected by default This

means that whenever you or someone on your team pushes code to your projectrsquos

repository the build stage will automatically be triggered

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Build

g Since this app does not require compilation (unlike a Java app) we will use the Simple

builder type Note that you can choose from a variety of builders

h Notice that the Stop running this stage if this job fails is checked by default This means

that any jobs further down the pipeline will not execute and the whole stage will be

marked as failed if a failure occurs

i Click SAVE

6 Add a ldquodeploy to development spacerdquo stage

Now we will add a deployment to the space that represents your development space Some

might call this a quality assurance or test space It is a place where developers can test their

code live in a production quality environment without actually putting it in production

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Dev Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the previous stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default This

will configure your pipeline so that whenever someone pushes code to your projectrsquos

repository the build step will run and if it succeeds a deploy to the development

environment will be kicked off

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Application Name to be a name that is unique to your Bluemix dev space

h By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 21: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

20

developers on your team will be able to test their code In the Script section after cf push ldquo$CF_APPrdquo

add -n whateverYouWantYourUrlToBe Note the url needs to be unique across

all Bluemix apps so be creative

i Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

j Next add a command to restage your app with the newly bound services cf restage $CF_APP

k The script section should now look similar to the following cf push $CF_APP -n fbf-lauren-dev

cf bind-service $CF_APP Cloudant-dev

cf bind-service $CF_APP Twilio-dev

cf restage $CF_APP

l Note that if we had automated tests associated with this project we could add a test

job to this stage so that the deploy would run and then tests could be executed against

that deployment

m Click SAVE

7 Add a deploy to production space stage

Now we will add a deployment to the space that represents your production space This space

is where you keep apps that your end users will use

a Click ADD STAGE

b Click MyStage at the top of the stage configuration box and name your stage by typing

Prod Deployment

c Notice that the Input Type is set to Build Artifacts This means that the build artifacts

created in the Build Stage will be the input to this stage

d Notice that Run jobs when the previous stage is completed is selected by default Since

we donrsquot have any automated tests included in this pipeline automatically deploying to

production is probably not safe Select Run jobs only when this stage is run manually

e Click JOBS to open the Jobs section of the stage configuration

f Click ADD JOB and select Deploy

g Update the Space to be prod

h Update the Application Name to be a name that is unique to your Bluemix prod space

i By default the deployer will use the instructions in the manifest Rather than deploying

to a url with a random string of characters we want this to be a consistent place where

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 22: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

21

your end users will be able to access your app In the Script section after cf push ldquo$CF_APPrdquo

add -n whateveryouwantyoururltobe Note the url needs to be unique across

all Bluemix apps so be creative

j Under the cf push command add two lines that bind the services in your dev space

to the app The command should be the following cf bind-service $CF_APP nameOfYourCloudantService cf bind-service $CF_APP nameOfYourTwilioService

k Next add a command to restage your app with the newly bound services cf restage $CF_APP

l The script section should now look similar to the following cf push $CF_APP -n fbf-lauren

cf bind-service $CF_APP Cloudant-prod

cf bind-service $CF_APP Twilio-prod

cf restage $CF_APP

m Click SAVE

8 Kick off the pipeline

Now that we have the build pipeline configured itrsquos time to try it out To trigger the pipeline

we could make a change to our projectrsquos code and push the change to our Git repository or we

could manually request a build

a On the Pipeline page click the Play button ( ) in the Build Stage to kick off the first

stage of the pipeline manually

The build pipeline will go through the build and deploy to dev steps If you like what was

deployed to dev you can drag and drop the build from the Build Stage tile to the Prod

Deployment tile to deploy it there

Tweet this

Dove into DevOps by creating a release pipeline for my app [attach a screenshot of the Build amp

Deploy page for your app] Bluemix DevOpsServices

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 23: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

22

Get creative

Make a change to your code and watch the build pipeline automatically deploy it for you

Zero downtime deployments are very important to web applications Design and implement a

strategy to deploy your app to your production space without any downtime Hint check out

this article httpwwwibmcomdeveloperworkscloudlibrarycl-Bluemix-rollingpipeline

Additional resources

DevOps for Dummies ebook httpibmcodevopsfordummies

Top 10 Practices for Effective DevOps httpwwwdrdobbscomarchitecture-and-designtop-

10-practices-for-effective-devops240149363

Cloud Computing Trends 2014 State of the Cloud Survey

httpwwwrightscalecomblogcloud-industry-insightscloud-computing-trends-2014-state-

cloud-survey

DevOps Embracing Cloud Services httpwwwmidsizeinsidercomen-usarticledevops-

embracing-cloud-servicesVJmrScABg

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 24: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

23

Part 2A Live Edit In this part yoursquoll get to use an exciting new feature Live Edit The Live Edit feature allows you to make

changes to your application and have them deployed nearly instantaneously to your deployed app Itrsquos just like

editing files locallyhellipexcept you donrsquot have to set up a development environment

Since the Live Edit feature is currently optimized for Nodejs we will create a new app using the Personality

Insights Nodejs Web Starter boilerplate (what a concise name) The exciting thing about this boilerplate is that

it uses IBM Watson (remember Watson the supercomputer that beat Jeopardy champions a few years ago)

services

In this part you will create a new Bluemix app and leverage the Live Edit feature to see the changes you make

be deployed almost instantly to your running app

Learn this

Live Edit allows you to see changes you make in the DevOps Services Web IDE reflected in real-

time to your app deployed on Bluemix Itrsquos just like editing files locallyhellipexcept you donrsquot have

to set up a development environment

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app Changes you make in Node modules (like JavaScript files)

will require a fast restart of the app in order to be reflected in your deployed app

Try this

1 Sign up for DevOps Services if you have not done so already

a Navigate to httpibmbizcds-bluemix and sign up

b As part of the Bluemix registration process you will receive an e-mail asking you to

confirm your account If you do not confirm you are not registered If you do not

receive a confirmation e-mail send a note to idbluemixnet

c Navigate to httpibmbizcds-ids and register for DevOps Services using the same IBM

id you used for Bluemix

2 Create a Nodejs app using a Bluemix boilerplate

The first thing we need is a Nodejs app One of the fastest ways to get a new app is to use a

Bluemix boilerplate

a Navigate to httpibmbizcds-bluemix

b Log in if you are not already authenticated

c Click CATALOG The Catalog is your place to browse the available boilerplates (sample

applications) runtimes and services

d In the Boilerplates section click Personality Insights Nodejs Web Starter

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 25: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

24

e Input a name for the app (what the app will be referred to in Bluemix) and a host for the

app (the part of the url that will go before mybluemixnet) Note that the host must be

globally unique across all of Bluemix so be creative

f Click CREATE A copy of the boilerplate code will be put in to a new app for you and

then deployed to Bluemix

g Click Overview In the APP HEALTH section wait for the message ldquoYour app is

runningrdquo to be displayed

h When your app is running click on your route (toward the top of the page) to open your

running app

3 Explore the Nodejs app

Now that your app is running letrsquos take a moment to explore it The Personality Insights app

uses the Watson Personality Insights service to analyze text and determine personality traits of

the textrsquos author

a The app includes sample text from Moby Dick Click ANALYZE to learn about the

personality of Moby Dickrsquos author Herman Melville Textual output as well as a

graphical visualization are displayed

b Navigate to one of your favorite websites with English text (keep it office-friendlyhellipso

perhaps choose your favorite news site) and copy a block of text

c Return to your Personality Insights App and paste the text in the Try the Service box

d Click ANALYZE View the textual output as well as the graphical visualization

4 Prepare for Live Edit

Wersquove tested the app and now wersquoll prep to make some changes to it

a Return to the Bluemix page for your Personality Insights app If your app is not in a

separate window or tab right-click on your apprsquos route and choose an option to open

the link in a new window or tab

b Click ADD GIT in the upper-right corner

c Click CONTINUE in the Create Git Repository dialog Bluemix will take a copy of your

apprsquos code and put it in a Git repository hosted at DevOps Services

d Click CLOSE once the Git Repository has been successfully created

e Click EDIT CODE in the upper-right corner to open the DevOps Services Web IDE

f Toggle the Live Edit option to on

g If prompted to redeploy click OK The app will redeploy so changes can be made live to

your deployed app When the app finishes deploying a green dot will be displayed in

the run bar

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 26: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

25

When the app finishes deploying you are ready to make live edits

5 Change a static file

Changes you make to static files (for example Jade or CSS files) will be reflected almost

instantaneously in your deployed app

a In the navigator view on the left expand views

b Select layoutjade

c Update the h2 to say something like ldquoThis open lab is so great that Irsquom going to Tweet

about itrdquo

d Switch to your tab or window that has your running app

e Refresh the page

f Note that the heading of your app was changed instantly You didnrsquot have to wait for

the app to redeploy

g Make a few more changes to static files and watch your app update in real time

6 Change a node module

Changes to node modules require a fast app restart (not a full redeploy) in order to be deployed

because the server caches node modules in memory

a Select the root directory of your app in the navigator in the left pane

b Click File gt New gt File

c The name of the file is highlighted so you can rename it Type defaulttexttxt and press

Enter or Return on your keyboard

d In the editor on the right type or paste the text that you want to use as the default text

in the app

e Select the appjs file in the navigator in the left pane

f In the editor on the right look for the dummy_text variable around line 25 Replace

mobydicktxt with defaulttexttxt

g In the web IDEs top bar click the Restart button ( )

h When the app finishes restarting (which only takes a few seconds) a green dot is

displayed in the run bar

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 27: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

26

i Switch to the tab or window that has your running app Refresh the page to see the new

text (If your browser cached the page and you dont see the text update browse to

your apps URL again and the change should be displayed)

Tweet this

Developing in the cloud using Bluemix DevOpsServices is now as fast and easy as developing

locally WhoKnew

Get creative

Create a new look for the Personality Insights app Open the CSS files located in the publiccss

directory and have fun making changes to the files Watch as your changes are deployed live

Additional resources

Everything AND the kitchen sync Bluemix Live Sync is here httpsdeveloperibmcomdevops-

services20150213everything-kitchen-sync-Bluemix-live-sync

Bluemix Live Sync documentation

httpswwwngbluemixnetdocscm_mmc=developerWorks-_-dWdevcenter-_-devops-

services-_-lpmanageappsbluemixlivehtmlbluemixlive

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 28: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

27

Part 2B Bluemix Debug Sometimes staring at the code to figure out whatrsquos going wrong just doesnrsquot work Sometimes you really need

to debug the code or access the environment where the app is running This is where Bluemix Debug comes in

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for your Nodejs

apps

In this part yoursquoll continue on with the Personality Insights Nodejs app you created in part 2A

Learn this

Bluemix Debug allows you to restart get shell access and use the Node Inspector Debugger for

your Nodejs apps

Try this Note The Node Inspector Debugger currently only works in Chrome You may want to take this

opportunity to change browsers if you are not already using Chrome

1 Open the IBM Bluemix Debugger

a Navigate to httpibmbizcds-ids and sign in if you are not already authenticated

b In My Projects locate the tile for your Personality Insights app Click the Edit Code icon

( ) to open the Web IDE for your project

c In the Web IDErsquos top bar click the Debug button ( )

d When prompted for credentials input your IBM id and password

2 Use the shell

The Bluemix Shell allows you to explore and interact with the Bluemix environment where your

app is running by using a built-in bash shell

a On the IBM Bluemix Debugger page for your project click Open Shell A shell client

opens in your browser

b View the processes running in your Bluemix environment by inputting the following

command top

c Click NEW WINDOW

d Drag and drop the new window so that you can continue to observe your processes

while you explore the log files

e In the new window change directory to the log files by inputting the following

command cd logs

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 29: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

28

f View a list of the files in the logs directory by inputting the following command ls

g Notice that staging_tasklog is a file in your logs directory View the last 10 lines of the

log file by inputting the following command tail staging_tasklog

3 Use the Debugger

The Debugger allows you to debug Nodejs apps

a On the IBM Bluemix Debugger page for your project click Open Debugger The

Debugger takes about 30 seconds to load

b If the Navigator is not displayed on the left click the Expand Navigator button

c Select appjs in the Navigator to open the file

d Add a breakpoint on line 48 by clicking 48

e In a different tab or window navigate to your running app

f Click Analyze

g Switch back to the tab or window with your Debugger Notice that the breakpoint has

been hit On the right you can view the Call Stack and Variables You can also use

buttons on the right to step over the next function call step into the next function call

and step out of the next function call

h When you have finished exploring your running app click the Resume script execution

button ( ) on the right

Note that from the IBM Bluemix Debugger page you can choose to suspend the app which will

restart the app and break at the first line of the app

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp

Page 30: Intro to IBM Bluemix DevOps Services, a Workshop with a Cloudant twist

29

Tweet this

Bluemix + DevOpsServices + Shell = a happy developer NoDownloadsRequired [include a

screenshot of the shell in your browser]

Just debugged my Bluemix app by using the debugger in DevOpsServices

NoDownloadsRequired [take a selfie of you in front of your debugger looking very excited]

Get creative

Use some of your favorite commands to explore the Bluemix environment where your app runs

Additional resources

Bluemix Live Sync

httpswwwngBluemixnetdocsmanageappsBluemixlivehtmlBluemixlivedebugger

Learning the Shell httplinuxcommandorglc3_learning_the_shellphp