<commit_before>---
layout: markdown_page
title: "Vision Demo: Idea to Production"
---

This demonstration is designed to highlight GitLab’s open set of tools for the software development lifecycle, from idea to production, through chat, issues, planning, merge request, CI, and CD.

![](handbook/sales/lifecycle.png)

We're going to start from scratch, creating a brand new GitLab installation.

![](handbook/sales/steps.png)

<iframe width="640" height="389" src="https://www.youtube.com/embed/t_rB1oQdG98" frameborder="0" allowfullscreen></iframe>

----

## Prerequisites
{:.no_toc}

- Working OpenShift setup

## Links
{:.no_toc}

- [Original Slideware](https://docs.google.com/presentation/d/1D_L7s5xqDLw82B-drpM0av1-1m92f_ibIWruTmar-IQ/edit)
- [Meta Issue](https://gitlab.com/gitlab-org/gitlab-ce/issues/19793)

## Vision Demo: Idea to Production
{:.no_toc}

**Main items**

- TOC
{:toc}

## Pre-demo Setup

> * Login to OpenShift
>   * URL: [https://openshift.tanukionline.com:8443/console/](https://openshift.tanukionline.com:8443/console/)
>   * Username: gitlab-user
>   * Password: <<PASSWORD>>
> * Delete all Openshift projects using OpenShift web interface
> * [Reset cookie](chrome://settings/cookies) that [blocks issue board default list prompt](https://www.dropbox.com/s/knwdvnkuholo2xd/Screenshot%202016-10-14%2011.11.39.png?dl=0)
> * Disable desktop notifications (on a Mac, top-right corner, option click)
> * Open up new browser window so the audience doesn’t see all your other open tabs.
> * Open [flowchart](https://gitlab-org.gitlab.io/gitlab-design/progress/dimitrie/flowchartideatoprod/flowchart-html-previews/) as opening window during intro
> * Consider just sharing web browser window so the audience isn’t distracted by notes or other windows.
> * [Zoom content on the screen](https://support.apple.com/kb/ph11488?locale=en_US)

## Intro

Today I'd like to demo some of the power of GitLab’s open set of tools
for the software development lifecycle, helping you get from idea to production
as quickly as possible. We plan to ship all this functionality in GitLab 8.14.

## Install GitLab itself

The first step is to install GitLab itself. Today I'm going to use RedHat's Openshift, which is a Kubernetes platform that you can host yourself or use as a SaaS. We’re going to install everything from scratch and we’ll start by opening the Openshift web UI. Here we’ll create a new project named `gitlab`.

> * Open Openshift web UI and log in to [Openshift Origin](https://openshift.tanukionline.com:8443).
> * Click New Project
> Name it `gitlab`
> Create it

And then we import an OpenShift template for a complete GitLab installation. We have to set a couple hostnames.

> * Click on Import YAML/JSON
> * Open in a browser: [YAML template in Omnibus repo](https://gitlab.com/gitlab-org/omnibus-gitlab/raw/openshift-idea-to-production/docker/openshift/idea-2-prod-template.json) which is also linked from [our installation page](https://about.gitlab.com/installation/).
> * Copy content of idea-2-prod-template.json
> * Click Create, leave `Process the template` selected, click Continue
>   * GitLab instance hostname to `gitlab.tanukionline.com`
>   * Mattermost instance hostname to `mattermost.tanukionline.com`
> * Press button
> * Continue to overview

Boom, we’ve got a shiny new GitLab installation with several containers. They are running the GitLab Rails app, Mattermost for Chat, Postgres, Redis, and GitLab Runner for CI and CD. This is everything you need for the application development lifecycle on Kubernetes. It will take a few minutes for GitLab Rails to configure itself so it’s a good time to describe what we’re covering today.

> * Open up [Flowchart](https://gitlab-org.gitlab.io/gitlab-design/progress/dimitrie/flowchartideatoprod/flowchart-html-previews/)

In the rest of the demo, I’ll take you through everything you need to have to take ideas to production, including chat with Mattermost, issues and issue tracking, planning with issue boards, coding with terminal access, committing with git version control and merge requests for code review, testing with continuous integration, getting peer reviews with live review apps, continuous deployment to staging, and closing the loop by deploying to production directly from chat, and lastly cycle analytics to measure how fast you’re going from idea to production. With GitLab, everything is integrated out of the box.

*TODO: Make above content match what is on flowchart so you can read it from there.*

*TODO: Talk about Cycle analytics*

> * Wait for gitlab pod to go from light blue to full blue
> Click the [GitLab link](http://gitlab.tanukionline.com)

## Setup a user and project

Now that we've got GitLab running, let's set up an account.

> * Change password for root user
> * Login

We now create a group for our company; let’s name it `tanuki`.

> * Create a group called `tanuki` and make it public

Then let’s now create a new project to start off with. Let's call it `www` and make it public.

> * Create a project called `www` under the `tanuki` group and make it public

### Configure a project

Great, we have a new project, now let’s create a the first file. We’ll use the built-in GitLab editor to add it.

> * Click add readme (changing that to + in [#23310](https://gitlab.com/gitlab-org/gitlab-ce/issues/23310))
> * Name the file `index.html`
> * Type `Hello World` as the contents
> * Click Submit

Of course this is just a static file and not an application yet, but since we’re using OpenShift it’s really easy to use Docker. GitLab offers a set of `Dockerfile` templates that we can use. Let’s add a new Dockerfile and choose the template for Apache’s httpd server.

> * Click back to the files tab
> * Add a file + icon, New file
> * Filename to `Dockerfile`
> * template HTTPd
> * Commit changes on master

### Prepare OpenShift

*TODO: Simplify this with [Smart Deployments](https://gitlab.com/gitlab-org/gitlab-ce/issues/22864#note_16790373) or in the short term with [use the internal routing name for kubernetes in the openshift CI template for i2p demo](https://gitlab.com/gitlab-org/gitlab-ce/issues/23445) and [having trouble auto-discovering subdomain in OpenShift for idea to production demo
](https://gitlab.com/gitlab-org/gitlab-ce/issues/23446).*

The next step is to configure CI, but first we have to set up some project variables that CI needs in order to create deployments in our OpenShift environment. We can find our Access Token in Openshift.

> * Go to [Openshift](https://openshift.tanukionline.com:8443/console/command-line) or `Help > Command Line Tools > .. click to show token…`
> * Copy token

We will now copy this token and go back to GitLab where we will use this token as a environmental variable which will be automatically passed to our CI/CD pipeline jobs.

> * Go to GitLab
> * Settings > Variables
> * Key: OPENSHIFT_TOKEN
> * Value: paste token
> * Add new variable

We also need to set our server and our domain.

> * Repeat for:
>   * OPENSHIFT_SERVER: https://openshift.tanukionline.com:8443
>   * OPENSHIFT_DOMAIN: tanukionline.com

### Use GitLab CI

Now we’re ready to configure GitLab CI. Luckily GitLab also provides a bunch of templates to get us started. Back to the project, let’s click `Setup CI` and choose the OpenShift template.

> * Go to Project, Click Setup CI
> * Choose OpenShift template
> * Commit

Great, that completes our setup.

## Idea (Chat)

Let’s go to our Mattermost client. We can get there from our OpenShift dashboard. Mattermost is an open source Slack alternative that comes bundled with GitLab. Because of the tight integration, I can use GitLab single-sign-on and it’ll know who I am.

> * Go to OpenShift and select the GitLab project [https://openshift.tanukionline.com:8443/console/project/gitlab/overview](https://openshift.tanukionline.com:8443/console/project/gitlab/overview)
> * Click [Mattermost URL](http://mattermost.tanukionline.com) (second application, top right)
> * Sign up with GitLab
> * Authorize
<commit_msg>add details to clarify repeat steps to add key and value for server and domain<commit_after>---
layout: markdown_page
title: "Vision Demo: Idea to Production"
---

This demonstration is designed to highlight GitLab’s open set of tools for the software development lifecycle, from idea to production, through chat, issues, planning, merge request, CI, and CD.

![](handbook/sales/lifecycle.png)

We're going to start from scratch, creating a brand new GitLab installation.

![](handbook/sales/steps.png)

<iframe width="640" height="389" src="https://www.youtube.com/embed/t_rB1oQdG98" frameborder="0" allowfullscreen></iframe>

----

## Prerequisites
{:.no_toc}

- Working OpenShift setup

## Links
{:.no_toc}

- [Original Slideware](https://docs.google.com/presentation/d/1D_L7s5xqDLw82B-drpM0av1-1m92f_ibIWruTmar-IQ/edit)
- [Meta Issue](https://gitlab.com/gitlab-org/gitlab-ce/issues/19793)

## Vision Demo: Idea to Production
{:.no_toc}

**Main items**

- TOC
{:toc}

## Pre-demo Setup

> * Login to OpenShift
>   * URL: [https://openshift.tanukionline.com:8443/console/](https://openshift.tanukionline.com:8443/console/)
>   * Username: gitlab-user
>   * Password: <<PASSWORD>>
> * Delete all Openshift projects using OpenShift web interface
> * [Reset cookie](chrome://settings/cookies) that [blocks issue board default list prompt](https://www.dropbox.com/s/knwdvnkuholo2xd/Screenshot%202016-10-14%2011.11.39.png?dl=0)
> * Disable desktop notifications (on a Mac, top-right corner, option click)
> * Open up new browser window so the audience doesn’t see all your other open tabs.
> * Open [flowchart](https://gitlab-org.gitlab.io/gitlab-design/progress/dimitrie/flowchartideatoprod/flowchart-html-previews/) as opening window during intro
> * Consider just sharing web browser window so the audience isn’t distracted by notes or other windows.
> * [Zoom content on the screen](https://support.apple.com/kb/ph11488?locale=en_US)

## Intro

Today I'd like to demo some of the power of GitLab’s open set of tools
for the software development lifecycle, helping you get from idea to production
as quickly as possible. We plan to ship all this functionality in GitLab 8.14.

## Install GitLab itself

The first step is to install GitLab itself. Today I'm going to use RedHat's Openshift, which is a Kubernetes platform that you can host yourself or use as a SaaS. We’re going to install everything from scratch and we’ll start by opening the Openshift web UI. Here we’ll create a new project named `gitlab`.

> * Open Openshift web UI and log in to [Openshift Origin](https://openshift.tanukionline.com:8443).
> * Click New Project
> Name it `gitlab`
> Create it

And then we import an OpenShift template for a complete GitLab installation. We have to set a couple hostnames.

> * Click on Import YAML/JSON
> * Open in a browser: [YAML template in Omnibus repo](https://gitlab.com/gitlab-org/omnibus-gitlab/raw/openshift-idea-to-production/docker/openshift/idea-2-prod-template.json) which is also linked from [our installation page](https://about.gitlab.com/installation/).
> * Copy content of idea-2-prod-template.json
> * Click Create, leave `Process the template` selected, click Continue
>   * GitLab instance hostname to `gitlab.tanukionline.com`
>   * Mattermost instance hostname to `mattermost.tanukionline.com`
> * Press button
> * Continue to overview

Boom, we’ve got a shiny new GitLab installation with several containers. They are running the GitLab Rails app, Mattermost for Chat, Postgres, Redis, and GitLab Runner for CI and CD. This is everything you need for the application development lifecycle on Kubernetes. It will take a few minutes for GitLab Rails to configure itself so it’s a good time to describe what we’re covering today.

> * Open up [Flowchart](https://gitlab-org.gitlab.io/gitlab-design/progress/dimitrie/flowchartideatoprod/flowchart-html-previews/)

In the rest of the demo, I’ll take you through everything you need to have to take ideas to production, including chat with Mattermost, issues and issue tracking, planning with issue boards, coding with terminal access, committing with git version control and merge requests for code review, testing with continuous integration, getting peer reviews with live review apps, continuous deployment to staging, and closing the loop by deploying to production directly from chat, and lastly cycle analytics to measure how fast you’re going from idea to production. With GitLab, everything is integrated out of the box.

*TODO: Make above content match what is on flowchart so you can read it from there.*

*TODO: Talk about Cycle analytics*

> * Wait for gitlab pod to go from light blue to full blue
> Click the [GitLab link](http://gitlab.tanukionline.com)

## Setup a user and project

Now that we've got GitLab running, let's set up an account.

> * Change password for root user
> * Login

We now create a group for our company; let’s name it `tanuki`.

> * Create a group called `tanuki` and make it public

Then let’s now create a new project to start off with. Let's call it `www` and make it public.

> * Create a project called `www` under the `tanuki` group and make it public

### Configure a project

Great, we have a new project, now let’s create a the first file. We’ll use the built-in GitLab editor to add it.

> * Click add readme (changing that to + in [#23310](https://gitlab.com/gitlab-org/gitlab-ce/issues/23310))
> * Name the file `index.html`
> * Type `Hello World` as the contents
> * Click Submit

Of course this is just a static file and not an application yet, but since we’re using OpenShift it’s really easy to use Docker. GitLab offers a set of `Dockerfile` templates that we can use. Let’s add a new Dockerfile and choose the template for Apache’s httpd server.

> * Click back to the files tab
> * Add a file + icon, New file
> * Filename to `Dockerfile`
> * template HTTPd
> * Commit changes on master

### Prepare OpenShift

*TODO: Simplify this with [Smart Deployments](https://gitlab.com/gitlab-org/gitlab-ce/issues/22864#note_16790373) or in the short term with [use the internal routing name for kubernetes in the openshift CI template for i2p demo](https://gitlab.com/gitlab-org/gitlab-ce/issues/23445) and [having trouble auto-discovering subdomain in OpenShift for idea to production demo
](https://gitlab.com/gitlab-org/gitlab-ce/issues/23446).*

The next step is to configure CI, but first we have to set up some project variables that CI needs in order to create deployments in our OpenShift environment. We can find our Access Token in Openshift.

> * Go to [Openshift](https://openshift.tanukionline.com:8443/console/command-line) or `Help > Command Line Tools > .. click to show token…`
> * Copy token

We will now copy this token and go back to GitLab where we will use this token as a environmental variable which will be automatically passed to our CI/CD pipeline jobs.

> * Go to GitLab
> * Settings > Variables
> * Key: OPENSHIFT_TOKEN
> * Value: paste token
> * Add new variable

We also need to set our server and our domain.

> * Repeat for:
>   * Key: OPENSHIFT_SERVER 
>   * Value: https://openshift.tanukionline.com:8443
> * and repeat for:
>   * Key: OPENSHIFT_DOMAIN
>   * Value: tanukionline.com

### Use GitLab CI

Now we’re ready to configure GitLab CI. Luckily GitLab also provides a bunch of templates to get us started. Back to the project, let’s click `Setup CI` and choose the OpenShift template.

> * Go to Project, Click Setup CI
> * Choose OpenShift template
> * Commit

Great, that completes our setup.

## Idea (Chat)

Let’s go to our Mattermost client. We can get there from our OpenShift dashboard. Mattermost is an open source Slack alternative that comes bundled with GitLab. Because of the tight integration, I can use GitLab single-sign-on and it’ll know who I am.

> * Go to OpenShift and select the GitLab project [https://openshift.tanukionline.com:8443/console/project/gitlab/overview](https://openshift.tanukionline.com:8443/console/project/gitlab/overview)
> * Click [Mattermost URL](http://mattermost.tanukionline.com) (second application, top right)
> * Sign up with GitLab
> * Authorize

{'fraction_non_alphanumeric': 0.08906307863226762, 'fraction_numerical': 0.014442661399827183, 'mean_word_length': 4.413631807550952, 'pattern_counts': {'":': 0, '<': 11, '<?xml version=': 0, '>': 132, 'https://': 40, 'lorem ipsum': 0, 'www.': 8, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1554280', 'n_tokens_mistral': 5104, 'n_tokens_neox': 4726, 'n_words': 2027}