Market place initial code

Resolved:VNFSDK-53
VNF SDK market place

Change-Id: Ic9ac5491b4a43d03bce105abb295e10c476e1560
Signed-off-by: Murali-P <murali.p@huawei.com>

41 files changed, 3197 insertions, 0 deletions

diff --git a/vnfmarket-be/portal-marketplace/pom.xml b/vnfmarket-be/portal-marketplace/pom.xml
new file mode 100644
index 00000000..219e8a59
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/pom.xml
@@ -0,0 +1,38 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+  Copyright 2016-2017 Huawei Technologies Co., Ltd.
+ 
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+      http://www.apache.org/licenses/LICENSE-2.0
+ 
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+-->
+<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
+  <parent>
+    <groupId>org.openo.vnf-sdk.marketplace</groupId>
+    <artifactId>vnf-sdk-marketplace-core-parent</artifactId>
+    <version>1.1.0-SNAPSHOT</version>
+  </parent>
+  <modelVersion>4.0.0</modelVersion>
+  <artifactId>portal-marketplace</artifactId>
+  <version>1.1.0-SNAPSHOT</version>
+  <packaging>war</packaging>
+  <build>
+    <plugins>
+      <plugin>
+        <groupId>org.apache.maven.plugins</groupId>
+        <artifactId>maven-war-plugin</artifactId>
+        <configuration>
+          <failOnMissingWebXml>false</failOnMissingWebXml>
+        </configuration>
+      </plugin>
+    </plugins>
+  </build>
+<name>vnf-sdk-marketplace/portal-marketplace</name></project>
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/Gruntfile.js b/vnfmarket-be/portal-marketplace/src/main/webapp/Gruntfile.js
new file mode 100644
index 00000000..99673b10
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/Gruntfile.js
@@ -0,0 +1,192 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+// Grunt tasks
+
+module.exports = function (grunt) {
+	"use strict";
+
+	// Project configuration.
+	grunt.initConfig({
+
+		pkg: grunt.file.readJSON('package.json'),
+		banner: '/*!\n' +
+		'* <%= pkg.name %> - v<%= pkg.version %> - MIT LICENSE <%= grunt.template.today("yyyy-mm-dd") %>. \n' +
+		'* @author <%= pkg.author %>\n' +
+		'*/\n',
+
+		clean: {
+			dist: ['src']
+		},
+
+		jshint: {
+			options: {
+				jshintrc: '.jshintrc'
+			},
+			gruntfile: {
+				src: 'Gruntfile.js'
+			},
+			app: {
+				src: ['app/modules/**/*.js']
+			}
+		},
+
+		exec: {
+			bowerInstaller: 'bower-installer'
+		},
+
+		concat: {
+			options: {
+				banner: '<%= banner %>',
+				stripBanners: false
+			},
+			base: {
+				src: [
+					// Angular Project Dependencies,
+					'app/app.js',
+					'app/app.config.js',
+					'app/modules/**/*Module.js',
+					'app/modules/**/*Route.js',
+					'app/modules/**/*Ctrl.js',
+					'app/modules/**/*Service.js',
+					'app/modules/**/*Directive.js'
+				],
+				dest: 'app/assets/js/<%= pkg.name %>-appbundle.js'
+			},
+			build: {
+				src: [
+					// Angular Project Dependencies,
+					'app/assets/libs/angular/angular.js',
+					'app/assets/libs/**/*.js'
+
+				],
+				dest: 'app/assets/js/<%= pkg.name %>-angularbundle.js'
+			}
+		},
+
+		uglify: {
+			options: {
+				banner: '<%= banner %>',
+				report: 'min'
+			},
+			base: {
+				src: ['<%= concat.base.dest %>'],
+				dest: 'app/assets/js/<%= pkg.name %>-angscript.min.js'
+			},
+			basePlugin: {
+				src: [ 'src/plugins/**/*.js' ],
+				dest: 'app/assets/js/plugins/',
+				expand: true,
+				flatten: true,
+				ext: '.min.js'
+			}
+		},
+
+		connect: {
+			server: {
+				options: {
+					keepalive: true,
+					port: 4000,
+					base: '.',
+					hostname: 'localhost',
+					debug: true,
+					livereload: true,
+					open: true
+				}
+			}
+		},
+		concurrent: {
+			tasks: ['connect', 'watch'],
+			options: {
+				logConcurrentOutput: true
+			}
+		},
+
+		watch: {
+			app: {
+				files: '<%= jshint.app.src %>',
+				tasks: ['jshint:app'],
+				options: {
+					livereload: true
+				}
+			}
+		},
+
+		injector: {
+			options: {},
+			dev: {
+				files: {
+					'index.html': [
+						'bower.json',
+						'app/app.js',
+						'app/app.config.js',
+						'app/**/*Module.js',
+						'app/**/*Route.js',
+						'app/**/*Ctrl.js',
+						'app/**/*Service.js',
+						'app/**/*Directive.js'
+					]
+				}
+			},
+			production: {
+				files: {
+					'index.html': [
+						'app/assets/css/**/*.css',
+						'app/assets/js/*.js'
+					]
+
+				}
+			}
+		},
+
+		ngtemplates: {
+			app: {
+				src: 'app/modules/**/*.html',
+				dest: 'app/assets/js/templates.js',
+				options: {
+					module: '<%= pkg.name %>',
+					root: 'app/',
+					standAlone: false
+				}
+			}
+		}
+
+
+
+	});
+
+	require('time-grunt')(grunt);
+	require('load-grunt-tasks')(grunt);
+
+	// Making grunt default to force in order not to break the project if something fail.
+	grunt.option('force', true);
+
+	// Register grunt tasks
+	grunt.registerTask("build", [
+		"jshint",
+		"exec",
+		"concat",
+		"ngtemplates",
+		"injector:production",
+		"concurrent",
+		"clean"
+	]);
+
+	// Development task(s).
+	grunt.registerTask('dev', ['injector:dev', 'concurrent']);
+
+};
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/README.md b/vnfmarket-be/portal-marketplace/src/main/webapp/README.md
new file mode 100644
index 00000000..ac0ec86a
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/README.md
@@ -0,0 +1,28 @@
+# VNF Marketplace.
+
+A GUI to a access and manage the VNF Marketplace.
+
+
+
+## Getting started
+
+Clone project:
+
+    $ git clone https://github.com/
+
+Install dependencies:
+
+    $ cd vnfmarketplace
+    $ npm install
+
+Run development web-server:
+
+    $ grunt dev
+
+## Features
+
+* List features here
+
+## Project structure and credits
+
+* Project credits here
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/bower.json b/vnfmarket-be/portal-marketplace/src/main/webapp/bower.json
new file mode 100644
index 00000000..4f2d96ab
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/bower.json
@@ -0,0 +1,31 @@
+{
+  "name": "vnfmarket",
+  "description": "Marketplace UI for VNF Services",
+  "version": "0.0.1",
+  "install": {
+    "path": {
+      "js": "app/assets/libs",
+      "css": "app/assets/css"
+    }
+  },
+  "dependencies": {
+    "json3": "3.3.1",
+    "es5-shim": "3.1.0",
+    "angular": ">=1.3.*",
+    "angular-aria": ">=1.3.*",
+    "angular-mocks": ">=1.3.*",
+    "angular-cookies": ">=1.3.*",
+    "angular-animate": ">=1.3.*",
+    "angular-sanitize": ">=1.3.*",
+    "angular-resource": ">=1.3.*",
+    "angular-material-icons": "~0.6.0",
+    "angular-messages": ">=1.3.*",
+    "angular-material": ">=1.0.1",
+    "angular-ui-router": "~0.2.10",
+    "bootstrap": "3.3.7",
+    "components-font-awesome": "^4.7.0"
+  },
+  "resolutions": {
+    "angular": ">=1.3.*"
+  }
+}
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/index.html b/vnfmarket-be/portal-marketplace/src/main/webapp/index.html
new file mode 100644
index 00000000..9e2cfb62
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/index.html
@@ -0,0 +1,210 @@
+<!--
+  Copyright 2016-2017 Huawei Technologies Co., Ltd.
+ 
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+      http://www.apache.org/licenses/LICENSE-2.0
+ 
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+-->
+<!DOCTYPE html>
+<html lang="pt" ng-app="vnfmarket">
+<head>
+	<meta charset="utf-8">
+	<meta http-equiv="X-UA-Compatible" content="IE=edge">
+	<base href="/">
+	<title>VNF Marketplace</title>
+	<meta name="description" content="Marketplace UI for VNF Services" />
+	<meta name="author" content="" />
+	<meta name="keywords" content="" />
+	<meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=yes" />
+	<link rel="shortcut icon" href="app/assets/images/favicon.ico" />
+	<link rel="apple-touch-icon" href="app/assets/images/apple-touch-icon.png" />
+	<link rel="apple-touch-icon" sizes="72x72" href="app/assets/images/apple-touch-icon-72x72.png" />
+	<link rel="apple-touch-icon" sizes="114x114" href="app/assets/images/apple-touch-icon-114x114.png" />
+	<!-- injector:css -->
+	<link rel="stylesheet" href="/src/bower_components/angular-material-icons/angular-material-icons.css">
+	<link rel="stylesheet" href="/src/bower_components/angular-material/angular-material.css">
+	<link rel="stylesheet" href="/src/bower_components/components-font-awesome/css/font-awesome.css">
+	<!-- endinjector -->
+    <link rel="stylesheet" href="/src/bower_components/bootstrap/dist/css/bootstrap.min.css">
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=RobotoDraft:300,400,500,700,400italic">
+    <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
+    <style>
+        body, md-content.md-blue-grey-theme {
+            background-color: #eee;
+        }
+
+        md-toolbar:not(.md-hue-1),
+        .md-fab {
+            fill: #fff;
+        }
+
+        md-sidenav {
+            fill: #737373;
+        }
+
+        .user-avatar {
+            border-radius: 99%;
+        }
+
+        md-toolbar.md-tall {
+            height: 64px;
+            max-height: 64px;
+            min-height: 64px;
+        }
+        code {
+		    color: #4285f4;
+		    -webkit-font-smoothing: auto;
+		    font-weight: 300;
+		    background-color: #F2F2F2;
+		    padding: 10px;
+		}
+		.text-center {
+		    text-align: center!important
+		}
+		ul {
+		    list-style: none
+		}
+    </style>
+
+</head>
+<body ng-cloak>
+
+<!--Beginning-->
+<div ui-view layout="row" layout-fill></div>
+<!--End-->
+
+<!--Templates. Remove then to a better location -->
+
+<script type="text/ng-template" id="tabDialog.tmpl.html">
+    <md-dialog
+    aria-label="Profile">
+    <form>
+        <md-toolbar>
+            <div class="md-toolbar-tools">
+                <h2>Profile Settings</h2>
+                <span flex></span>
+                <md-button class="md-icon-button" ng-click="cancel()">
+                    <md-icon aria-label="Close dialog">close</md-icon>
+                </md-button>
+            </div>
+        </md-toolbar>
+        <md-dialog-content style="max-width:800px;max-height:810px; ">
+            <md-tabs md-dynamic-height md-border-bottom>
+                <md-tab label="one">
+                    <md-content class="md-padding">
+                        <h1 class="md-display-2">Tab One</h1>
+
+                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla venenatis ante augue.
+                            Phasellus volutpat neque ac dui mattis vulputate. Etiam consequat aliquam cursus. In sodales
+                            pretium ultrices. Maecenas lectus est, sollicitudin consectetur felis nec, feugiat ultricies
+                            mi.</p>
+                    </md-content>
+                </md-tab>
+                <md-tab label="two">
+                    <md-content class="md-padding">
+                        <h1 class="md-display-2">Tab Two</h1>
+
+                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla venenatis ante augue.
+                            Phasellus volutpat neque ac dui mattis vulputate. Etiam consequat aliquam cursus. In sodales
+                            pretium ultrices. Maecenas lectus est, sollicitudin consectetur felis nec, feugiat ultricies
+                            mi. Aliquam erat volutpat. Nam placerat, tortor in ultrices porttitor, orci enim rutrum
+                            enim, vel tempor sapien arcu a tellus. Vivamus convallis sodales ante varius gravida.
+                            Curabitur a purus vel augue ultrices ultricies id a nisl. Nullam malesuada consequat diam, a
+                            facilisis tortor volutpat et. Sed urna dolor, aliquet vitae posuere vulputate, euismod ac
+                            lorem. Sed felis risus, pulvinar at interdum quis, vehicula sed odio. Phasellus in enim
+                            venenatis, iaculis tortor eu, bibendum ante. Donec ac tellus dictum neque volutpat blandit.
+                            Praesent efficitur faucibus risus, ac auctor purus porttitor vitae. Phasellus ornare dui nec
+                            orci posuere, nec luctus mauris semper.</p>
+
+                        <p>Morbi viverra, ante vel aliquet tincidunt, leo dolor pharetra quam, at semper massa orci nec
+                            magna. Donec posuere nec sapien sed laoreet. Etiam cursus nunc in condimentum facilisis.
+                            Etiam in tempor tortor. Vivamus faucibus egestas enim, at convallis diam pulvinar vel. Cras
+                            ac orci eget nisi maximus cursus. Nunc urna libero, viverra sit amet nisl at, hendrerit
+                            tempor turpis. Maecenas facilisis convallis mi vel tempor. Nullam vitae nunc leo. Cras sed
+                            nisl consectetur, rhoncus sapien sit amet, tempus sapien.</p>
+
+                        <p>Integer turpis erat, porttitor vitae mi faucibus, laoreet interdum tellus. Curabitur posuere
+                            molestie dictum. Morbi eget congue risus, quis rhoncus quam. Suspendisse vitae hendrerit
+                            erat, at posuere mi. Cras eu fermentum nunc. Sed id ante eu orci commodo volutpat non ac
+                            est. Praesent ligula diam, congue eu enim scelerisque, finibus commodo lectus.</p>
+                    </md-content>
+                </md-tab>
+                <md-tab label="three">
+                    <md-content class="md-padding">
+                        <h1 class="md-display-2">Tab Three</h1>
+
+                        <p>Integer turpis erat, porttitor vitae mi faucibus, laoreet interdum tellus. Curabitur posuere
+                            molestie dictum. Morbi eget congue risus, quis rhoncus quam. Suspendisse vitae hendrerit
+                            erat, at posuere mi. Cras eu fermentum nunc. Sed id ante eu orci commodo volutpat non ac
+                            est. Praesent ligula diam, congue eu enim scelerisque, finibus commodo lectus.</p>
+                    </md-content>
+                </md-tab>
+            </md-tabs>
+        </md-dialog-content>
+
+        <md-dialog-actions layout="row">
+            <span flex></span>
+            <md-button ng-click="answer('not useful')">
+                Not Useful
+            </md-button>
+            <md-button ng-click="answer('useful')" style="margin-right:20px;">
+                Useful
+            </md-button>
+        </md-dialog-actions>
+    </form>
+    </md-dialog>
+</script>
+<!-- End templates -->
+
+
+<!-- injector:js -->
+<script src="/src/bower_components/jquery/dist/jquery.js"></script>
+<script src="/src/bower_components/es5-shim/es5-shim.js"></script>
+<script src="/src/bower_components/json3/lib/json3.min.js"></script>
+<script src="/src/bower_components/angular/angular.js"></script>
+<script src="/src/bower_components/angular-aria/angular-aria.js"></script>
+<script src="/src/bower_components/angular-mocks/angular-mocks.js"></script>
+<script src="/src/bower_components/angular-cookies/angular-cookies.js"></script>
+<script src="/src/bower_components/angular-animate/angular-animate.js"></script>
+<script src="/src/bower_components/angular-sanitize/angular-sanitize.js"></script>
+<script src="/src/bower_components/angular-resource/angular-resource.js"></script>
+<script src="/src/bower_components/angular-material-icons/angular-material-icons.min.js"></script>
+<script src="/src/bower_components/angular-messages/angular-messages.js"></script>
+<script src="/src/bower_components/angular-material/angular-material.js"></script>
+<script src="/src/bower_components/angular-ui-router/release/angular-ui-router.js"></script>
+<script src="/src/bower_components/bootstrap/dist/js/bootstrap.js"></script>
+<script src="/app/app.js"></script>
+<script src="/app/app.config.js"></script>
+<script src="/app/modules/about/aboutModule.js"></script>
+<script src="/app/modules/home/homeModule.js"></script>
+<script src="/app/modules/marketplace/marketplaceModule.js"></script>
+<script src="/app/modules/user/userModule.js"></script>
+<script src="/app/modules/about/aboutRoute.js"></script>
+<script src="/app/modules/home/homeRoute.js"></script>
+<script src="/app/modules/marketplace/marketplaceRoute.js"></script>
+<script src="/app/modules/user/userRoute.js"></script>
+<script src="/app/modules/about/aboutCtrl.js"></script>
+<script src="/app/modules/home/homeCtrl.js"></script>
+<script src="/app/modules/layouts/main-page/mainPageCtrl.js"></script>
+<script src="/app/modules/layouts/side-nav/sidenavCtrl.js"></script>
+<script src="/app/modules/marketplace/marketplaceCtrl.js"></script>
+<script src="/app/modules/user/userCtrl.js"></script>
+<script src="/app/modules/about/aboutService.js"></script>
+<script src="/app/modules/home/homeService.js"></script>
+<script src="/app/modules/layouts/nav-bar/navBarService.js"></script>
+<script src="/app/modules/layouts/side-nav/sidenavService.js"></script>
+<script src="/app/modules/marketplace/marketplaceService.js"></script>
+<script src="/app/modules/user/userService.js"></script>
+<!-- endinjector -->
+
+
+</body>
+</html>
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/karma.conf.js b/vnfmarket-be/portal-marketplace/src/main/webapp/karma.conf.js
new file mode 100644
index 00000000..ee858bba
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/karma.conf.js
@@ -0,0 +1,113 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+
+
+'use strict';
+
+// Karma configuration
+module.exports = function (config) {
+	config.set({
+		// Frameworks to use
+		frameworks: ['jasmine'],
+
+		// List of files / patterns to load in the browser
+		files: [
+			'src/bower_components/jquery/dist/jquery.js',
+			'src/bower_components/es5-shim/es5-shim.js',
+			'src/bower_components/json3/lib/json3.min.js',
+			'src/bower_components/angular/angular.js',
+			'src/bower_components/angular-aria/angular-aria.js',
+			'src/bower_components/angular-resource/angular-resource.js',
+			'src/bower_components/angular-mocks/angular-mocks.js',
+			'src/bower_components/angular-cookies/angular-cookies.js',
+			'src/bower_components/angular-sanitize/angular-sanitize.js',
+			'src/bower_components/angular-animate/angular-animate.js',
+			'src/bower_components/angular-touch/angular-touch.js',
+			'src/bower_components/angular-ui-router/release/angular-ui-router.js',
+			'src/bower_components/angular-aria/angular-aria.js',
+			'src/bower_components/angular-material/angular-material.js',
+			'src/bower_components/angular-messages/angular-messages.js',
+			'src/bower_components/angular-material-icons/angular-material-icons.js',
+			'app/app.js',
+			'app/modules/home/homeModule.js',
+			'app/modules/home/homeCtrl.js',
+			'app/modules/home/homeRoute.js',
+			'app/modules/home/homeService.js',
+			'app/modules/home/home-test.js',
+			'app/modules/user/userModule.js',
+			'app/modules/user/userCtrl.js',
+			'app/modules/user/userRoute.js',
+			'app/modules/user/userService.js',
+			'app/modules/user/user-test.js',
+			'app/modules/marketplace/marketplaceModule.js',
+			'app/modules/marketplace/marketplaceCtrl.js',
+			'app/modules/marketplace/marketplaceRoute.js',
+			'app/modules/marketplace/marketplaceService.js',
+			'app/modules/marketplace/marketplace-test.js',
+			'app/modules/about/aboutModule.js',
+			'app/modules/about/aboutCtrl.js',
+			'app/modules/about/aboutRoute.js',
+			'app/modules/about/aboutService.js',
+			'app/modules/about/about-test.js',
+		],
+
+		// Test results reporter to use
+		// Possible values: 'dots', 'progress', 'junit', 'growl', 'coverage'
+		//reporters: ['progress'],
+		reporters: ['spec'],
+
+		plugins : [
+			'karma-jasmine',
+			'karma-coverage',
+			'karma-chrome-launcher',
+			'karma-firefox-launcher',
+			'karma-phantomjs-launcher',
+			'karma-spec-reporter'
+		],
+
+		// Web server port
+		port: 9876,
+
+		// Enable / disable colors in the output (reporters and logs)
+		colors: true,
+
+		// Level of logging
+		// Possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
+		logLevel: config.LOG_INFO,
+
+		// Enable / disable watching file and executing tests whenever any file changes
+		autoWatch: true,
+
+		// Start these browsers, currently available:
+		// - Chrome
+		// - ChromeCanary
+		// - Firefox
+		// - Opera
+		// - Safari (only Mac)
+		// - PhantomJS
+		// - IE (only Windows)
+		browsers: ['PhantomJS'],
+
+		// If browser does not capture in given timeout [ms], kill it
+		captureTimeout: 60000,
+
+		// Continuous Integration mode
+		// If true, it capture browsers, run tests and exit
+		singleRun: true
+	});
+};
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/app.config.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/app.config.js
new file mode 100644
index 00000000..74f2e7b1
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/app.config.js
@@ -0,0 +1,62 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+
+
+
+(function () {
+	'use strict';
+
+	/**
+	 * @ngdoc configuration file
+	 * @name app.config:config
+	 * @description
+	 * # Config and run block
+	 * Configutation of the app
+	 */
+
+
+	angular
+		.module('vnfmarket')
+		.config(configure)
+		.run(runBlock);
+
+	configure.$inject = ['$stateProvider', '$urlRouterProvider', '$locationProvider', '$httpProvider'];
+
+	function configure($stateProvider, $urlRouterProvider, $locationProvider, $httpProvider) {
+
+		$locationProvider.hashPrefix('!');
+
+		// This is required for Browser Sync to work poperly
+		$httpProvider.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
+
+
+		$urlRouterProvider
+			.otherwise('/dashboard');
+
+	}
+
+	runBlock.$inject = ['$rootScope'];
+
+	function runBlock($rootScope) {
+		'use strict';
+
+		console.log('AngularJS run() function...');
+	}
+
+
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/app.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/app.js
new file mode 100644
index 00000000..1b3b63fc
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/app.js
@@ -0,0 +1,46 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+
+(function() {
+	'use strict';
+
+	/**
+	 * @ngdoc index
+	 * @name app
+	 * @description
+	 * # app
+	 *
+	 * Main modules of the application.
+	 */
+
+	angular.module('vnfmarket', [
+		'ngResource',
+		'ngAria',
+		 'ngMaterial',
+		'ngMdIcons',
+		'ngCookies',
+		'ngAnimate',
+		'ngSanitize',
+		'ui.router',
+		'home',
+		'user',
+		'marketplace',
+		'about',
+	]);
+
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/assets/images/open_o_diagram.png b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/assets/images/open_o_diagram.png
new file mode 100644
index 00000000..676a6bf8
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/assets/images/open_o_diagram.png
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/about/about-test.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/about/about-test.js
new file mode 100644
index 00000000..04fe198f
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/about/about-test.js
@@ -0,0 +1,48 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function () {
+	'use strict';
+
+	/**
+	 * @ngdoc function
+	 * @name app.test:aboutTest
+	 * @description
+	 * # aboutTest
+	 * Test of the app
+	 */
+
+	describe('about test', function () {
+		var controller = null, $scope = null;
+
+		beforeEach(function () {
+			module('vnfmarket');
+		});
+
+		beforeEach(inject(function ($controller, $rootScope) {
+			$scope = $rootScope.$new();
+			controller = $controller('AboutCtrl', {
+				$scope: $scope
+			});
+		}));
+
+		it('Should controller must be defined', function () {
+			expect(controller).toBeDefined();
+		});
+
+	});
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/about/about.html b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/about/about.html
new file mode 100644
index 00000000..7ee0c1bf
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/about/about.html
@@ -0,0 +1,91 @@
+<!--
+  Copyright 2016-2017 Huawei Technologies Co., Ltd.
+ 
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+      http://www.apache.org/licenses/LICENSE-2.0
+ 
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+-->
+<div class="md-padding" flex layout-sm="column">
+    <md-card>
+        <md-card-content>
+            <h2 class="md-title">Welcome to Open-O.</h2>
+        </md-card-content>
+    </md-card>
+    <!-- Start About Page -->
+    <md-card>
+    	<md-card-content>
+    		<div class="row">
+                <div class="col-md-4">
+                  <a href="#" data-toggle="modal" data-target="#open-o-diagram">
+                    <img class="img-responsive" src="app/assets/images/open_o_diagram.png" alt="open o Architecture">
+                  </a>
+                </div>
+                <div class="col-md-8">
+                  <div class="row">
+                      <div class="col-md-12 content clearfix">
+                        <div class="editContent">
+                          <h1>Open Orchestrator Project (OPEN-O)</h1>
+                          <h3>Any Service Over Any Network</h3>
+                        </div>
+                        <div class="editContent">
+                          <p class="lead">OPEN-O is seeking to offer network operators an incremental path to transform their networks, and OSS/BSS, through adoption of SDN and NFV without scrapping the vast investments in existing equipment and technologies.</p>
+                        </div>
+
+                      </div>
+
+                   </div><!-- /.row-->
+                </div>
+              </div>
+                <div class="col-md-12">
+                  <div class="row pad15">
+                    <div class="col-xs-2">
+                      <span class="fa fa-rocket fa-4x"></span>
+                    </div>
+                    <div class="col-xs-10">
+                      <div class="editContent">
+                        <h3>Mission</h3>
+                      </div>
+                      <div class="editContent">
+                        <p>The mission of the OPEN-Orchestrator Project (OPEN-O) is to: enable end-to-end service agility across SDN, NFV, and legacy networks via a unified orchestration platform supporting NFV orchestration (NFVO and VNFM) and SDN orchestration.</p>
+                      </div>
+                    </div>
+                  </div><!-- /.row -->
+                  <div class="row pad15">
+                    <div class="col-xs-2">
+                      <span class="fa fa-users fa-4x"></span>
+                    </div>
+                    <div class="col-xs-10">
+                      <div class="editContent">
+                        <h3>Target Customers.</h3>
+                      </div>
+                      <div class="editContent">
+                        <p>OPEN-O is targeting the world’s most important and innovative telecommunications and cable operators, and the OEMs, systems integrators, and software firms who support them.</p>
+                      </div>
+                    </div>
+                  </div><!-- /.row -->
+                  <div class="row pad15">
+                    <div class="col-xs-2">
+                      <span class="fa fa-object-group fa-4x"></span>
+                    </div>
+                    <div class="col-xs-10">
+                      <div class="editContent">
+                        <h3>OPEN-O Architecture.</h3>
+                      </div>
+                      <div class="editContent">
+                        <p>The OPEN-O Architecture (shown in the Figure ), enables operators to orchestrate end-to- end composite services, leveraging virtualized (and physical network functions), and SDN and legacy connectivity services. The model-driven service framework uses standard modeling languages including TOSCA and YANG, and a modular approach to integrate with MANO building blocks (such as VIMs and VNFMs), along with Connectivity Services Management, including SDN Controllers, EMS’ and NMS’.</p>
+                      </div>
+                    </div>
+                  </div><!-- /.row -->
+                </div>
+    	</md-card-content>
+    </md-card>
+    <!-- End About Page -->
+</div>
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/about/aboutCtrl.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/about/aboutCtrl.js
new file mode 100644
index 00000000..c2f097e3
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/about/aboutCtrl.js
@@ -0,0 +1,47 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function() {
+	'use strict';
+
+	/**
+	* @ngdoc function
+	* @name app.controller:aboutCtrl
+	* @description
+	* # aboutCtrl
+	* Controller of the app
+	*/
+
+  	angular
+		.module('about')
+		.controller('AboutCtrl', About);
+
+		About.$inject = [];
+
+		/*
+		* recommend
+		* Using function declarations
+		* and bindable members up top.
+		*/
+
+		function About() {
+			/*jshint validthis: true */
+			var vm = this;
+
+		}
+
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/about/aboutModule.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/about/aboutModule.js
new file mode 100644
index 00000000..be524046
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/about/aboutModule.js
@@ -0,0 +1,31 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function () {
+	'use strict';
+
+	/**
+	 * @ngdoc function
+	 * @name app.module:aboutModule
+	 * @description
+	 * # aboutModule
+	 * Module of the app
+	 */
+
+  	angular.module('about', []);
+
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/about/aboutRoute.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/about/aboutRoute.js
new file mode 100644
index 00000000..50fb7b2b
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/about/aboutRoute.js
@@ -0,0 +1,40 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+'use strict';
+
+/**
+ * @ngdoc function
+ * @name app.route:aboutRoute
+ * @description
+ * # aboutRoute
+ * Route of the app
+ */
+
+angular.module('about')
+	.config(['$stateProvider', function ($stateProvider) {
+
+		$stateProvider
+			.state('home.about', {
+				url:'/about',
+				templateUrl: 'app/modules/about/about.html',
+				controller: 'AboutCtrl',
+				controllerAs: 'vm'
+			});
+
+
+	}]);
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/about/aboutService.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/about/aboutService.js
new file mode 100644
index 00000000..fb8770c5
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/about/aboutService.js
@@ -0,0 +1,41 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function() {
+	'use strict';
+
+	/**
+	 * @ngdoc function
+	 * @name app.service:aboutService
+	 * @description
+	 * # aboutService
+	 * Service of the app
+	 */
+
+  	angular
+		.module('about')
+		.factory('AboutService', About);
+		// Inject your dependencies as .$inject = ['$http', 'someSevide'];
+		// function Name ($http, someSevide) {...}
+
+		About.$inject = ['$http'];
+
+		function About ($http) {
+
+		}
+
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/dashboard.html b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/dashboard.html
new file mode 100644
index 00000000..b048c381
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/dashboard.html
@@ -0,0 +1,100 @@
+<!--
+  Copyright 2016-2017 Huawei Technologies Co., Ltd.
+ 
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+      http://www.apache.org/licenses/LICENSE-2.0
+ 
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+-->
+<div class="md-padding" flex layout-sm="column">
+    <md-card class="text-center">
+        <md-card-content>
+            <h1>{{ vm.title }}</h1>
+            <h3>{{ vm.version }}</h3>
+            <p>An Online MarketPlace (or online e-commerce marketplace) is a type of a e-commarce site where product of service information is proviced by multiple third parties,whereas transactions are processed by the marketplace operator.</p>
+            <br>
+            <md-divider class="margin-top-20"></md-divider>
+            <!-- <h1 class="margin-top-50">Features</h1>
+            <ul>
+                <li class=" text-center" ng-repeat="item in vm.listFeatures">
+                    <p><ng-md-icon icon="check"></ng-md-icon> {{item.feature}}</p>
+                </li>
+            </ul> -->
+        </md-card-content>
+    </md-card>
+    <!-- Start About Page -->
+    <md-card>
+        <md-card-content>
+            <div class="row">
+                <div class="col-md-4">
+                  <a href="#" data-toggle="modal" data-target="#open-o-diagram">
+                    <img class="img-responsive" src="app/assets/images/open_o_diagram.png" alt="open o Architecture">
+                  </a>
+                </div>
+                <div class="col-md-8">
+                  <div class="row">
+                      <div class="col-md-12 content clearfix">
+                        <div class="editContent">
+                          <h1>Open Orchestrator Project (OPEN-O)</h1>
+                          <h3>Any Service Over Any Network</h3>
+                        </div>
+                        <div class="editContent">
+                          <p class="lead">OPEN-O is seeking to offer network operators an incremental path to transform their networks, and OSS/BSS, through adoption of SDN and NFV without scrapping the vast investments in existing equipment and technologies.</p>
+                        </div>
+
+                      </div>
+
+                   </div><!-- /.row-->
+                </div>
+              </div>
+                <div class="col-md-12">
+                  <div class="row pad15">
+                    <div class="col-xs-2">
+                      <span class="fa fa-rocket fa-4x"></span>
+                    </div>
+                    <div class="col-xs-10">
+                      <div class="editContent">
+                        <h3>Mission</h3>
+                      </div>
+                      <div class="editContent">
+                        <p>The mission of the OPEN-Orchestrator Project (OPEN-O) is to: enable end-to-end service agility across SDN, NFV, and legacy networks via a unified orchestration platform supporting NFV orchestration (NFVO and VNFM) and SDN orchestration.</p>
+                      </div>
+                    </div>
+                  </div><!-- /.row -->
+                  <div class="row pad15">
+                    <div class="col-xs-2">
+                      <span class="fa fa-users fa-4x"></span>
+                    </div>
+                    <div class="col-xs-10">
+                      <div class="editContent">
+                        <h3>Target Customers.</h3>
+                      </div>
+                      <div class="editContent">
+                        <p>OPEN-O is targeting the world’s most important and innovative telecommunications and cable operators, and the OEMs, systems integrators, and software firms who support them.</p>
+                      </div>
+                    </div>
+                  </div><!-- /.row -->
+                  <div class="row pad15">
+                    <div class="col-xs-2">
+                      <span class="fa fa-object-group fa-4x"></span>
+                    </div>
+                    <div class="col-xs-10">
+                      <div class="editContent">
+                        <h3>OPEN-O Architecture.</h3>
+                      </div>
+                      <div class="editContent">
+                        <p>The OPEN-O Architecture (shown in the Figure ), enables operators to orchestrate end-to- end composite services, leveraging virtualized (and physical network functions), and SDN and legacy connectivity services. The model-driven service framework uses standard modeling languages including TOSCA and YANG, and a modular approach to integrate with MANO building blocks (such as VIMs and VNFMs), along with Connectivity Services Management, including SDN Controllers, EMS’ and NMS’.</p>
+                      </div>
+                    </div>
+                  </div><!-- /.row -->
+                </div>
+        </md-card-content>
+    </md-card>
+</div>
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/home-test.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/home-test.js
new file mode 100644
index 00000000..cc9157ff
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/home-test.js
@@ -0,0 +1,55 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function () {
+	'use strict';
+
+	/**
+	* @ngdoc function
+	* @name app.test:homeTest
+	* @description
+	* # homeTest
+	* Test of the app
+	*/
+
+	describe('homeCtrl', function () {
+		var controller = null, $scope = null, $location;
+
+		beforeEach(function () {
+			module('vnfmarket');
+		});
+
+		beforeEach(inject(function ($controller, $rootScope, _$location_) {
+			$scope = $rootScope.$new();
+			$location = _$location_;
+
+			controller = $controller('HomeCtrl', {
+				$scope: $scope
+			});
+		}));
+
+		it('Should HomeCtrl must be defined', function () {
+			expect(controller).toBeDefined();
+		});
+
+		it('Should match the path Module name', function () {
+			$location.path('/home');
+			expect($location.path()).toBe('/home');
+		});
+
+	});
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/home.html b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/home.html
new file mode 100644
index 00000000..2ba4d768
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/home.html
@@ -0,0 +1,108 @@
+<!--
+  Copyright 2016-2017 Huawei Technologies Co., Ltd.
+ 
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+      http://www.apache.org/licenses/LICENSE-2.0
+ 
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+-->
+<md-sidenav layout="column" class="md-sidenav-left md-whiteframe-z2" md-component-id="left" md-is-locked-open="$mdMedia('gt-md')">
+    <div ng-controller="SidenavCtrl as vm" ng-cloak>
+        <md-toolbar class="md-tall md-hue-2">
+            <div layout="column" class="md-toolbar-tools-bottom inset">
+                <div layout="row">
+                    <div flex="80" style="margin-top: 10px;">
+                        <div>VNF Marketplace</div>
+                    </div>
+                </div>
+            </div>
+        </md-toolbar>
+        <md-list>
+            <md-list-item ui-sref="home.dashboard">
+                <div class="inset">
+                    <ng-md-icon icon="apps"></ng-md-icon>
+                </div>
+                <p> Dashboard </p>
+            </md-list-item>
+            <md-list-item ng-repeat="item in vm.menu" ng-click="vm.navigateTo('home.' + item.link)">
+                <div class="inset" ng-show="item.icon">
+                    <ng-md-icon icon="{{item.icon}}"></ng-md-icon>
+                </div>
+                <p > {{ item.name }}</p>
+            </md-list-item>
+            <md-divider></md-divider>
+            <md-subheader>Admin</md-subheader>
+            <md-list-item ng-repeat="item in vm.admin" ng-click="vm.showSettingsBottom($event)" >
+                <div class="inset">
+                    <ng-md-icon icon="{{item.icon}}"></ng-md-icon>
+                </div>
+                <p> {{ item.title }}</p>
+            </md-list-item>
+        </md-list>
+    </div>
+</md-sidenav>
+
+<div layout="column" class="relative" layout-fill role="main" ng-controller="LayoutCtrl as layout" ng-cloak>
+    <md-toolbar ng-show="!showSearch">
+        <div class="md-toolbar-tools">
+            <md-button ng-click="layout.toggleSidenav('left')" hide-gt-md aria-label="Menu">
+                <ng-md-icon icon="menu"></ng-md-icon>
+            </md-button>
+            <h3>VNF Marketplace</h3>
+            <span flex></span>
+            <md-button aria-label="Search" ng-click="showSearch = !showSearch">
+                <ng-md-icon icon="search"></ng-md-icon>
+            </md-button>
+            <md-menu>
+                <md-button aria-label="Open Settings" ng-click="layout.openMenu($mdOpenMenu, $event)">
+                    <md-icon> more_vert </md-icon>
+                </md-button>
+                <md-menu-content width="4">
+                    <md-menu-item>
+                        <md-button ng-click="layout.changeProfile($event)">
+                            <md-icon>face</md-icon>
+                            Profile
+                        </md-button>
+                    </md-menu-item>
+                    <md-menu-item>
+                        <md-button ng-click="layout.changePassword()">
+                            <md-icon>lock</md-icon>
+                            Password
+                        </md-button>
+                    </md-menu-item>
+                    <md-menu-divider></md-menu-divider>
+                    <md-menu-item>
+                        <md-button ng-click="layout.logOut()">
+                            <md-icon>power_settings_new</md-icon>
+                            Logout
+                        </md-button>
+                    </md-menu-item>
+                </md-menu-content>
+            </md-menu>
+        </div>
+    </md-toolbar>
+    <md-toolbar class="md-hue-1" ng-show="showSearch">
+        <div class="md-toolbar-tools">
+            <md-button ng-click="showSearch = !showSearch" aria-label="Back">
+                <ng-md-icon icon="arrow_back"></ng-md-icon>
+            </md-button>
+            <h3 flex="10">
+                Back
+            </h3>
+            <md-input-container md-theme="input" flex>
+                <label>&nbsp;</label>
+                <input ng-model="search.who" placeholder="Search ...">
+            </md-input-container>
+        </div>
+    </md-toolbar>
+    <md-content layout="column" flex md-scroll-y style="background-color:#DCDCDC">
+        <div ui-view></div>
+    </md-content>
+</div>
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/homeCtrl.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/homeCtrl.js
new file mode 100644
index 00000000..a4b88aa0
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/homeCtrl.js
@@ -0,0 +1,51 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function () {
+	'use strict';
+
+	/**
+	* @ngdoc function
+	* @name app.controller:HomeCtrl
+	* @description
+	* # HomeCtrl
+	* Controller of the app
+	*/
+
+	angular
+		.module('vnfmarket')
+		.controller('HomeCtrl', Home);
+
+	Home.$inject = ['homeService'];
+
+	/*
+	* recommend
+	* Using function declarations
+	* and bindable members up top.
+	*/
+
+	function Home(homeService) {
+		/*jshint validthis: true */
+		var vm = this;
+		vm.title = "Welcome to VNF Marketplace!";
+		vm.version = "1.0.0";
+		vm.listFeatures = homeService.getFeaturesList();
+		console.log(vm.listFeatures);
+
+	}
+
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/homeModule.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/homeModule.js
new file mode 100644
index 00000000..93624644
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/homeModule.js
@@ -0,0 +1,30 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function() {
+	'use strict';
+
+	/**
+	* @ngdoc function
+	* @name app.module:homeModule
+	* @description
+	* # homeModule
+	* Module of the app
+	*/
+
+	angular.module('home', []);
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/homeRoute.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/homeRoute.js
new file mode 100644
index 00000000..286d1ae3
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/homeRoute.js
@@ -0,0 +1,44 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+'use strict';
+
+	/**
+	* @ngdoc function
+	* @name app.route:HomeRoute
+	* @description
+	* # HomeRoute
+	* Route of the app
+	*/
+
+angular.module('vnfmarket')
+	.config(['$stateProvider', function ($stateProvider) {
+		$stateProvider
+
+			.state('home', {
+				url: '',
+				abstract: true,
+				templateUrl: 'app/modules/home/home.html',
+				controller: 'HomeCtrl',
+				controllerAs: 'vm'
+			})
+			.state('home.dashboard', {
+				url:'/dashboard',
+				templateUrl: 'app/modules/home/dashboard.html'
+			});
+
+	}]);
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/homeService.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/homeService.js
new file mode 100644
index 00000000..fb3ea3c0
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/home/homeService.js
@@ -0,0 +1,754 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function () {
+	'use strict';
+
+	/**
+	* @ngdoc function
+	* @name app.service:homeService
+	* @description
+	* # homeService
+	* Service of the app
+	*/
+
+	angular.module('vnfmarket')
+		.factory('homeService', homeService);
+
+	homeService.$inject = ['$http'];
+
+	function homeService($http) {
+
+		/*var list = [
+			{"feature": "Implemented Best Practices, following: John Papa's Guide"},
+			{"feature": "Using Controller AS syntax"},
+			{"feature": "Wrap Angular components in an Immediately Invoked Function Expression (IIFE)"},
+			{"feature": "Declare modules without a variable using the setter syntax"},
+			{"feature": "Using named functions"},
+			{"feature": "Including Unit test with Karma"},
+			{"feature": "Including UI options for Bootstrap or Angular-Material"},
+			{"feature": "Including Angular-Material-Icons for Angular-Material UI"},
+			{"feature": "Dynamic Menu generator for both themes"},
+			{"feature": "Grunt task for Production and Development"}
+		];*/
+		var services = [
+        {
+          "name": "vEPC",
+          "vendor": "Huawei",
+          "date": "2016-11-21 23:06",
+          "desc": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed interdum fringilla laoreet. Nulla facilisi. Maecenas consequat tristique odio, in consectetur leo volutpat vitae. Ut porttitor iaculis metus sed tincidunt. Etiam facilisis nec nisi at tempus. Curabitur ultrices molestie dictum. Integer placerat varius lorem, id cursus augue vulputate quis. Nulla pulvinar vel nunc vel lacinia. Aliquam eleifend, ipsum in sodales dictum, mi risus dictum est, non hendrerit neque elit et turpis. Integer lacus massa, pulvinar eget porttitor vel, ultrices in elit. Ut convallis semper gravida. Sed mollis leo est, eget consectetur dui vestibulum a. Phasellus non augue id diam malesuada ultrices. Praesent id nunc vehicula, dapibus quam in, rhoncus lorem. Praesent mattis elit a ex elementum, vel imperdiet risus tempor. Aliquam laoreet mauris nec egestas eleifend.",
+          "downloads": 20,
+          "type":"gs-o",
+          "size":"204800",
+          "down_history":[
+            {
+              "user":"user_001",
+              "time": "2016-11-30 17:31"
+            },
+            {
+              "user":"user_002",
+              "time": "2016-11-30 14:31"
+            },
+            {
+              "user":"user_003",
+              "time": "2016-11-30 11:01"
+            },
+            {
+              "user":"user_004",
+              "time": "2016-11-30 10:03"
+            },
+            {
+              "user":"user_005",
+              "time": "2016-11-30 00:31"
+            },
+            {
+              "user":"user_006",
+              "time": "2016-11-29 19:32"
+            },
+            {
+              "user":"user_007",
+              "time": "2016-11-28 20:31"
+            },
+            {
+              "user":"user_008",
+              "time": "2016-11-20 09:11"
+            }
+          ],
+          "upl_history":[
+            {
+              "user":"user_001",
+              "time": "2016-11-30 15:31"
+            },
+            {
+              "user":"user_002",
+              "time": "2016-11-30 14:31"
+            },
+            {
+              "user":"user_003",
+              "time": "2016-11-30 11:01"
+            },
+            {
+              "user":"user_004",
+              "time": "2016-11-30 14:03"
+            },
+            {
+              "user":"user_005",
+              "time": "2016-11-30 10:31"
+            },
+            {
+              "user":"user_006",
+              "time": "2016-11-29 19:12"
+            },
+            {
+              "user":"user_007",
+              "time": "2016-11-28 02:31"
+            },
+            {
+              "user":"user_008",
+              "time": "2016-11-20 09:11"
+            }
+          ]
+        },
+        {
+          "name": "vFirewall",
+          "vendor": "Huawei",
+          "date": "2016-11-23 22:09",
+          "desc": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed interdum fringilla laoreet. Nulla facilisi. Maecenas consequat tristique odio, in consectetur leo volutpat vitae. Ut porttitor iaculis metus sed tincidunt. Etiam facilisis nec nisi at tempus. Curabitur ultrices molestie dictum. Integer placerat varius lorem, id cursus augue vulputate quis. Nulla pulvinar vel nunc vel lacinia. Aliquam eleifend, ipsum in sodales dictum, mi risus dictum est, non hendrerit neque elit et turpis. Integer lacus massa, pulvinar eget porttitor vel, ultrices in elit. Ut convallis semper gravida. Sed mollis leo est, eget consectetur dui vestibulum a. Phasellus non augue id diam malesuada ultrices. Praesent id nunc vehicula, dapibus quam in, rhoncus lorem. Praesent mattis elit a ex elementum, vel imperdiet risus tempor. Aliquam laoreet mauris nec egestas eleifend.",
+          "downloads": 25,
+          "type":"gs-o",
+          "size":"204800",
+          "down_history":[
+            {
+              "user":"user_001",
+              "time": "2016-11-30 17:31"
+            },
+            {
+              "user":"user_002",
+              "time": "2016-11-30 14:31"
+            },
+            {
+              "user":"user_003",
+              "time": "2016-11-30 11:01"
+            },
+            {
+              "user":"user_004",
+              "time": "2016-11-30 10:03"
+            },
+            {
+              "user":"user_005",
+              "time": "2016-11-30 00:31"
+            },
+            {
+              "user":"user_006",
+              "time": "2016-11-29 19:32"
+            },
+            {
+              "user":"user_007",
+              "time": "2016-11-28 20:31"
+            },
+            {
+              "user":"user_008",
+              "time": "2016-11-20 09:11"
+            }
+          ],
+          "upl_history":[
+            {
+              "user":"user_001",
+              "time": "2016-11-30 15:31"
+            },
+            {
+              "user":"user_002",
+              "time": "2016-11-30 14:31"
+            },
+            {
+              "user":"user_003",
+              "time": "2016-11-30 11:01"
+            },
+            {
+              "user":"user_004",
+              "time": "2016-11-30 14:03"
+            },
+            {
+              "user":"user_005",
+              "time": "2016-11-30 10:31"
+            },
+            {
+              "user":"user_006",
+              "time": "2016-11-29 19:12"
+            },
+            {
+              "user":"user_007",
+              "time": "2016-11-28 02:31"
+            },
+            {
+              "user":"user_008",
+              "time": "2016-11-20 09:11"
+            }
+          ]
+        },
+        {
+          "name": "vIMS",
+          "vendor": "Huawei",
+          "date": "2016-10-21 12:04",
+          "desc": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed interdum fringilla laoreet. Nulla facilisi. Maecenas consequat tristique odio, in consectetur leo volutpat vitae. Ut porttitor iaculis metus sed tincidunt. Etiam facilisis nec nisi at tempus. Curabitur ultrices molestie dictum. Integer placerat varius lorem, id cursus augue vulputate quis. Nulla pulvinar vel nunc vel lacinia. Aliquam eleifend, ipsum in sodales dictum, mi risus dictum est, non hendrerit neque elit et turpis. Integer lacus massa, pulvinar eget porttitor vel, ultrices in elit. Ut convallis semper gravida. Sed mollis leo est, eget consectetur dui vestibulum a. Phasellus non augue id diam malesuada ultrices. Praesent id nunc vehicula, dapibus quam in, rhoncus lorem. Praesent mattis elit a ex elementum, vel imperdiet risus tempor. Aliquam laoreet mauris nec egestas eleifend.",
+          "downloads": 10,
+          "type":"sdn-o",
+          "size":"104800",
+          "down_history":[
+            {
+              "user":"user_001",
+              "time": "2016-11-30 17:31"
+            },
+            {
+              "user":"user_002",
+              "time": "2016-11-30 14:31"
+            },
+            {
+              "user":"user_003",
+              "time": "2016-11-30 11:01"
+            },
+            {
+              "user":"user_004",
+              "time": "2016-11-30 10:03"
+            },
+            {
+              "user":"user_005",
+              "time": "2016-11-30 00:31"
+            },
+            {
+              "user":"user_006",
+              "time": "2016-11-29 19:32"
+            },
+            {
+              "user":"user_007",
+              "time": "2016-11-28 20:31"
+            },
+            {
+              "user":"user_008",
+              "time": "2016-11-20 09:11"
+            }
+          ],
+          "upl_history":[
+            {
+              "user":"user_001",
+              "time": "2016-11-30 15:31"
+            },
+            {
+              "user":"user_002",
+              "time": "2016-11-30 14:31"
+            },
+            {
+              "user":"user_003",
+              "time": "2016-11-30 11:01"
+            },
+            {
+              "user":"user_004",
+              "time": "2016-11-30 14:03"
+            },
+            {
+              "user":"user_005",
+              "time": "2016-11-30 10:31"
+            },
+            {
+              "user":"user_006",
+              "time": "2016-11-29 19:12"
+            },
+            {
+              "user":"user_007",
+              "time": "2016-11-28 02:31"
+            },
+            {
+              "user":"user_008",
+              "time": "2016-11-20 09:11"
+            }
+          ]
+        },
+        {
+          "name": "vLoadbalance",
+          "vendor": "ZTE",
+          "date": "2016-11-20 05:06",
+          "desc": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed interdum fringilla laoreet. Nulla facilisi. Maecenas consequat tristique odio, in consectetur leo volutpat vitae. Ut porttitor iaculis metus sed tincidunt. Etiam facilisis nec nisi at tempus. Curabitur ultrices molestie dictum. Integer placerat varius lorem, id cursus augue vulputate quis. Nulla pulvinar vel nunc vel lacinia. Aliquam eleifend, ipsum in sodales dictum, mi risus dictum est, non hendrerit neque elit et turpis. Integer lacus massa, pulvinar eget porttitor vel, ultrices in elit. Ut convallis semper gravida. Sed mollis leo est, eget consectetur dui vestibulum a. Phasellus non augue id diam malesuada ultrices. Praesent id nunc vehicula, dapibus quam in, rhoncus lorem. Praesent mattis elit a ex elementum, vel imperdiet risus tempor. Aliquam laoreet mauris nec egestas eleifend.",
+          "downloads": 319,
+          "type":"sdn-o",
+          "size":"204800",
+          "down_history":[
+            {
+              "user":"user_001",
+              "time": "2016-11-30 17:31"
+            },
+            {
+              "user":"user_002",
+              "time": "2016-11-30 14:31"
+            },
+            {
+              "user":"user_003",
+              "time": "2016-11-30 11:01"
+            },
+            {
+              "user":"user_004",
+              "time": "2016-11-30 10:03"
+            },
+            {
+              "user":"user_005",
+              "time": "2016-11-30 00:31"
+            },
+            {
+              "user":"user_006",
+              "time": "2016-11-29 19:32"
+            },
+            {
+              "user":"user_007",
+              "time": "2016-11-28 20:31"
+            },
+            {
+              "user":"user_008",
+              "time": "2016-11-20 09:11"
+            }
+          ],
+          "upl_history":[
+            {
+              "user":"user_001",
+              "time": "2016-11-30 15:31"
+            },
+            {
+              "user":"user_002",
+              "time": "2016-11-30 14:31"
+            },
+            {
+              "user":"user_003",
+              "time": "2016-11-30 11:01"
+            },
+            {
+              "user":"user_004",
+              "time": "2016-11-30 14:03"
+            },
+            {
+              "user":"user_005",
+              "time": "2016-11-30 10:31"
+            },
+            {
+              "user":"user_006",
+              "time": "2016-11-29 19:12"
+            },
+            {
+              "user":"user_007",
+              "time": "2016-11-28 02:31"
+            },
+            {
+              "user":"user_008",
+              "time": "2016-11-20 09:11"
+            }
+          ]
+        },
+        {
+          "name": "vCPE",
+          "vendor": "ZTE",
+          "date": "2016-11-03 23:06",
+          "desc": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed interdum fringilla laoreet. Nulla facilisi. Maecenas consequat tristique odio, in consectetur leo volutpat vitae. Ut porttitor iaculis metus sed tincidunt. Etiam facilisis nec nisi at tempus. Curabitur ultrices molestie dictum. Integer placerat varius lorem, id cursus augue vulputate quis. Nulla pulvinar vel nunc vel lacinia. Aliquam eleifend, ipsum in sodales dictum, mi risus dictum est, non hendrerit neque elit et turpis. Integer lacus massa, pulvinar eget porttitor vel, ultrices in elit. Ut convallis semper gravida. Sed mollis leo est, eget consectetur dui vestibulum a. Phasellus non augue id diam malesuada ultrices. Praesent id nunc vehicula, dapibus quam in, rhoncus lorem. Praesent mattis elit a ex elementum, vel imperdiet risus tempor. Aliquam laoreet mauris nec egestas eleifend.",
+          "downloads": 234,
+          "type":"nfv-o",
+          "size":"204800",
+          "down_history":[
+            {
+              "user":"user_001",
+              "time": "2016-11-30 17:31"
+            },
+            {
+              "user":"user_002",
+              "time": "2016-11-30 14:31"
+            },
+            {
+              "user":"user_003",
+              "time": "2016-11-30 11:01"
+            },
+            {
+              "user":"user_004",
+              "time": "2016-11-30 10:03"
+            },
+            {
+              "user":"user_005",
+              "time": "2016-11-30 00:31"
+            },
+            {
+              "user":"user_006",
+              "time": "2016-11-29 19:32"
+            },
+            {
+              "user":"user_007",
+              "time": "2016-11-28 20:31"
+            },
+            {
+              "user":"user_008",
+              "time": "2016-11-20 09:11"
+            }
+          ],
+          "upl_history":[
+            {
+              "user":"user_001",
+              "time": "2016-11-30 15:31"
+            },
+            {
+              "user":"user_002",
+              "time": "2016-11-30 14:31"
+            },
+            {
+              "user":"user_003",
+              "time": "2016-11-30 11:01"
+            },
+            {
+              "user":"user_004",
+              "time": "2016-11-30 14:03"
+            },
+            {
+              "user":"user_005",
+              "time": "2016-11-30 10:31"
+            },
+            {
+              "user":"user_006",
+              "time": "2016-11-29 19:12"
+            },
+            {
+              "user":"user_007",
+              "time": "2016-11-28 02:31"
+            },
+            {
+              "user":"user_008",
+              "time": "2016-11-20 09:11"
+            }
+          ]
+        },
+        {
+          "name": "openimscore",
+          "vendor": "Intel",
+          "date": "2016-11-20 17:06",
+          "desc": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed interdum fringilla laoreet. Nulla facilisi. Maecenas consequat tristique odio, in consectetur leo volutpat vitae. Ut porttitor iaculis metus sed tincidunt. Etiam facilisis nec nisi at tempus. Curabitur ultrices molestie dictum. Integer placerat varius lorem, id cursus augue vulputate quis. Nulla pulvinar vel nunc vel lacinia. Aliquam eleifend, ipsum in sodales dictum, mi risus dictum est, non hendrerit neque elit et turpis. Integer lacus massa, pulvinar eget porttitor vel, ultrices in elit. Ut convallis semper gravida. Sed mollis leo est, eget consectetur dui vestibulum a. Phasellus non augue id diam malesuada ultrices. Praesent id nunc vehicula, dapibus quam in, rhoncus lorem. Praesent mattis elit a ex elementum, vel imperdiet risus tempor. Aliquam laoreet mauris nec egestas eleifend.",
+          "downloads": 45,
+          "type":"nfv-o",
+          "size":"204800",
+          "down_history":[
+            {
+              "user":"user_001",
+              "time": "2016-11-30 17:31"
+            },
+            {
+              "user":"user_002",
+              "time": "2016-11-30 14:31"
+            },
+            {
+              "user":"user_003",
+              "time": "2016-11-30 11:01"
+            },
+            {
+              "user":"user_004",
+              "time": "2016-11-30 10:03"
+            },
+            {
+              "user":"user_005",
+              "time": "2016-11-30 00:31"
+            },
+            {
+              "user":"user_006",
+              "time": "2016-11-29 19:32"
+            },
+            {
+              "user":"user_007",
+              "time": "2016-11-28 20:31"
+            },
+            {
+              "user":"user_008",
+              "time": "2016-11-20 09:11"
+            }
+          ],
+          "upl_history":[
+            {
+              "user":"user_001",
+              "time": "2016-11-30 15:31"
+            },
+            {
+              "user":"user_002",
+              "time": "2016-11-30 14:31"
+            },
+            {
+              "user":"user_003",
+              "time": "2016-11-30 11:01"
+            },
+            {
+              "user":"user_004",
+              "time": "2016-11-30 14:03"
+            },
+            {
+              "user":"user_005",
+              "time": "2016-11-30 10:31"
+            },
+            {
+              "user":"user_006",
+              "time": "2016-11-29 19:12"
+            },
+            {
+              "user":"user_007",
+              "time": "2016-11-28 02:31"
+            },
+            {
+              "user":"user_008",
+              "time": "2016-11-20 09:11"
+            }
+          ]
+        },
+        {
+          "name": "openims",
+          "vendor": "Intel",
+          "date": "2016-11-20 12:06",
+          "desc": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed interdum fringilla laoreet. Nulla facilisi. Maecenas consequat tristique odio, in consectetur leo volutpat vitae. Ut porttitor iaculis metus sed tincidunt. Etiam facilisis nec nisi at tempus. Curabitur ultrices molestie dictum. Integer placerat varius lorem, id cursus augue vulputate quis. Nulla pulvinar vel nunc vel lacinia. Aliquam eleifend, ipsum in sodales dictum, mi risus dictum est, non hendrerit neque elit et turpis. Integer lacus massa, pulvinar eget porttitor vel, ultrices in elit. Ut convallis semper gravida. Sed mollis leo est, eget consectetur dui vestibulum a. Phasellus non augue id diam malesuada ultrices. Praesent id nunc vehicula, dapibus quam in, rhoncus lorem. Praesent mattis elit a ex elementum, vel imperdiet risus tempor. Aliquam laoreet mauris nec egestas eleifend.",
+          "downloads": 21,
+          "type":"sdn-o",
+          "size":"204800",
+          "down_history":[
+            {
+              "user":"user_001",
+              "time": "2016-11-30 17:31"
+            },
+            {
+              "user":"user_002",
+              "time": "2016-11-30 14:31"
+            },
+            {
+              "user":"user_003",
+              "time": "2016-11-30 11:01"
+            },
+            {
+              "user":"user_004",
+              "time": "2016-11-30 10:03"
+            },
+            {
+              "user":"user_005",
+              "time": "2016-11-30 00:31"
+            },
+            {
+              "user":"user_006",
+              "time": "2016-11-29 19:32"
+            },
+            {
+              "user":"user_007",
+              "time": "2016-11-28 20:31"
+            },
+            {
+              "user":"user_008",
+              "time": "2016-11-20 09:11"
+            }
+          ],
+          "upl_history":[
+            {
+              "user":"user_001",
+              "time": "2016-11-30 15:31"
+            },
+            {
+              "user":"user_002",
+              "time": "2016-11-30 14:31"
+            },
+            {
+              "user":"user_003",
+              "time": "2016-11-30 11:01"
+            },
+            {
+              "user":"user_004",
+              "time": "2016-11-30 14:03"
+            },
+            {
+              "user":"user_005",
+              "time": "2016-11-30 10:31"
+            },
+            {
+              "user":"user_006",
+              "time": "2016-11-29 19:12"
+            },
+            {
+              "user":"user_007",
+              "time": "2016-11-28 02:31"
+            },
+            {
+              "user":"user_008",
+              "time": "2016-11-20 09:11"
+            }
+          ]
+        },
+        {
+          "name": "vCPE",
+          "vendor": "Huawei",
+          "date": "2016-11-19 23:06",
+          "desc": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed interdum fringilla laoreet. Nulla facilisi. Maecenas consequat tristique odio, in consectetur leo volutpat vitae. Ut porttitor iaculis metus sed tincidunt. Etiam facilisis nec nisi at tempus. Curabitur ultrices molestie dictum. Integer placerat varius lorem, id cursus augue vulputate quis. Nulla pulvinar vel nunc vel lacinia. Aliquam eleifend, ipsum in sodales dictum, mi risus dictum est, non hendrerit neque elit et turpis. Integer lacus massa, pulvinar eget porttitor vel, ultrices in elit. Ut convallis semper gravida. Sed mollis leo est, eget consectetur dui vestibulum a. Phasellus non augue id diam malesuada ultrices. Praesent id nunc vehicula, dapibus quam in, rhoncus lorem. Praesent mattis elit a ex elementum, vel imperdiet risus tempor. Aliquam laoreet mauris nec egestas eleifend.",
+          "downloads": 408,
+          "type":"nfv-o",
+          "size":"204800",
+          "down_history":[
+            {
+              "user":"user_001",
+              "time": "2016-11-30 17:31"
+            },
+            {
+              "user":"user_002",
+              "time": "2016-11-30 14:31"
+            },
+            {
+              "user":"user_003",
+              "time": "2016-11-30 11:01"
+            },
+            {
+              "user":"user_004",
+              "time": "2016-11-30 10:03"
+            },
+            {
+              "user":"user_005",
+              "time": "2016-11-30 00:31"
+            },
+            {
+              "user":"user_006",
+              "time": "2016-11-29 19:32"
+            },
+            {
+              "user":"user_007",
+              "time": "2016-11-28 20:31"
+            },
+            {
+              "user":"user_008",
+              "time": "2016-11-20 09:11"
+            }
+          ],
+          "upl_history":[
+            {
+              "user":"user_001",
+              "time": "2016-11-30 15:31"
+            },
+            {
+              "user":"user_002",
+              "time": "2016-11-30 14:31"
+            },
+            {
+              "user":"user_003",
+              "time": "2016-11-30 11:01"
+            },
+            {
+              "user":"user_004",
+              "time": "2016-11-30 14:03"
+            },
+            {
+              "user":"user_005",
+              "time": "2016-11-30 10:31"
+            },
+            {
+              "user":"user_006",
+              "time": "2016-11-29 19:12"
+            },
+            {
+              "user":"user_007",
+              "time": "2016-11-28 02:31"
+            },
+            {
+              "user":"user_008",
+              "time": "2016-11-20 09:11"
+            }
+          ]
+        },
+        {
+          "name": "vCPE",
+          "vendor": "Siemens",
+          "date": "2016-11-20 12:06",
+          "desc": "Dolore ex deserunt aute fugiat aute nulla ea sunt aliqua nisi cupidatat eu. Nostrud in laboris labore nisi amet do dolor eu fugiat consectetur elit cillum esse",
+          "downloads": 120,
+          "type":"sdn-o",
+          "size":"204800",
+          "down_history":[
+            {
+              "user":"user_001",
+              "time": "2016-11-30 17:31"
+            },
+            {
+              "user":"user_002",
+              "time": "2016-11-30 14:31"
+            },
+            {
+              "user":"user_003",
+              "time": "2016-11-30 11:01"
+            },
+            {
+              "user":"user_004",
+              "time": "2016-11-30 10:03"
+            },
+            {
+              "user":"user_005",
+              "time": "2016-11-30 00:31"
+            },
+            {
+              "user":"user_006",
+              "time": "2016-11-29 19:32"
+            },
+            {
+              "user":"user_007",
+              "time": "2016-11-28 20:31"
+            },
+            {
+              "user":"user_008",
+              "time": "2016-11-20 09:11"
+            }
+          ],
+          "upl_history":[
+            {
+              "user":"user_001",
+              "time": "2016-11-30 15:31"
+            },
+            {
+              "user":"user_002",
+              "time": "2016-11-30 14:31"
+            },
+            {
+              "user":"user_003",
+              "time": "2016-11-30 11:01"
+            },
+            {
+              "user":"user_004",
+              "time": "2016-11-30 14:03"
+            },
+            {
+              "user":"user_005",
+              "time": "2016-11-30 10:31"
+            },
+            {
+              "user":"user_006",
+              "time": "2016-11-29 19:12"
+            },
+            {
+              "user":"user_007",
+              "time": "2016-11-28 02:31"
+            },
+            {
+              "user":"user_008",
+              "time": "2016-11-20 09:11"
+            }
+          ]
+        }
+      ];
+
+		return {
+			getFeaturesList: getFeaturesList
+		};
+
+		function getFeaturesList() {
+			return services;
+		}
+
+	}
+
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/layouts/main-page/main-page.html b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/layouts/main-page/main-page.html
new file mode 100644
index 00000000..ec86a647
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/layouts/main-page/main-page.html
@@ -0,0 +1,76 @@
+<!--
+  Copyright 2016-2017 Huawei Technologies Co., Ltd.
+ 
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+      http://www.apache.org/licenses/LICENSE-2.0
+ 
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+-->
+    <md-toolbar ng-show="!showSearch">
+        <div class="md-toolbar-tools">
+            <md-button ng-click="layout.toggleSidenav('left')" hide-gt-md aria-label="Menu">
+                <ng-md-icon icon="menu"></ng-md-icon>
+            </md-button>
+            <h3>
+                <a href="/">vnfmarket</a>
+            </h3>
+            <span flex></span>
+            <md-button aria-label="Search" ng-click="showSearch = !showSearch">
+                <ng-md-icon icon="search"></ng-md-icon>
+            </md-button>
+            <md-menu>
+                <md-button aria-label="Open Settings" ng-click="layout.openMenu($mdOpenMenu, $event)">
+                            <md-icon> more_vert </md-icon>
+                </md-button>
+                <md-menu-content width="4">
+                    <md-menu-item>
+                        <md-button ng-click="layout.changeProfile($event)">
+                            <md-icon>face</md-icon>
+                            Profile
+                        </md-button>
+                    </md-menu-item>
+                    <md-menu-item>
+                        <md-button ng-click="layout.changePassword()">
+                            <md-icon>lock</md-icon>
+                            Password
+                        </md-button>
+                    </md-menu-item>
+                    <md-menu-divider></md-menu-divider>
+                    <md-menu-item>
+                        <md-button ng-click="layout.logOut()">
+                            <md-icon>power_settings_new</md-icon>
+                            Logout
+                        </md-button>
+                    </md-menu-item>
+                </md-menu-content>
+            </md-menu>
+        </div>
+    </md-toolbar>
+    <md-toolbar class="md-hue-1" ng-show="showSearch">
+        <div class="md-toolbar-tools">
+            <md-button ng-click="showSearch = !showSearch" aria-label="Back">
+                <ng-md-icon icon="arrow_back"></ng-md-icon>
+            </md-button>
+            <h3 flex="10">
+                Back
+            </h3>
+            <md-input-container md-theme="input" flex>
+                <label>&nbsp;</label>
+                <input ng-model="search.who" placeholder="Search ...">
+            </md-input-container>
+
+        </div>
+    </md-toolbar>
+    <md-content class="md-blue-grey-theme" flex md-scroll-y>
+        <ui-view layout="column" layout-fill layout-padding>
+
+
+        </ui-view>
+    </md-content>
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/layouts/main-page/mainPageCtrl.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/layouts/main-page/mainPageCtrl.js
new file mode 100644
index 00000000..24ae3ef2
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/layouts/main-page/mainPageCtrl.js
@@ -0,0 +1,115 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function () {
+	'use strict';
+
+	/**
+	* @ngdoc function
+	* @name app.controller:LayoutCtrl
+	* @description
+	* # LayoutCtrl
+	* Controller of the app
+	*/
+
+	angular
+		.module('vnfmarket')
+		.controller('LayoutCtrl', Layout);
+
+	Layout.$inject = ['$mdSidenav', '$cookies', '$state', '$mdToast', '$mdDialog'];
+
+	/*
+	* recommend
+	* Using function declarations
+	* and bindable members up top.
+	*/
+
+	function Layout($mdSidenav, $cookies, $state, $mdToast, $mdDialog ) {
+		/*jshint validthis: true */
+		var vm = this;
+
+		vm.toggleSidenav = function (menuId) {
+			$mdSidenav(menuId).toggle();
+		};
+
+		vm.changePassword = function () {
+			$mdToast.show(
+				$mdToast.simple()
+				.content('Password clicked!')
+				.position('top right')
+				.hideDelay(2000)
+			);
+		};
+
+		vm.changeProfile = function (ev) {
+			$mdDialog.show({
+				controller: DialogController,
+				templateUrl: 'tabDialog.tmpl.html',
+				parent: angular.element(document.body),
+				targetEvent: ev,
+				clickOutsideToClose:true
+			})
+			.then(function(answer) {
+				$mdToast.show(
+					$mdToast.simple()
+					.content('You said the information was "' + answer + '".')
+					.position('top right')
+					.hideDelay(2000)
+				);
+
+			}, function() {
+				$mdToast.show(
+					$mdToast.simple()
+					.content('You cancelled the dialog.')
+					.position('top right')
+					.hideDelay(2000)
+				);
+			});
+
+			function DialogController($scope, $mdDialog) {
+				$scope.hide = function() {
+					$mdDialog.hide();
+				};
+
+				$scope.cancel = function() {
+					$mdDialog.cancel();
+				};
+
+				$scope.answer = function(answer) {
+					$mdDialog.hide(answer);
+				};
+			}
+		};
+
+
+		vm.logOut = function () {
+
+			alert('Implement your Function Here');
+			// $cookies.put('dev_appserver_login', ' ');
+			//$state.go('out', {}, {reload: true});
+
+		};
+
+		var originatorEv;
+		vm.openMenu = function ($mdOpenMenu, ev) {
+			originatorEv = ev;
+			$mdOpenMenu(ev);
+		};
+
+	}
+
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/layouts/nav-bar/navBarService.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/layouts/nav-bar/navBarService.js
new file mode 100644
index 00000000..4fecf269
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/layouts/nav-bar/navBarService.js
@@ -0,0 +1,66 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function() {
+	'use strict';
+
+	/**
+	 * @ngdoc function
+	 * @name app.service:menuService
+	 * @description
+	 * # menuService
+	 * Service of the app
+	 */
+
+  	angular
+		.module('vnfmarket')
+		.factory('MenuService', Menu);
+		// Inject your dependencies as .$inject = ['$http', 'someSevide'];
+		// function Name ($http, someSevide) {...}
+
+		Menu.$inject = ['$http'];
+
+		function Menu ($http) {
+
+			var menu = [
+
+					{
+						link: 'user',
+							name: 'User'
+					},
+
+					{
+						link: 'marketplace',
+							name: 'Marketplace'
+					},
+
+					{
+						link: 'about',
+							name: 'About'
+					},
+
+		  	];
+
+			return {
+				listMenu: function () {
+					return menu;
+				}
+		  	}
+
+		}
+
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/layouts/side-nav/sidenav.html b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/layouts/side-nav/sidenav.html
new file mode 100644
index 00000000..9028bc06
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/layouts/side-nav/sidenav.html
@@ -0,0 +1,46 @@
+<!--
+  Copyright 2016-2017 Huawei Technologies Co., Ltd.
+ 
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+      http://www.apache.org/licenses/LICENSE-2.0
+ 
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+-->
+        <md-toolbar class="md-tall md-hue-2">
+            <div layout="column" class="md-toolbar-tools-bottom inset">
+                <div layout="row">
+                    <div flex="20">
+                        <img style="width: 36px; height: 36px; border-radius: 50%"
+                             actual-src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAUDBAsMBgkICQcJCQgGCQcGBgYFBgcHBQkGBgUHCQcGBgcHChwXBwgaCQcHGCEMGhERHxMfBxciGCIeGBAeHxIBBQUFBwcFDAgIBxIIBQgSHhISEhISHhISEhISHh4SEhISEhISEhISEhISEhISEhISEhISEhISEhISEhISEhISEv/AABEIAGAAYAMBIgACEQEDEQH/xAAcAAACAwEBAQEAAAAAAAAAAAAHCAMFBgQCAQD/xAA6EAABAgQDBQYFAQgDAQAAAAACAQMABBESBQYiByExMkETQlFSYWIIcXKBoSMzgpGSorLR8BQk4RX/xAAWAQEBAQAAAAAAAAAAAAAAAAAAAQL/xAAWEQEBAQAAAAAAAAAAAAAAAAAAARH/2gAMAwEAAhEDEQA/AG0WPx9I+RDOPIIqS+F0BVZyx5uUknZpw0RGBU9XTTCJbRs6zGI4icw66pNiRCwBUsFoVXSm7wpBF+JraOr75yDRr2LSkLpCVBMx7q06ekAFmbVCUV7yRETg4pP7y3B+YmfcRw7b6J3fNp7sRYPhrkxMCy2JEpeX/wAg97NdkjQEL02KHuG0D6FAAl3CnFqQtOKgr3RVRX3cIv8AD2Udl1lyAxcG20iFUG4e7SGvYy/Ltgggw2iD3bEivm8uS6uoX/GBFrdcI01faGGFJk5pyVnbhJW3GjuElGhad/VIcfYRtHHEJImjokzLgHaj5htp2iRgtoORWJlg9CA4IkQmA6rresCfY9i7mHZqbaKqC6RSrgFzEJlQa19YqnmU/GPKxzST1wpTjQf7Y6C9YCzJeMYra1mQJbCXSUqOECi343EOn7RsDPSvyhZfivxYhsADWggREIlu1ad6QC05mxHtZpwlJVUjMi+ojVbv49Ipe0W/0H+7uxYtYM8Uq5OtgJtMLa5aVXUu3dpZ4V6xYbOsrnPT7cu3dqISdMR5Wh5oygnfDlhaFMG6o8qW3W8ChjmJe2lOb3cvhGXy3l+Xw+TS3TYn6h8CX3LHO9tPkBPsldVLVISIh4xpWyqq+u/+rhHG/dduHqo/LzRVS2epAhEhnARfKW4rvWJix1shV1sk7MSAbxLStxaoD5ijaoBcV3W28Kwv+0PCSbxmUm03K66PL5rq7oOuPTwqFwEhXd4SSkYvMWFJMnJEttrU2yThdLL0ur9oA/5ecXsGitVFNpkv5mki2UvvEEkgoAiNEQUtbt5bB3D+I9ksBNiszawZr3RUrvaIwnXxD48B313uvl5tKNCX43Q1OfcQskHNNVMCBsB4qRpuhBNoc45/9F4Xq1E1HV0tKgjv9IlSrfIcyIybulVQQUCpyqJFXekEz4ZZFtDmnUFaitt3tMuVIHGxdgXH3mnBq2QFp9x7hgy7DcFclX5wTGjbpj2Hrq6xBqc/TAixruVvvCnFRgF5rxiVSYQBkyRT5SMKcxUhn5uSA+Iou7lIajGAzhk9tzWjQK4K/p6E3fKNKCOHygEe9qlpfLveEEzHHf8Aj5cuCo3qkWGXtnVrvbPnRSW+xOVfcsaTPuBg5hJs7lQQ/Tt8w8v3gFmHM0wswgBMm2hLaQ7zC2CfkybdZk0ecnEdR9wBbAh0jaSKVPWkU2GZaQXUvY1abdPH5+Mdue3OxGQZaoBOvkTg920RgybPBZhClWj43NgX8wJHSZxnsjTF2Fy5cbmw+1ookXarBoP9suYBZJv2XH7VtHm+dYS3PM528469uW8iK63vEVYZTbNid8/MNIKIjTdokZUERMKq4pQrOJLrIbkVLi1D1tKJUqyyDmY5KcR8BQ0pY60Y1EvLT1rDIbN8xI+0L279XVaPdK7lhTz3cPqgqbHMdtBWriuArvndEDRMTKrQkJNSR01HmXup1jL5exds2EqSItLSr0KPmP460AWm+gXppJev5jSu6YxVFNRbbv1W3CXDV0+0RYmikwfRaEP+pAj2g577AbZGZGpJc4Vur6fSKpdtF0kouCqviNpEnKXS6njAELD3hW8TFO0aXmLzf4gRbV8YQceYBa2sANxeBOrzfyxHge0G6a/UFRR1dX1d2MjnvEhexYzTeg2BcXtTV+YjJwdguPo9IKyW8pMrCIeoENwF86UglkaQuXwszSoUySVVugCJeJcF+0MK06hcOEVosnxOOqxihWFaM02gueojTTC9Tn7UqcCXTBo+JTGgfxFRQhPsG7bhKooRU4QF3G06kteYYlSvDqcBi0ydPk3ODQqXrq+mKevjXT4xNhy/9gfaoxEHbCMwUESQ046vWB/tEzI4/iPZNkqgCCIjdpQuscU2+4GneiElzZf4jKuvEjpFdRdRe6Au3cKdLTeirTmujyOX6ftHwH96Kg8UctQUdX/fGIXZkl5iUl90BMqiD9wlWxeaPMsqk7duVSLVd5iWORVrx/ej2waoS0410l4QDX/D480MujQigqQCJW0/aiWr8QYmpi3h4wpuw/GibnGxUuYv4kWlfxDQsPIo7+9qt8NMVSLYtMKRKJEpGXMRFUlisdqhJHTxNYgfSkBG+VY7cCbq+g9SSK5FjswmYQHQNa0FRut8sRBZl8IF2SQTAtCaTQe9GOxrKhXKo/1cywfNm5y78gBt0PSIkBeYh61SJsx4G0WgmkAi73h8oBYHsuOjxIaU/eirfbUVtXu96C/mvBVC4LPpXxGBfjrFrtsBV1j2A6V90fEj2qwF5lDGFYmAO7cC3W/T4QwmW9q0sQiJnYVBu7XoXpCwSyav93RMZrdcm5fNAf/Z"
+                             showloader="" loader-class="preload" loader-src="app/assets/images/loader.gif"
+                             src="data:image/jpeg;base64,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">
+                    </div>
+                    <div flex="80" style="margin-top: 10px;font-size: 1em;">
+                        <div></div>
+                    </div>
+                </div>
+            </div>
+        </md-toolbar>
+        <md-list>
+            <md-list-item ng-repeat="item in vm.menu" ng-click="vm.navigateTo(item.link)" >
+                <div class="inset" ng-show="item.icon">
+                    <ng-md-icon icon="{{item.icon}}"></ng-md-icon>
+                </div>
+                <p> {{ item.name }}</p>
+            </md-list-item>
+            <md-divider></md-divider>
+            <md-subheader>Admin</md-subheader>
+            <md-list-item ng-repeat="item in vm.admin" ng-click="vm.showSettingsBottom($event)" >
+                <div class="inset">
+                    <ng-md-icon icon="{{item.icon}}"></ng-md-icon>
+                </div>
+                <p> {{ item.title }}</p>
+            </md-list-item>
+        </md-list>
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/layouts/side-nav/sidenavCtrl.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/layouts/side-nav/sidenavCtrl.js
new file mode 100644
index 00000000..41756882
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/layouts/side-nav/sidenavCtrl.js
@@ -0,0 +1,114 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function () {
+	'use strict';
+
+	/**
+	* @ngdoc function
+	* @name app.controller:SidenavCtrl
+	* @description
+	* # SidenavCtrl
+	* Controller of the app
+	*/
+	angular
+		.module('vnfmarket')
+		.controller('SidenavCtrl', SidenavCtrl)
+		.controller('SettingsCtrl', SettingsCtrl);
+
+	// Injecting Denpendencies
+
+	SidenavCtrl.$inject = ['$mdSidenav', '$state', '$mdBottomSheet', '$mdToast', 'MenuService', '$scope'];
+	SettingsCtrl.$inject = ['$mdBottomSheet'];
+
+	/*
+	* recommend
+	* Using function declarations
+	* and bindable members up top.
+	*/
+
+	function SidenavCtrl($mdSidenav, $state, $mdBottomSheet, $mdToast, MenuService, $scope) {
+		/*jshint validthis: true */
+		var vm = this;
+
+		vm.toggleSidenav = function (menuId) {
+			$mdSidenav(menuId).toggle();
+		};
+
+		vm.closeSidenav = function() {
+			$mdSidenav('left').close();
+		};
+
+		// Close menu on small screen after click on menu item.
+		// Only use $scope in controllerAs when necessary; for example, publishing and subscribing events using $emit, $broadcast, $on or $watch.
+		$scope.$on('$stateChangeSuccess', vm.closeSidenav);
+
+		vm.menu = MenuService.listMenu();
+
+		vm.admin = [
+			{
+				link: 'showListBottomSheet($event)',
+				title: 'Settings',
+				icon: 'settings'
+			}
+		];
+
+		vm.navigateTo = function (target) {
+
+			var page = target;
+
+			$state.go(page);
+
+		};
+
+		vm.showSettingsBottom = function ($event) {
+			vm.alert = '';
+			$mdBottomSheet.show({
+				template: '<md-bottom-sheet class="md-grid" layout="column" ng-cloak><div layout="row" layout-align="center center"><h4>With clickOutsideToClose option, drag down or press ESC to close</h4></div><md-list flex layout="row" layout-align="center center"><md-list-item ng-repeat="item in vm.items"><md-button class="md-grid-item-content" ng-click="vm.listItemClick($index)"><md-icon class="md-48">{{item.icon}}</md-icon><div class="md-grid-text"> {{ item.name }} </div></md-button></md-list-item></md-list></md-bottom-sheet>',
+				controller: 'SettingsCtrl',
+				controllerAs: 'vm',
+				targetEvent: $event
+			}).then(function (clickedItem) {
+				$mdToast.show(
+					$mdToast.simple()
+					.content(clickedItem.name + ' clicked!')
+					.position('top right')
+					.hideDelay(2000)
+				);
+			});
+		};
+
+	}
+
+	function SettingsCtrl($mdBottomSheet) {
+		/*jshint validthis: true */
+		var vm = this;
+
+		vm.items = [
+			{name: 'Roles', icon: 'assignment_ind'},
+			{name: 'Notes', icon: 'speaker_notes'},
+			{name: 'Tasks', icon: 'view_list'},
+			{name: 'Inbox', icon: 'inbox'}
+		];
+
+		vm.listItemClick = function ($index) {
+			var clickedItem = vm.items[$index];
+			$mdBottomSheet.hide(clickedItem);
+		};
+	}
+
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/layouts/side-nav/sidenavService.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/layouts/side-nav/sidenavService.js
new file mode 100644
index 00000000..4fecf269
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/layouts/side-nav/sidenavService.js
@@ -0,0 +1,66 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function() {
+	'use strict';
+
+	/**
+	 * @ngdoc function
+	 * @name app.service:menuService
+	 * @description
+	 * # menuService
+	 * Service of the app
+	 */
+
+  	angular
+		.module('vnfmarket')
+		.factory('MenuService', Menu);
+		// Inject your dependencies as .$inject = ['$http', 'someSevide'];
+		// function Name ($http, someSevide) {...}
+
+		Menu.$inject = ['$http'];
+
+		function Menu ($http) {
+
+			var menu = [
+
+					{
+						link: 'user',
+							name: 'User'
+					},
+
+					{
+						link: 'marketplace',
+							name: 'Marketplace'
+					},
+
+					{
+						link: 'about',
+							name: 'About'
+					},
+
+		  	];
+
+			return {
+				listMenu: function () {
+					return menu;
+				}
+		  	}
+
+		}
+
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/marketplace/marketplace-test.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/marketplace/marketplace-test.js
new file mode 100644
index 00000000..1824af38
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/marketplace/marketplace-test.js
@@ -0,0 +1,48 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function () {
+	'use strict';
+
+	/**
+	 * @ngdoc function
+	 * @name app.test:marketplaceTest
+	 * @description
+	 * # marketplaceTest
+	 * Test of the app
+	 */
+
+	describe('marketplace test', function () {
+		var controller = null, $scope = null;
+
+		beforeEach(function () {
+			module('vnfmarket');
+		});
+
+		beforeEach(inject(function ($controller, $rootScope) {
+			$scope = $rootScope.$new();
+			controller = $controller('MarketplaceCtrl', {
+				$scope: $scope
+			});
+		}));
+
+		it('Should controller must be defined', function () {
+			expect(controller).toBeDefined();
+		});
+
+	});
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/marketplace/marketplace.html b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/marketplace/marketplace.html
new file mode 100644
index 00000000..2f4dc9ff
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/marketplace/marketplace.html
@@ -0,0 +1,22 @@
+<!--
+  Copyright 2016-2017 Huawei Technologies Co., Ltd.
+ 
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+      http://www.apache.org/licenses/LICENSE-2.0
+ 
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+-->
+<div class="md-padding" flex layout-sm="column">
+    <md-card>
+        <md-card-content>
+            <h2 class="md-title">Content from: marketplace page</h2>
+        </md-card-content>
+    </md-card>
+</div>
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/marketplace/marketplaceCtrl.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/marketplace/marketplaceCtrl.js
new file mode 100644
index 00000000..eaca12b4
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/marketplace/marketplaceCtrl.js
@@ -0,0 +1,47 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function() {
+	'use strict';
+
+	/**
+	* @ngdoc function
+	* @name app.controller:marketplaceCtrl
+	* @description
+	* # marketplaceCtrl
+	* Controller of the app
+	*/
+
+  	angular
+		.module('marketplace')
+		.controller('MarketplaceCtrl', Marketplace);
+
+		Marketplace.$inject = [];
+
+		/*
+		* recommend
+		* Using function declarations
+		* and bindable members up top.
+		*/
+
+		function Marketplace() {
+			/*jshint validthis: true */
+			var vm = this;
+
+		}
+
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/marketplace/marketplaceModule.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/marketplace/marketplaceModule.js
new file mode 100644
index 00000000..26c5a98f
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/marketplace/marketplaceModule.js
@@ -0,0 +1,31 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function () {
+	'use strict';
+
+	/**
+	 * @ngdoc function
+	 * @name app.module:marketplaceModule
+	 * @description
+	 * # marketplaceModule
+	 * Module of the app
+	 */
+
+  	angular.module('marketplace', []);
+
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/marketplace/marketplaceRoute.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/marketplace/marketplaceRoute.js
new file mode 100644
index 00000000..a7b1dfe0
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/marketplace/marketplaceRoute.js
@@ -0,0 +1,40 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+'use strict';
+
+/**
+ * @ngdoc function
+ * @name app.route:marketplaceRoute
+ * @description
+ * # marketplaceRoute
+ * Route of the app
+ */
+
+angular.module('marketplace')
+	.config(['$stateProvider', function ($stateProvider) {
+
+		$stateProvider
+			.state('home.marketplace', {
+				url:'/marketplace',
+				templateUrl: 'app/modules/marketplace/marketplace.html',
+				controller: 'MarketplaceCtrl',
+				controllerAs: 'vm'
+			});
+
+
+	}]);
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/marketplace/marketplaceService.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/marketplace/marketplaceService.js
new file mode 100644
index 00000000..22fdb7b6
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/marketplace/marketplaceService.js
@@ -0,0 +1,41 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function() {
+	'use strict';
+
+	/**
+	 * @ngdoc function
+	 * @name app.service:marketplaceService
+	 * @description
+	 * # marketplaceService
+	 * Service of the app
+	 */
+
+  	angular
+		.module('marketplace')
+		.factory('MarketplaceService', Marketplace);
+		// Inject your dependencies as .$inject = ['$http', 'someSevide'];
+		// function Name ($http, someSevide) {...}
+
+		Marketplace.$inject = ['$http'];
+
+		function Marketplace ($http) {
+
+		}
+
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/user/user-test.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/user/user-test.js
new file mode 100644
index 00000000..20693c1b
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/user/user-test.js
@@ -0,0 +1,48 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function () {
+	'use strict';
+
+	/**
+	 * @ngdoc function
+	 * @name app.test:userTest
+	 * @description
+	 * # userTest
+	 * Test of the app
+	 */
+
+	describe('user test', function () {
+		var controller = null, $scope = null;
+
+		beforeEach(function () {
+			module('vnfmarket');
+		});
+
+		beforeEach(inject(function ($controller, $rootScope) {
+			$scope = $rootScope.$new();
+			controller = $controller('UserCtrl', {
+				$scope: $scope
+			});
+		}));
+
+		it('Should controller must be defined', function () {
+			expect(controller).toBeDefined();
+		});
+
+	});
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/user/user.html b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/user/user.html
new file mode 100644
index 00000000..2fe411b5
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/user/user.html
@@ -0,0 +1,74 @@
+<!--
+  Copyright 2016-2017 Huawei Technologies Co., Ltd.
+ 
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+      http://www.apache.org/licenses/LICENSE-2.0
+ 
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+-->
+<div class="md-padding" flex layout-sm="column">
+    <md-card>
+        <md-card-content>
+            <h2 class="md-title">Content from: user page</h2>
+        </md-card-content>
+    </md-card>
+    <md-card>
+    	<md-card-content>
+    		<div class="row-fluid">
+                <div class="col-md-12">
+                    <!-- Nav tabs -->
+                    <ul class="nav nav-tabs" role="tablist">
+                      <li role="presentation" class="active"><a href="#download-hist-tab" aria-controls="download-hist-tab" role="tab" data-toggle="tab">Downloaded Services</a></li>
+                      <li role="presentation"><a href="#upload-hist-tab" aria-controls="upload-hist-tab" role="tab" data-toggle="tab">Uploaded History</a></li>
+                    </ul>
+                    <!-- Tab panes -->
+                    <div class="tab-content">
+                      <div role="tabpanel" class="tab-pane active" id="download-hist-tab">
+                        <table class="table table-striped">
+                          <thead>
+                            <th>Service Name</th>
+                            <th>Last Updated</th>
+                            <th>Vendor</th>
+                            <th>Type</th>
+                          </thead>
+                          <tbody>
+                            <tr ng-repeat="service in services">
+                              <td>{{service.name}}</td>
+                              <td>{{service.date}}</td>
+                              <td>{{service.vendor}}</td>
+                              <td>{{service.type}}</td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </div>
+                      <div role="tabpanel" class="tab-pane" id="upload-hist-tab">
+                        <table class="table table-striped">
+                          <thead>
+                            <th>Service Name</th>
+                            <th>Last Updated</th>
+                            <th>Vendor</th>
+                            <th>Type</th>
+                          </thead>
+                          <tbody>
+                            <tr ng-repeat="service in services | limitTo: 6">
+                              <td>{{service.name}}</td>
+                              <td>{{service.date}}</td>
+                              <td>{{service.vendor}}</td>
+                              <td>{{service.type}}</td>
+                            </tr>
+                          </tbody>
+                        </table>
+                        </div>
+                      </div>
+                </div>
+              </div>
+    	</md-card-content>
+    </md-card>
+</div>
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/user/userCtrl.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/user/userCtrl.js
new file mode 100644
index 00000000..81de3904
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/user/userCtrl.js
@@ -0,0 +1,47 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function() {
+	'use strict';
+
+	/**
+	* @ngdoc function
+	* @name app.controller:userCtrl
+	* @description
+	* # userCtrl
+	* Controller of the app
+	*/
+
+  	angular
+		.module('user')
+		.controller('UserCtrl', User);
+
+		User.$inject = [];
+
+		/*
+		* recommend
+		* Using function declarations
+		* and bindable members up top.
+		*/
+
+		function User() {
+			/*jshint validthis: true */
+			var vm = this;
+
+		}
+
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/user/userModule.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/user/userModule.js
new file mode 100644
index 00000000..290c1758
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/user/userModule.js
@@ -0,0 +1,31 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function () {
+	'use strict';
+
+	/**
+	 * @ngdoc function
+	 * @name app.module:userModule
+	 * @description
+	 * # userModule
+	 * Module of the app
+	 */
+
+  	angular.module('user', []);
+
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/user/userRoute.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/user/userRoute.js
new file mode 100644
index 00000000..3986c106
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/user/userRoute.js
@@ -0,0 +1,40 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+'use strict';
+
+/**
+ * @ngdoc function
+ * @name app.route:userRoute
+ * @description
+ * # userRoute
+ * Route of the app
+ */
+
+angular.module('user')
+	.config(['$stateProvider', function ($stateProvider) {
+
+		$stateProvider
+			.state('home.user', {
+				url:'/user',
+				templateUrl: 'app/modules/user/user.html',
+				controller: 'UserCtrl',
+				controllerAs: 'vm'
+			});
+
+
+	}]);
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/user/userService.js b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/user/userService.js
new file mode 100644
index 00000000..a3a8f76c
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/marketplace/modules/user/userService.js
@@ -0,0 +1,41 @@
+/*
+
+    Copyright 2016-2017, Huawei Technologies Co., Ltd.
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+            http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+
+*/
+(function() {
+	'use strict';
+
+	/**
+	 * @ngdoc function
+	 * @name app.service:userService
+	 * @description
+	 * # userService
+	 * Service of the app
+	 */
+
+  	angular
+		.module('user')
+		.factory('UserService', User);
+		// Inject your dependencies as .$inject = ['$http', 'someSevide'];
+		// function Name ($http, someSevide) {...}
+
+		User.$inject = ['$http'];
+
+		function User ($http) {
+
+		}
+
+})();
diff --git a/vnfmarket-be/portal-marketplace/src/main/webapp/package.json b/vnfmarket-be/portal-marketplace/src/main/webapp/package.json
new file mode 100644
index 00000000..14923aff
--- /dev/null
+++ b/vnfmarket-be/portal-marketplace/src/main/webapp/package.json
@@ -0,0 +1,44 @@
+{
+  "name": "vnfmarket",
+  "description": "Marketplace UI for VNF Services",
+  "version": "0.0.1",
+  "author": "HTIPL",
+  "engines": {
+    "node": "0.10.x",
+    "npm": "1.4.x"
+  },
+  "scripts": {
+    "start": "grunt",
+    "test": "karma start karma.conf.js",
+    "postinstall": "bower install --config.interactive=false"
+  },
+  "dependencies": {
+    "bower": "~1.3.8",
+    "grunt-cli": "~0.1.13",
+    "glob": "~4.0.5",
+    "async": "~0.9.0",
+    "chalk": "~0.5"
+  },
+  "devDependencies": {
+    "grunt": "~0.4.1",
+    "grunt-contrib-clean": "~0.5.0",
+    "grunt-contrib-concat": "~0.3.0",
+    "grunt-contrib-connect": "~0.5.0",
+    "grunt-concurrent": "^1.0.0",
+    "grunt-contrib-jshint": "~0.6.4",
+    "grunt-contrib-uglify": "~0.2.4",
+    "grunt-contrib-watch": "~0.5.3",
+	"grunt-exec": "^0.4.6",
+    "grunt-injector": "^0.5.4",
+	"grunt-angular-templates": "^1.0.2",
+    "load-grunt-tasks": "^0.5.0",
+    "time-grunt": "^0.3.2",
+    "karma": "~0.12.0",
+    "karma-chrome-launcher": "~0.1.2",
+    "karma-coverage": "~0.2.0",
+    "karma-firefox-launcher": "~0.1.3",
+	"karma-spec-reporter": "0.0.23",
+    "karma-jasmine": "~0.2.1",
+    "karma-phantomjs-launcher": "~0.1.2"
+  }
+}