diff --git a/views/ngXosViews/UITutorial/src/templates/js-shell.tpl.html b/views/ngXosViews/UITutorial/src/templates/js-shell.tpl.html
index 8799fd4..aae18db 100644
--- a/views/ngXosViews/UITutorial/src/templates/js-shell.tpl.html
+++ b/views/ngXosViews/UITutorial/src/templates/js-shell.tpl.html
@@ -3,4 +3,29 @@
     Type <code>help</code> or hit <code>TAB</code> for a list of commands.
   </div>
   <div id="shell-view"></div>
-</div>
\ No newline at end of file
+</div>
+
+<section class="component-container" ng-show="vm.componentScope">
+  <div class="row">
+    <div class="col-xs-6">
+      <label>Config:</label>
+    </div>
+    <div class="col-xs-6">
+      <label>data:</label>
+    </div>
+  </div>
+  <div class="row">
+    <div class="col-xs-6">
+      <div ng-model="vm.componentScope.config" ui-ace></div>
+    </div>
+    <div class="col-xs-6">
+      <div ng-model="vm.componentScope.data" ui-ace></div>
+    </div>
+  </div>
+  <div class="row">
+    <div class="col-xs-12 text-right">
+      <a href="" ng-click="vm.applyScope(vm.componentScope)" class="btn btn-success">Apply Changes</a>
+    </div>
+  </div>
+  <div id="directive-container"></div>
+</section>
\ No newline at end of file