diff --git a/views/ngXosViews/UITutorial/src/index.html b/views/ngXosViews/UITutorial/src/index.html
index d325f9c..00f0a42 100644
--- a/views/ngXosViews/UITutorial/src/index.html
+++ b/views/ngXosViews/UITutorial/src/index.html
@@ -17,9 +17,9 @@
 <!-- bower:js -->
 <script src="vendor/jquery/dist/jquery.js"></script>
 <script src="vendor/lodash/lodash.js"></script>
+<script src="vendor/josh.js/js/killring.js"></script>
 <script src="vendor/josh.js/js/readline.js"></script>
 <script src="vendor/josh.js/js/history.js"></script>
-<script src="vendor/josh.js/js/killring.js"></script>
 <script src="vendor/josh.js/js/input.js"></script>
 <script src="vendor/josh.js/js/pathhandler.js"></script>
 <script src="vendor/josh.js/js/shell.js"></script>
@@ -41,6 +41,8 @@
 <script src="/.tmp/main.js"></script>
 <script src="/.tmp/templateHandler.js"></script>
 <script src="/.tmp/responseHandler.js"></script>
+<script src="/.tmp/lessonsInfo.js"></script>
+<script src="/.tmp/learnCmd.js"></script>
 <script src="/.tmp/exploreCmd.js"></script>
 <script src="/.tmp/errorHandler.js"></script>
 <!-- endinject -->
\ No newline at end of file
diff --git a/views/ngXosViews/UITutorial/src/js/learnCmd.js b/views/ngXosViews/UITutorial/src/js/learnCmd.js
new file mode 100644
index 0000000..cb58084
--- /dev/null
+++ b/views/ngXosViews/UITutorial/src/js/learnCmd.js
@@ -0,0 +1,76 @@
+(function () {
+  'use strict';
+  angular.module('xos.UITutorial')
+  .service('LearnCmd', function(LessonInfo, $cookies, ErrorHandler){
+
+
+    this.getCurrentLesson = (id,done)=>{
+      var details = LessonInfo.lessonCatalogue(id);
+      $cookies.put('lessonId', id);
+      done(details.text);
+    };
+
+    this.nextLesson = (shell) => {
+      this.shell = shell;
+      shell.setCommandHandler('next', {
+        exec: this.getNextLesson,
+      });
+    }
+
+    this.printLesson = (shell) => {
+      this.shell = shell;
+      shell.setCommandHandler('print', {
+        exec: this.printCurrentLesson,
+      });
+    };
+
+    this.prevLesson = (shell) => {
+      this.shell = shell;
+      shell.setCommandHandler('prev', {
+        exec: this.getPreviousLesson,
+      });
+    }
+
+    this.getLessonIdFromCookie = ()=>{
+      return $cookies.get('lessonId') ? parseInt($cookies.get('lessonId')) : -1;
+    };
+
+    this.getNextLesson = (cmd,arg,done)=>{
+      let lessonId = this.getLessonIdFromCookie();
+      return this.getCurrentLesson(lessonId+1,done)  ;
+    };
+
+    this.getPreviousLesson = (cmd,arg,done)=>{
+      let lessonId = this.getLessonIdFromCookie();
+      if(lessonId>0)  {
+        this.getCurrentLesson(lessonId-1,done)
+      }
+      else {
+        ErrorHandler.print(`This is the first Lesson`, done);
+      }
+    };
+
+    this.printCurrentLesson = (cmd,args,done)=>{
+      if (args[0]){
+        this.getCurrentLesson(args[0], done);
+      }
+      else {
+        let lessonId = this.getLessonIdFromCookie();
+        if (lessonId > -1) {
+          this.getCurrentLesson(lessonId, done)
+        }
+        else {
+          ErrorHandler.print(`This is the first Lesson`, done);
+        }
+      }
+    };
+
+    this.setup = (shell) => {
+      this.shell = shell;
+      this.nextLesson(shell);
+      this.prevLesson(shell);
+      this.printLesson(shell);
+    };
+
+  });
+})();
\ No newline at end of file
diff --git a/views/ngXosViews/UITutorial/src/js/lessonsInfo.js b/views/ngXosViews/UITutorial/src/js/lessonsInfo.js
new file mode 100644
index 0000000..7dea0db
--- /dev/null
+++ b/views/ngXosViews/UITutorial/src/js/lessonsInfo.js
@@ -0,0 +1,43 @@
+(function () {
+  'use strict';
+  angular.module('xos.UITutorial')
+  .service('LessonInfo', function(){
+
+    this.lessonCatalogue = (id) => {
+      let lessonData = [
+        {
+          id: 0,
+          text: 'lesson 0 info',
+          solution: 'Hello World'
+        },
+        {
+          id: 1,
+          text: 'lesson 1 info',
+          solution: 'Hello World'
+        },
+        {
+          id: 2,
+          text: 'lesson 2 info',
+          solution: 'Hello World'
+        },
+        {
+          id: 3,
+          text: 'lesson 3 info',
+          solution: 'Hello World'
+        },
+        {
+          id: 4,
+          text: 'lesson 4 info',
+          solution: 'Hello World  '
+        },
+        {
+          id: 5,
+          text: 'lesson 5 info',
+          solution: 'Hello World'
+        }
+      ];
+      return lessonData[id];
+    }
+
+  });
+} )();
\ No newline at end of file
diff --git a/views/ngXosViews/UITutorial/src/js/main.js b/views/ngXosViews/UITutorial/src/js/main.js
index c89f1da..627a560 100644
--- a/views/ngXosViews/UITutorial/src/js/main.js
+++ b/views/ngXosViews/UITutorial/src/js/main.js
@@ -23,7 +23,7 @@
     bindToController: true,
     controllerAs: 'vm',
     templateUrl: 'templates/js-shell.tpl.html',
-    controller: function(ExploreCmd){
+    controller: function(ExploreCmd,LearnCmd){
       var history = new Josh.History({ key: 'jsshell.history'});
       this.shell = Josh.Shell({history: history});
 
@@ -45,6 +45,20 @@
         }
       });
 
+      this.shell.setCommandHandler('learn', {
+        exec: (cmd, args, done) => {
+          LearnCmd.setup(this.shell);
+          done(TemplateHandler.instructions({
+            title: `You can now learn the API`,
+            messages: [
+              `Use <code>next</code> to move to the next lesson <code>resource {resoureName} {method} {?paramters}</code> to call the API.`,
+              `An example command is <code>resource Slices query</code>`,
+              `You can also provide paramters with <code>next</code>`
+            ]
+          }));
+        }
+      });
+
       this.shell.activate();
     }
   };