diff --git a/assembly/fabric8-ide-dashboard-war/src/app/workspaces/create-workspace/create-workspace.controller.ts b/assembly/fabric8-ide-dashboard-war/src/app/workspaces/create-workspace/create-workspace.controller.ts
deleted file mode 100644
index fee143ffe..000000000
--- a/assembly/fabric8-ide-dashboard-war/src/app/workspaces/create-workspace/create-workspace.controller.ts
+++ /dev/null
@@ -1,382 +0,0 @@
-/*
- * Copyright (c) 2016-2018 Red Hat, Inc.
- * This program and the accompanying materials are made
- * available under the terms of the Eclipse Public License 2.0
- * which is available at https://www.eclipse.org/legal/epl-2.0/
- *
- * SPDX-License-Identifier: EPL-2.0
- *
- * Contributors:
- *   Red Hat, Inc. - initial API and implementation
- */
-'use strict';
-
-import {CheEnvironmentRegistry} from '../../../components/api/environment/che-environment-registry.factory';
-import {EnvironmentManager} from '../../../components/api/environment/environment-manager';
-import {IEnvironmentManagerMachine} from '../../../components/api/environment/environment-manager-machine';
-import {CreateWorkspaceSvc} from './create-workspace.service';
-import {NamespaceSelectorSvc} from './namespace-selector/namespace-selector.service';
-import {RandomSvc} from '../../../components/utils/random.service';
-import {CheNotification} from '../../../components/notification/che-notification.factory';
-import {
-  ICheButtonDropdownMainAction,
-  ICheButtonDropdownOtherAction
-} from '../../../components/widget/button-dropdown/che-button-dropdown.directive';
-import {DevfileRegistry} from '../../../components/api/devfile-registry.factory';
-
-/**
- * This class is handling the controller for workspace creation.
- *
- * @author Oleksii Kurinnyi
- */
-export class CreateWorkspaceController {
-
-  static $inject = ['$mdDialog', '$timeout', 'cheEnvironmentRegistry', 'createWorkspaceSvc', 'namespaceSelectorSvc',
-   'randomSvc', '$log', 'cheNotification', 'devfileRegistry'];
-
-  /**
-   * Dropdown button config.
-   */
-  headerCreateButtonConfig: {
-    mainAction: ICheButtonDropdownMainAction,
-    otherActions: Array<ICheButtonDropdownOtherAction>
-  };
-  private $mdDialog: ng.material.IDialogService;
-  /**
-   * Timeout service.
-   */
-  private $timeout: ng.ITimeoutService;
-  /**
-   * The registry of environment managers.
-   */
-  private cheEnvironmentRegistry: CheEnvironmentRegistry;
-  /**
-   * Workspace creation service.
-   */
-  private createWorkspaceSvc: CreateWorkspaceSvc;
-  /**
-   * Namespace selector service.
-   */
-  private namespaceSelectorSvc: NamespaceSelectorSvc;
-  /**
-   * Generator for random strings.
-   */
-  private randomSvc: RandomSvc;
-  /**
-   * Logging service.
-   */
-  private $log: ng.ILogService;
-  /**
-   * Notification factory.
-   */
-  private cheNotification: CheNotification;
-  /**
-   * Devfile registry.
-   */
-  private devfileRegistry: DevfileRegistry;
-  /**
-   * The environment manager.
-   */
-  private environmentManager: EnvironmentManager;
-  /**
-   * The selected devfile.
-   */
-  private selectedDevfile: che.IWorkspaceDevfile;
-  /**
-   * The selected namespace ID.
-   */
-  private namespaceId: string;
-  /**
-   * The map of forms.
-   */
-  private forms: Map<string, ng.IFormController>;
-  /**
-   * The list of names of existing workspaces.
-   */
-  private usedNamesList: string[];
-  /**
-   * The name of workspace.
-   */
-  private workspaceName: string;
-  /**
-   * Hide progress loader if <code>true</code>.
-   */
-  private hideLoader: boolean;
-
-  /** Begin rhche-specific changes */
-  /**
-   * Downstream property for ephemeral mode toggle
-   */
-  private isEphemeralMode: boolean;
-  /** End rhche-specific changes */
-
-  private stackName: string;
-
-  /**
-   * Default constructor that is using resource injection
-   */
-  constructor($mdDialog: ng.material.IDialogService,
-              $timeout: ng.ITimeoutService,
-              cheEnvironmentRegistry: CheEnvironmentRegistry,
-              createWorkspaceSvc: CreateWorkspaceSvc,
-              namespaceSelectorSvc: NamespaceSelectorSvc,
-              randomSvc: RandomSvc,
-              $log: ng.ILogService,
-              cheNotification: CheNotification,
-              devfileRegistry: DevfileRegistry) {
-    this.$mdDialog = $mdDialog;
-    this.$timeout = $timeout;
-    this.cheEnvironmentRegistry = cheEnvironmentRegistry;
-    this.createWorkspaceSvc = createWorkspaceSvc;
-    this.namespaceSelectorSvc = namespaceSelectorSvc;
-    this.randomSvc = randomSvc;
-    this.$log = $log;
-    this.cheNotification = cheNotification;
-    this.devfileRegistry = devfileRegistry;
-
-    this.usedNamesList = [];
-    this.forms = new Map();
-
-    this.namespaceId = this.namespaceSelectorSvc.getNamespaceId();
-    this.buildListOfUsedNames().then(() => {
-      this.workspaceName = this.randomSvc.getRandString({prefix: 'wksp-', list: this.usedNamesList});
-      this.reValidateName();
-    });
-
-    // loader should be hidden and page content shown
-    // when stacks selector is rendered
-    // and default stack is selected
-    this.hideLoader = false;
-
-    /** Begin rhche-specific changes */
-    if (!this.selectedDevfile || !this.selectedDevfile.attributes || !this.selectedDevfile.attributes.persistVolumes) {
-      this.isEphemeralMode = false;
-    } else {
-      this.isEphemeralMode = JSON.parse(this.selectedDevfile.attributes.persistVolumes);
-    }
-    /** End rhche-specific changes */
-
-    // header toolbar
-    // dropdown button config
-    this.headerCreateButtonConfig = {
-      mainAction: {
-        title: 'Create & Open',
-        type: 'button',
-        action: () => {
-          this.createWorkspace().then((workspace: che.IWorkspace) => {
-            this.createWorkspaceSvc.redirectToIDE(workspace);
-          });
-        }
-      },
-      otherActions: [{
-        title: 'Create & Proceed Editing',
-        type: 'button',
-        action: () => {
-          this.createWorkspace().then((workspace: che.IWorkspace) => {
-            this.createWorkspaceSvc.redirectToDetails(workspace);
-          });
-        },
-        orderNumber: 1
-      }]
-    };
-  }
-
-  $onInit(): void {
-    // this method won't be called here
-    // place all initialization code in constructor
-  }
-
-  /** Begin rhche-specific changes */
-  /**
-   * Track the changes in ephemeral mode input.
-   */
-  onEphemeralModeChange(): void {
-    if (this.isEphemeralMode) {
-      this.selectedDevfile.attributes = this.selectedDevfile.attributes || {};
-      this.selectedDevfile.attributes.persistVolumes = 'false';
-    } else {
-      delete this.selectedDevfile.attributes.persistVolumes;
-    }
-  }
-  /** End rhche-specific changes */
-
-  /**
-   * Callback which is called when stack is selected.
-   *
-   * @param {string} stackId the stack ID
-   */
-  onDevfileSelected(devfile: che.IWorkspaceDevfile): void {
-    // tiny timeout for templates selector to be rendered
-    this.$timeout(() => {
-      this.hideLoader = true;
-    }, 10);
-    this.selectedDevfile = devfile;
-
-    /** Begin rhche-specific changes */
-    // set persistVolumes: false (ephemeral mode)
-    this.isEphemeralMode = true;
-    this.onEphemeralModeChange();
-    /** End rhche-specific changes */
-
-  }
-
-  /**
-   * Callback which is called when namespace is selected.
-   *
-   * @param {string} namespaceId a namespace ID
-   */
-  onNamespaceChanged(namespaceId: string) {
-    this.namespaceId = namespaceId;
-
-    this.buildListOfUsedNames().then(() => {
-      this.reValidateName();
-    });
-  }
-
-  /**
-   * Returns list of namespaces.
-   *
-   * @return {Array<che.INamespace>}
-   */
-  getNamespaces(): Array<che.INamespace> {
-    return this.namespaceSelectorSvc.getNamespaces();
-  }
-
-  /**
-   * Returns namespaces empty message if set.
-   *
-   * @returns {string}
-   */
-  getNamespaceEmptyMessage(): string {
-    return this.namespaceSelectorSvc.getNamespaceEmptyMessage();
-  }
-
-  /**
-   * Returns namespaces caption.
-   *
-   * @returns {string}
-   */
-  getNamespaceCaption(): string {
-    return this.namespaceSelectorSvc.getNamespaceCaption();
-  }
-
-  /**
-   * Returns <code>true</code> when 'Create' button should be disabled.
-   *
-   * @return {boolean}
-   */
-  isCreateButtonDisabled(): boolean {
-    if (!this.namespaceId || !this.selectedDevfile) {
-      return true;
-    }
-
-    for (const form of this.forms.values()) {
-      if (form.$valid !== true) {
-        return true;
-      }
-    }
-
-    return false;
-  }
-
-  /**
-   * Stores forms in list.
-   *
-   * @param {string} inputName
-   * @param {ng.IFormController} form
-   */
-  registerForm(inputName: string, form: ng.IFormController) {
-    this.forms.set(inputName, form);
-  }
-
-  /**
-   * Returns <code>false</code> if workspace's name is not unique in the namespace.
-   * Only member with 'manageWorkspaces' permission can definitely know whether
-   * name is unique or not.
-   *
-   * @param {string} name workspace's name
-   */
-  isNameUnique(name: string): boolean {
-    return this.usedNamesList.indexOf(name) === -1;
-  }
-
-  /**
-   * Filters list of workspaces by current namespace and
-   * builds list of names for current namespace.
-   *
-   * @return {IPromise<any>}
-   */
-  buildListOfUsedNames(): ng.IPromise<any> {
-    return this.createWorkspaceSvc.fetchWorkspacesByNamespace(this.namespaceId).then((workspaces: Array<che.IWorkspace>) => {
-      this.usedNamesList = workspaces.filter((workspace: che.IWorkspace) => {
-        return workspace.namespace === this.namespaceId;
-      }).map((workspace: che.IWorkspace) => {
-        return this.createWorkspaceSvc.getWorkspaceName(workspace);
-      });
-    });
-  }
-
-  /**
-   * Triggers form validation on Settings tab.
-   */
-  reValidateName(): void {
-    const form: ng.IFormController = this.forms.get('name');
-
-    if (!form) {
-      return;
-    }
-
-    ['name', 'deskname'].forEach((inputName: string) => {
-      const model = form[inputName] as ng.INgModelController;
-      if (model) {
-        model.$validate();
-      }
-    });
-  }
-
-  /**
-   * Creates workspace.
-   *
-   * @returns {angular.IPromise<che.IWorkspace>}
-   */
-  createWorkspace(): ng.IPromise<che.IWorkspace> {
-    // update workspace name
-    let devfileSource = angular.copy(this.selectedDevfile);
-    devfileSource.metadata.name = this.workspaceName;
-    return this.createWorkspaceSvc.createWorkspaceFromDevfile(devfileSource, {stackName: this.stackName});
-  }
-
-  /**
-   * Creates a workspace and shows a dialogue window for a user to select
-   * whether to open Workspace Details page or the IDE.
-   *
-   * @param {MouseEvent} $event
-   */
-  createWorkspaceAndShowDialog($event: MouseEvent): void {
-    this.createWorkspace().then((workspace: che.IWorkspace) => {
-      this.$mdDialog.show({
-        targetEvent: $event,
-        controller: 'AfterCreationDialogController',
-        controllerAs: 'afterCreationDialogController',
-        bindToController: true,
-        clickOutsideToClose: true,
-        templateUrl: 'app/workspaces/create-workspace/after-creation-dialog/after-creation-dialog.html'
-      }).then(() => {
-        // when promise is resolved then open workspace in IDE
-        this.createWorkspaceSvc.redirectToIDE(workspace);
-      }, () => {
-        // when promise is rejected then open Workspace Details page
-        this.createWorkspaceSvc.redirectToDetails(workspace);
-      });
-    });
-  }
-
-  /**
-   * Creates a workspace and redirects to the IDE.
-   */
-  createWorkspaceAndOpenIDE(): void {
-    this.createWorkspace().then((workspace: che.IWorkspace) => {
-      this.createWorkspaceSvc.redirectToIDE(workspace);
-    });
-  }
-}
diff --git a/assembly/fabric8-ide-dashboard-war/src/app/workspaces/create-workspace/create-workspace.html b/assembly/fabric8-ide-dashboard-war/src/app/workspaces/create-workspace/create-workspace.html
deleted file mode 100644
index 1df20238f..000000000
--- a/assembly/fabric8-ide-dashboard-war/src/app/workspaces/create-workspace/create-workspace.html
+++ /dev/null
@@ -1,96 +0,0 @@
-<!--
-
-    Copyright (c) 2016-2018 Red Hat, Inc.
-    This program and the accompanying materials are made
-    available under the terms of the Eclipse Public License 2.0
-    which is available at https://www.eclipse.org/legal/epl-2.0/
-
-    SPDX-License-Identifier: EPL-2.0
-
-    Contributors:
-      Red Hat, Inc. - initial API and implementation
-
--->
-<che-toolbar che-title="New Workspace"
-             class="create-workspace-toolbar">
-  <che-button-dropdown button-style="che-button-save-flat"
-                       button-disabled="createWorkspaceController.isCreateButtonDisabled()"
-                       main-action-config="createWorkspaceController.headerCreateButtonConfig.mainAction"
-                       other-actions-config="createWorkspaceController.headerCreateButtonConfig.otherActions"
-                       class="create-workspace-header-button"></che-button-dropdown>
-</che-toolbar>
-
-<md-progress-linear md-mode="indeterminate"
-                    class="create-workspace-progress"
-                    ng-hide="createWorkspaceController.hideLoader"></md-progress-linear>
-
-<md-content md-scroll-y flex
-            md-theme="default"
-            class="create-workspace-content">
-  <div ng-class="{'create-workspace-content-hidden': !createWorkspaceController.hideLoader}">
-
-    <!-- Name -->
-    <che-label-container che-label-name="Name"
-                         che-label-description="Define a name for your workspace.">
-      <ng-form flex layout="column"
-               name="workspaceNameForm"
-               class="create-workspace-name-form">
-        <che-input-box ng-init="createWorkspaceController.registerForm('name', workspaceNameForm)"
-                       che-form="workspaceNameForm"
-                       che-name="workspaceName"
-                       id="workspace-name-input"
-                       che-place-holder="Name of the workspace"
-                       aria-label="Name of the workspace"
-                       ng-model="createWorkspaceController.workspaceName"
-                       ng-model-options="{ updateOn: 'default blur', debounce: { 'default': 200, 'blur': 0 }, allowInvalid: false }"
-                       required
-                       custom-validator="createWorkspaceController.isNameUnique($value)"
-                       ng-minlength="3"
-                       ng-maxlength="100"
-                       ng-pattern="/^[a-z\d][a-z\d-.]+[a-z\d]$/i">
-          <div ng-message="required">A name is required.</div>
-          <div ng-message="minlength">The name has to be more than 3 characters long.</div>
-          <div ng-message="pattern">The name should not contain special characters like space, dollar, etc. and should start and end only with digits, latin letters or underscores.</div>
-          <div ng-message="maxlength">The name has to be less than 100 characters long.</div>
-          <div ng-message="customValidator">This workspace name is already used.</div>
-        </che-input-box>
-      </ng-form>
-    </che-label-container>
-
-    <!-- Namespace -->
-    <che-label-container che-label-name="{{createWorkspaceController.getNamespaceCaption()}}"
-                         ng-if="createWorkspaceController.getNamespaces().length > 0 || createWorkspaceController.getNamespaceEmptyMessage()">
-      <namespace-selector
-        on-namespace-change="createWorkspaceController.onNamespaceChanged(namespaceId)"></namespace-selector>
-    </che-label-container>
-
-    <!-- Ephemeral mode - rhche-specific -->
-    <che-label-container che-label-name="Ephemeral mode" che-label-description="In ephemeral mode workspace has no PVC attached.">
-      <md-switch class="ephemeral-mode-toggle"
-        ng-model="createWorkspaceController.isEphemeralMode"
-        ng-change="createWorkspaceController.onEphemeralModeChange()"
-        aria-label="ephemeral-mode">
-      </md-switch>
-    </che-label-container>
-    <!-- Ephemeral mode - rhche-specific -->
-
-    <che-label-container che-label-name="Select Stack"
-                         che-label-description="Choose your workspace runtime environment used to build and run your projects.">
-      <devfile-selector on-devfile-select="createWorkspaceController.onDevfileSelected(devfile)"
-                        stack-name="createWorkspaceController.stackName">
-      </devfile-selector>
-    </che-label-container>
-    <!-- Project source selector -->
-    <che-label-container che-label-name="Projects">
-      <project-source-selector devfile="createWorkspaceController.selectedDevfile"></project-source-selector>
-    </che-label-container>
-    <che-label-container>
-      <che-button-save-flat id="create-workspace-footer-button"
-                            name="saveButton"
-                            che-button-title="Create & Open"
-                            ng-click="createWorkspaceController.createWorkspaceAndOpenIDE()"
-                            ng-disabled="createWorkspaceController.isCreateButtonDisabled()"></che-button-save-flat>
-    </che-label-container>
-
-  </div>
-</md-content>
diff --git a/assembly/fabric8-ide-dashboard-war/src/app/workspaces/create-workspace/create-workspace.styl b/assembly/fabric8-ide-dashboard-war/src/app/workspaces/create-workspace/create-workspace.styl
deleted file mode 100644
index 6e4b7d8d7..000000000
--- a/assembly/fabric8-ide-dashboard-war/src/app/workspaces/create-workspace/create-workspace.styl
+++ /dev/null
@@ -1,44 +0,0 @@
-.create-workspace-progress
-  position absolute
-  top 56px
-  z-index 2
-
-.create-workspace-toolbar
-  .che-toolbar-header > div:last-child
-    bottom 9px
-
-.create-workspace-header-button .che-button-dropdown
-  button.che-button,
-  .fa-caret-down
-    min-height 36px
-    height 36px
-
-  .area-dropdown.dropdown-menu
-    top 36px
-
-
-md-content.create-workspace-content
-  background-color $very-light-grey-background-color
-  padding 15px
-
-  .che-label-container-label-name
-    text-transform uppercase
-    color $grey-input-label-color !important
-    font-weight bold !important
-
-  .che-label-container-content
-    min-width 850px
-
-  .create-workspace-content-hidden
-    visibility hidden
-
-  #create-workspace-footer-button
-    width 100%
-
-    button
-      margin 0 !important
-      width 100% !important
-
-  // rh-che specific changes
-  .ephemeral-mode-toggle
-    margin 0 !important
diff --git a/assembly/fabric8-ide-dashboard-war/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.controller.ts b/assembly/fabric8-ide-dashboard-war/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.controller.ts
new file mode 100644
index 000000000..bc3c6b644
--- /dev/null
+++ b/assembly/fabric8-ide-dashboard-war/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.controller.ts
@@ -0,0 +1,275 @@
+/*
+ * Copyright (c) 2016-2018 Red Hat, Inc.
+ * This program and the accompanying materials are made
+ * available under the terms of the Eclipse Public License 2.0
+ * which is available at https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ *
+ * Contributors:
+ *   Red Hat, Inc. - initial API and implementation
+ */
+'use strict';
+
+import { CreateWorkspaceSvc } from '../create-workspace.service';
+import { NamespaceSelectorSvc } from './namespace-selector/namespace-selector.service';
+import { RandomSvc } from '../../../../components/utils/random.service';
+import { IReadyToGoStacksScopeBindings } from './ready-to-go-stacks.directive';
+import { ProjectSourceSelectorService } from './project-source-selector/project-source-selector.service';
+
+/**
+ * This class is handling the controller for predefined stacks.
+ *
+ * @author Oleksii Kurinnyi
+ */
+export class ReadyToGoStacksController implements IReadyToGoStacksScopeBindings {
+
+  static $inject = [
+    '$timeout',
+    'createWorkspaceSvc',
+    'namespaceSelectorSvc',
+    'projectSourceSelectorService',
+    'randomSvc'
+  ];
+
+  /**
+   * Directive scope bindings.
+   */
+  onChange: (eventData: { devfile: che.IWorkspaceDevfile, attrs: { [key: string]: any } }) => void;
+  /**
+   * The selected devfile.
+   */
+  selectedDevfile: che.IWorkspaceDevfile;
+  /**
+   * The workspace name model.
+   */
+  workspaceName: string;
+  /**
+   * Form name
+   */
+  WORKSPACE_NAME_FORM = 'workspaceName';
+
+  /**
+   * Injected dependencies.
+   */
+  private $timeout: ng.ITimeoutService;
+  private createWorkspaceSvc: CreateWorkspaceSvc;
+  private namespaceSelectorSvc: NamespaceSelectorSvc;
+  private projectSourceSelectorService: ProjectSourceSelectorService;
+  private randomSvc: RandomSvc;
+
+  /**
+   * The selected namespace ID.
+   */
+  private namespaceId: string;
+  /**
+   * The map of forms.
+   */
+  private forms: Map<string, ng.IFormController>;
+  /**
+   * The list of names of existing workspaces.
+   */
+  private usedNamesList: string[];
+  /**
+   * Selected stack name.
+   */
+  private stackName: string;
+  /**
+   * Workspace name provided by user.
+   */
+  private providedWorkspaceName: string;
+
+  /** Begin rhche-specific changes */
+  /**
+   * Downstream property for ephemeral mode toggle
+   */
+  private isEphemeralMode: boolean;
+  /** End rhche-specific changes */
+
+  /**
+   * Default constructor that is using resource injection
+   */
+  constructor(
+    $timeout: ng.ITimeoutService,
+    createWorkspaceSvc: CreateWorkspaceSvc,
+    namespaceSelectorSvc: NamespaceSelectorSvc,
+    projectSourceSelectorService: ProjectSourceSelectorService,
+    randomSvc: RandomSvc
+  ) {
+    this.$timeout = $timeout;
+    this.createWorkspaceSvc = createWorkspaceSvc;
+    this.namespaceSelectorSvc = namespaceSelectorSvc;
+    this.projectSourceSelectorService = projectSourceSelectorService;
+    this.randomSvc = randomSvc;
+
+    this.usedNamesList = [];
+    this.forms = new Map();
+
+    /** Begin rhche-specific changes */
+    if (!this.selectedDevfile || !this.selectedDevfile.attributes || !this.selectedDevfile.attributes.persistVolumes) {
+      this.isEphemeralMode = false;
+    } else {
+      this.isEphemeralMode = JSON.parse(this.selectedDevfile.attributes.persistVolumes);
+    }
+    /** End rhche-specific changes */
+  }
+
+  $onInit(): void {
+    this.namespaceId = this.namespaceSelectorSvc.getNamespaceId();
+    this.createWorkspaceSvc.buildListOfUsedNames(this.namespaceId).then((namesList: string[]) => {
+      this.usedNamesList = namesList;
+      this.workspaceName = this.randomSvc.getRandString({ prefix: 'wksp-', list: this.usedNamesList });
+      this.providedWorkspaceName = this.workspaceName;
+      this.reValidateName();
+    });
+  }
+
+  /** Begin rhche-specific changes */
+  /**
+   * Track the changes in ephemeral mode input.
+   */
+  onEphemeralModeChange(): void {
+    if (this.isEphemeralMode) {
+      this.selectedDevfile.attributes = this.selectedDevfile.attributes || {};
+      this.selectedDevfile.attributes.persistVolumes = 'false';
+    } else {
+      delete this.selectedDevfile.attributes.persistVolumes;
+    }
+  }
+  /** End rhche-specific changes */
+
+  /**
+   * Stores forms in list.
+   *
+   * @param name a name to register form controller.
+   * @param form a form controller.
+   */
+  registerForm(name: string, form: ng.IFormController) {
+    this.forms.set(name, form);
+  }
+
+  onDevfileNameChange(newName: string): void {
+    this.providedWorkspaceName = newName;
+    this.onDevfileChange();
+  }
+
+  /**
+   * Returns `false` if workspace name is not unique in the namespace.
+   * Only member with 'manageWorkspaces' permission can definitely know whether
+   * name is unique or not.
+   *
+   * @param name workspace name
+   */
+  isNameUnique(name: string): boolean {
+    return this.usedNamesList.indexOf(name) === -1;
+  }
+
+  /**
+   * Returns a warning message in case if namespace is missed.
+   */
+  getNamespaceEmptyMessage(): string {
+    return this.namespaceSelectorSvc.getNamespaceEmptyMessage();
+  }
+
+
+  /**
+   * Returns list of namespaces.
+   */
+  getNamespaces(): Array<che.INamespace> {
+    return this.namespaceSelectorSvc.getNamespaces();
+  }
+
+  /**
+   * Returns namespaces caption.
+   */
+  getNamespaceCaption(): string {
+    return this.namespaceSelectorSvc.getNamespaceCaption();
+  }
+
+  /**
+   * Callback which is called when stack is selected.
+   */
+  onDevfileSelected(devfile: che.IWorkspaceDevfile): void {
+    this.selectedDevfile = devfile;
+    this.onDevfileChange();
+
+    /** Begin rhche-specific changes */
+    // set persistVolumes: false (ephemeral mode)
+    this.isEphemeralMode = true;
+    this.onEphemeralModeChange();
+    /** End rhche-specific changes */
+
+  }
+
+  /**
+   * Callback which is called when a project template is added, updated or removed.
+   */
+  onProjectSelectorChange(): void {
+    this.onDevfileChange();
+  }
+
+  onDevfileChange(): void {
+    const devfile = angular.copy(this.selectedDevfile);
+
+    this.updateDevfileProjects(devfile);
+    devfile.metadata.name = this.providedWorkspaceName;
+
+    this.onChange({
+      devfile: devfile,
+      attrs: { stackName: this.stackName }
+    });
+  }
+
+  /**
+   * Populates a devfile with chosen projects
+   */
+  updateDevfileProjects(devfile: che.IWorkspaceDevfile): che.IWorkspaceDevfile {
+    // projects to add to current devfile
+    const projectTemplates = this.projectSourceSelectorService.getProjectTemplates();
+
+    devfile.projects = projectTemplates;
+
+    // check if some of added projects are defined in initial devfile
+    const projectDefinedInDevfile = projectTemplates.some((template: che.IProjectTemplate) =>
+      devfile.projects.some((devfileProject: any) => devfileProject.name === template.name)
+    );
+
+    // if no projects defined in devfile were added - remove the commands from devfile as well:
+    if (projectDefinedInDevfile === false) {
+      devfile.commands = [];
+    }
+
+    return devfile;
+  }
+
+  /**
+   * Callback which is called when namespace is selected.
+   */
+  onNamespaceChanged(namespaceId: string) {
+    this.namespaceId = namespaceId;
+
+    this.createWorkspaceSvc.buildListOfUsedNames(namespaceId).then((namesList: string[]) => {
+      this.usedNamesList = namesList;
+      this.reValidateName();
+    });
+  }
+
+  /**
+   * Triggers form validation on Settings tab.
+   */
+  private reValidateName(): void {
+    const form: ng.IFormController = this.forms.get('name');
+
+    if (!form) {
+      return;
+    }
+
+    ['name', 'deskname'].forEach((inputName: string) => {
+      const model = form[inputName] as ng.INgModelController;
+      if (model) {
+        model.$validate();
+      }
+    });
+  }
+
+}
diff --git a/assembly/fabric8-ide-dashboard-war/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.html b/assembly/fabric8-ide-dashboard-war/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.html
new file mode 100644
index 000000000..bf7fcdec5
--- /dev/null
+++ b/assembly/fabric8-ide-dashboard-war/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.html
@@ -0,0 +1,79 @@
+<!--
+
+    Copyright (c) 2016-2018 Red Hat, Inc.
+    This program and the accompanying materials are made
+    available under the terms of the Eclipse Public License 2.0
+    which is available at https://www.eclipse.org/legal/epl-2.0/
+
+    SPDX-License-Identifier: EPL-2.0
+
+    Contributors:
+      Red Hat, Inc. - initial API and implementation
+
+-->
+<!-- Name -->
+<che-label-container che-label-name="Name" che-label-description="Define a name for your workspace.">
+  <ng-form flex layout="column" name="workspaceNameForm">
+    <che-input-box
+      ng-init="readyToGoStacksController.registerForm(readyToGoStacksController.WORKSPACE_NAME_FORM, workspaceNameForm)"
+      che-form="workspaceNameForm" che-name="workspaceName" id="workspace-name-input"
+      che-place-holder="Name of the workspace" aria-label="Name of the workspace"
+      ng-model="readyToGoStacksController.workspaceName"
+      che-on-change="readyToGoStacksController.onDevfileNameChange($value)"
+      ng-model-options="{ updateOn: 'default blur', debounce: { 'default': 200, 'blur': 0 }, allowInvalid: false }"
+      required custom-validator="readyToGoStacksController.isNameUnique($value)" ng-minlength="3" ng-maxlength="100"
+      ng-pattern="/^[a-z\d][a-z\d-.]+[a-z\d]$/i">
+      <div ng-message="required">A name is required.</div>
+      <div ng-message="minlength">
+        The name has to be more than 3 characters long.
+      </div>
+      <div ng-message="pattern">
+        The name should not contain special characters like space, dollar, etc.
+        and should start and end only with digits, latin letters or underscores.
+      </div>
+      <div ng-message="maxlength">
+        The name has to be less than 100 characters long.
+      </div>
+      <div ng-message="customValidator">
+        This workspace name is already used.
+      </div>
+    </che-input-box>
+  </ng-form>
+</che-label-container>
+
+<!-- Namespace selector -->
+<che-label-container che-label-name="{{ readyToGoStacksController.getNamespaceCaption() }}"
+  ng-if="readyToGoStacksController.getNamespaces().length > 0 || readyToGoStacksController.getNamespaceEmptyMessage()">
+  <namespace-selector
+  on-namespace-change="readyToGoStacksController.onNamespaceChanged(namespaceId)">
+  </namespace-selector>
+</che-label-container>
+
+<!-- Ephemeral mode - rhche-specific -->
+<che-label-container che-label-name="Ephemeral mode" che-label-description="In ephemeral mode workspace has no PVC attached.">
+  <md-switch class="ephemeral-mode-toggle"
+    ng-model="readyToGoStacksController.isEphemeralMode"
+    ng-change="readyToGoStacksController.onEphemeralModeChange()"
+    aria-label="ephemeral-mode">
+  </md-switch>
+</che-label-container>
+<!-- Ephemeral mode - rhche-specific -->
+
+<!-- Stack devfile selector -->
+<che-label-container che-label-name="Select Stack"
+  che-label-description="Choose your workspace runtime environment used to build and run your projects.">
+  <devfile-selector on-devfile-select="readyToGoStacksController.onDevfileSelected(devfile)"
+    stack-name="readyToGoStacksController.stackName">
+  </devfile-selector>
+</che-label-container>
+
+<!-- Project source selector -->
+<che-label-container che-label-name="Projects">
+  <project-source-selector devfile="readyToGoStacksController.selectedDevfile"
+    on-change="readyToGoStacksController.onProjectSelectorChange()"></project-source-selector>
+</che-label-container>
+
+<!-- Create Workspace Button -->
+<che-label-container>
+  <ng-transclude></ng-transclude>
+</che-label-container>
diff --git a/assembly/fabric8-ide-dashboard-war/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.styl b/assembly/fabric8-ide-dashboard-war/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.styl
new file mode 100644
index 000000000..5d7563f6e
--- /dev/null
+++ b/assembly/fabric8-ide-dashboard-war/src/app/workspaces/create-workspace/ready-to-go-stacks/ready-to-go-stacks.styl
@@ -0,0 +1,6 @@
+.ready-to-go-progress
+  z-index 2
+
+// rh-che specific changes
+.ephemeral-mode-toggle
+  margin 0 !important
\ No newline at end of file