docs(lb4): reorganize current tutorial materials

_data/sidebars/lb4_sidebar.yml

@@ -15,15 +15,19 @@ children:
   url: Installation.html
   output: 'web, pdf'
 
-- title: 'Getting started'
-  url: Getting-started.html
+- title: 'Examples and tutorials'
+  url: Examples-and-tutorials.html
   output: 'web, pdf'
   children:
 
-  - title: 'Examples and tutorials'
-    url: Examples-and-tutorials.html
+  - title: 'Hello World!'
+    url: Hello-World.html
     output: 'web, pdf'
 
+  - title: 'Getting Started'
+    url: Getting-started.html
+    output: 'web, pdf'
+
 - title: 'Key concepts'
   url: Concepts.html
   output: 'web, pdf'

pages/en/lb4/Examples-and-tutorials.md

@@ -8,13 +8,15 @@ permalink: /doc/en/lb4/Examples-and-tutorials.html
 summary:
 ---
 
-LoopBack 4 comes with the following example projects:
+Here's a list of tutorial resources to help you jump into LoopBack 4!
 
-- **[hello-world](https://github.com/strongloop/loopback-next/tree/master/packages/example-hello-world)**:
-  Tutorial on setting up a simple hello-world application using LoopBack 4.
+* **[Hello World](Hello-World.html)**:
+  Tutorial on setting up a simple hello-world application using LoopBack 4 with
+  a REST server and a controller.
 
-- **[getting-started](https://github.com/strongloop/loopback-next/tree/master/packages/example-getting-started)**:
-  Tutorial on building a simple application with LoopBack 4 key concepts.
+* **[Getting Started](Getting-started.html)**:
+  Tutorial on building a Todo API that leverages key LoopBack 4 concepts like
+  controllers, sequences, repositories, datasources, context and more!
 
 - **[log-extension](https://github.com/strongloop/loopback-next/tree/master/packages/example-log-extension)**:
   Tutorial on building a log extension.
@@ -24,7 +26,6 @@ LoopBack 4 comes with the following example projects:
 
 You can download any of the example projects usig our CLI tool `lb4`:
 
-
 ```
 $ lb4 example
 ? What example would you like to clone? (Use arrow keys)

pages/en/lb4/Getting-started.md

@@ -1,90 +1,12 @@
 ---
+title: "Getting Started"
 lang: en
-title: 'Getting started'
-keywords: LoopBack 4.0, LoopBack 4
-tags:
+layout: readme
+source: loopback-next 
+file: packages/example-getting-started/README.md
+keywords: LoopBack, LoopBack 4 
+tags: [tutorial, getting-started]
 sidebar: lb4_sidebar
 permalink: /doc/en/lb4/Getting-started.html
-summary: Write and run a LoopBack 4 "Hello World" project in JavaScript and TypeScript.
+summary: The introductory tutorial for learning LoopBack 4.
 ---
-## Prerequisites
-
-Install [Node.js](https://nodejs.org/en/download/) (version 8.x.x or higher) if
-not already installed on your machine.
-
-## Install LoopBack 4 CLI
-
-The LoopBack 4 CLI is a command-line interface that can scaffold a project or
-extension with more features under development. CLI provides the fastest way to
-get started with a LoopBack 4 project that adheres to best practices.
-
-Install the CLI globally by running
-```sh
-npm i -g @loopback/cli
-```
-
-## Create a new project
-
-The CLI tool will scaffold the project, configure TypeScript compiler and
-install all the required dependencies. To create a new project, run the CLI as
-follows and answer the prompts.
-```sh
-lb4 app
-```
-
-Answer the prompts as follows:
-```sh
-? Project name: getting-started
-? Project description: Getting started tutorial
-? Project root directory: (getting-started)
-? Application class name: StarterApplication
-? Select project build settings: Enable tslint, Enable prettier, Enable mocha, Enable loopbackBuild
-```
-
-### Starting the project
-
-The project comes with a "ping" route to test the project. Let's try it out by running the project.
-```sh
-cd getting-started
-npm start
-```
-
-In a browser, visit [http://127.0.0.1:3000/ping](http://127.0.0.1:3000/ping).
-
-## Adding your own controller
-
-Now that we have a basic project created, it's time to add our own [controller](Controllers.html).
-Let's add a simple "Hello World" controller as follows:
-
-* Create a new file in `/src/controllers/` called `hello.controller.ts`.
-
-* Paste the following contents into the file:
-  ```ts
-  import {get} from '@loopback/rest';
-
-  export class HelloController {
-    @get('/hello')
-    hello(): string {
-      return 'Hello world!';
-    }
-  }
-  ```
-
-* Update `/src/application.ts` to load the controller:
-    * Import `HelloController` at the top of the file
-      ```ts
-      import {HelloController} from './controllers/hello.controller';
-      ```
-
-    * Add controller in `setupControllers()`
-      ```ts
-      setupControllers() {
-        this.controller(PingController);
-        this.controller(HelloController);
-      }
-      ```
-
-* Start the application using `npm start`.
-    * *Note: If your application is still running, press **CTRL+C** to stop it before restarting it*
-
-* Visit [http://127.0.0.1:3000/hello](http://127.0.0.1:3000/hello) to see `Hello world!`

pages/en/lb4/Hello-World.md

@@ -0,0 +1,99 @@
+---
+lang: en
+title: 'Hello World!'
+keywords: LoopBack 4.0, LoopBack 4
+tags:
+sidebar: lb4_sidebar
+permalink: /doc/en/lb4/Hello-World.html
+summary: Write and run a LoopBack 4 "Hello World" project in JavaScript and TypeScript.
+---
+
+## Prerequisites
+
+Install [Node.js](https://nodejs.org/en/download/) (version 8.x.x or higher) if
+not already installed on your machine.
+
+## Install LoopBack 4 CLI
+
+The LoopBack 4 CLI is a command-line interface that can scaffold a project or
+extension with more features under development. CLI provides the fastest way to
+get started with a LoopBack 4 project that adheres to best practices.
+
+Install the CLI globally by running
+
+```sh
+npm i -g @loopback/cli
+```
+
+## Create a new project
+
+The CLI tool will scaffold the project, configure TypeScript compiler and
+install all the required dependencies. To create a new project, run the CLI as
+follows and answer the prompts.
+
+```sh
+lb4 app
+```
+
+Answer the prompts as follows:
+
+```sh
+? Project name: hello-world
+? Project description: A Hello World app!
+? Project root directory: (hello-world)
+? Application class name: StarterApplication
+? Select project build settings: Enable tslint, Enable prettier, Enable mocha, Enable loopbackBuild
+```
+
+### Starting the project
+
+The project comes with a "ping" route to test the project. Let's try it out by running the project.
+
+```sh
+cd hello-world
+npm start
+```
+
+In a browser, visit [http://127.0.0.1:3000/ping](http://127.0.0.1:3000/ping).
+
+## Adding your own controller
+
+Now that we have a basic project created, it's time to add our own [controller](Controllers.html).
+Let's add a simple "Hello World" controller as follows:
+
+* Create a new file in `/src/controllers/` called `hello.controller.ts`.
+
+* Paste the following contents into the file:
+
+  ```ts
+  import { get } from '@loopback/rest';
+
+  export class HelloController {
+    @get('/hello')
+    hello(): string {
+      return 'Hello world!';
+    }
+  }
+  ```
+
+* Update `/src/application.ts` to load the controller:
+
+  * Import `HelloController` at the top of the file
+
+    ```ts
+    import { HelloController } from './controllers/hello.controller';
+    ```
+
+  * Add controller in `setupControllers()`
+    ```ts
+    setupControllers() {
+      this.controller(PingController);
+      this.controller(HelloController);
+    }
+    ```
+
+* Start the application using `npm start`.
+
+  * _Note: If your application is still running, press **CTRL+C** to stop it before restarting it_
+
+* Visit [http://127.0.0.1:3000/hello](http://127.0.0.1:3000/hello) to see `Hello world!`

pages/en/lb4/includes/lb4_install.md

@@ -15,7 +15,7 @@ Install it with the following command:
 $ npm i --save @loopback/core
 ```
 
-{% include tip.html content="The `@loopback/core` package is the bare minimum; depending on your project's requirements, you may need to install other LoopBack packages.  See [Getting started](Getting-started.html) for an example.
+{% include tip.html content="The `@loopback/core` package is the bare minimum; depending on your project's requirements, you may need to install other LoopBack packages.  See the [Tutorial](Tutorial.html) for an example.
 " %}
 
 Now `package.json` should include these dependencies (you may see different version numbers):