Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add lb3 example application #2803

Merged
merged 1 commit into from
May 13, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
1 change: 1 addition & 0 deletions CODEOWNERS
Validating CODEOWNERS rules …
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,7 @@ examples/todo/* @bajtos @hacksparrow
examples/express-composition/* @nabdelgadir
examples/greeter-extension/* @raymondfeng
examples/hello-world/* @b-admike
examples/lb3-application/* @bajtos @nabdelgadir
examples/log-extension/* @hacksparrow
examples/rpc-server/* @hacksparrow
examples/soap-calculator/* @marioestradarosa
Expand Down
1 change: 1 addition & 0 deletions docs/site/Examples.md
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,7 @@ $ lb4 example
soap-calculator: An example on how to integrate SOAP web services.
express-composition: A simple Express application that uses LoopBack 4 REST API.
greeter-extension: An example showing how to implement the extension point/extension pattern.
lb3-application: An example LoopBack 3 application mounted in a LoopBack 4 project.
```

Please follow the instructions in
Expand Down
1 change: 1 addition & 0 deletions docs/site/MONOREPO.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ The [loopback-next](https://github.com/strongloop/loopback-next) repository uses
| [example-express-composition](https://github.com/strongloop/loopback-next/tree/master/examples/express-composition) | @loopback/example-express-composition | A simple Express application that uses LoopBack 4 REST API |
| [example-greeter-extension](https://github.com/strongloop/loopback-next/tree/master/examples/greeter-extension) | @loopback/example-greeter-extension | An example showing how to implement the extension point/extension pattern using LoopBack 4 |
| [example-hello-world](https://github.com/strongloop/loopback-next/tree/master/examples/hello-world) | @loopback/example-hello-world | A simple hello-world application using LoopBack 4 |
| [example-lb3-application](https://github.com/strongloop/loopback-next/tree/master/examples/lb3-application) | @loopback/example-lb3-application | An example LoopBack 3 application mounted in a LoopBack 4 project. |
| [example-log-extension](https://github.com/strongloop/loopback-next/tree/master/examples/log-extension) | @loopback/example-log-extension | An example showing how to write a complex log extension for LoopBack 4 |
| [example-rpc-server](https://github.com/strongloop/loopback-next/tree/master/examples/rpc-server) | @loopback/example-rpc-server | An example RPC server and application to demonstrate the creation of your own custom server |
| [example-soap-calculator](https://github.com/strongloop/loopback-next/tree/master/examples/soap-calculator) | @loopback/example-soap-calculator | A tutorial demonstrating integration with a SOAP webservice |
Expand Down
5 changes: 5 additions & 0 deletions docs/site/Tutorials.md
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,10 @@ LoopBack 4 comes with the following tutorials:
- **[express-composition](express-with-lb4-rest-tutorial.md)**: Tutorial on
mounting LoopBack 4 REST API on an Express application.

- **[lb3-application](https://github.com/strongloop/loopback-next/tree/master/examples/lb3-application)**:
Tutorial on mounting an existing LoopBack 3 application in a new LoopBack 4
project.

You can download any of the tutorial projects using our CLI tool `lb4`:

```sh
Expand All @@ -36,6 +40,7 @@ $ lb4 example
soap-calculator: An example on how to integrate SOAP web services.
express-composition: A simple Express application that uses LoopBack 4 REST API.
greeter-extension: An example showing how to implement the extension point/extension pattern.
lb3-application: An example LoopBack 3 application mounted in a LoopBack 4 project.
```

Please follow the instructions in
Expand Down
1 change: 1 addition & 0 deletions docs/site/express-with-lb4-rest-tutorial.md
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,7 @@ application, follow these steps:
rpc-server: A basic RPC server using a made-up protocol.
> express-composition: A simple Express application that uses LoopBack 4 REST API.
greeter-extension: An example showing how to implement the extension point/extension pattern.
lb3-application: An example LoopBack 3 application mounted in a LoopBack 4 project.
```

2. Switch to the directory.
Expand Down
1 change: 1 addition & 0 deletions examples/express-composition/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,7 @@ application, follow these steps:
soap-calculator: An example on how to integrate SOAP web services.
> express-composition: A simple Express application that uses LoopBack 4 REST API.
greeter-extension: An example showing how to implement the extension point/extension pattern.
lb3-application: An example LoopBack 3 application mounted in a LoopBack 4 project.
```

2. Jump into the directory and then install the required dependencies:
Expand Down
1 change: 1 addition & 0 deletions examples/lb3-application/.npmrc
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
package-lock=true
2 changes: 2 additions & 0 deletions examples/lb3-application/.prettierignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
dist
*.json
6 changes: 6 additions & 0 deletions examples/lb3-application/.prettierrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
{
"bracketSpacing": false,
"singleQuote": true,
"printWidth": 80,
"trailingComma": "all"
}
21 changes: 21 additions & 0 deletions examples/lb3-application/.vscode/settings.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
{
"editor.rulers": [80],
"editor.tabCompletion": "on",
"editor.tabSize": 2,
"editor.trimAutoWhitespace": true,
"editor.formatOnSave": true,

"files.exclude": {
"**/.DS_Store": true,
"**/.git": true,
"**/.hg": true,
"**/.svn": true,
"**/CVS": true,
"dist": true,
},
"files.insertFinalNewline": true,
"files.trimTrailingWhitespace": true,

"tslint.ignoreDefinitionFiles": true,
"typescript.tsdk": "./node_modules/typescript/lib"
}
29 changes: 29 additions & 0 deletions examples/lb3-application/.vscode/tasks.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
{
// See https://go.microsoft.com/fwlink/?LinkId=733558
// for the documentation about the tasks.json format
"version": "2.0.0",
"tasks": [
bajtos marked this conversation as resolved.
Show resolved Hide resolved
{
"label": "Watch and Compile Project",
"type": "shell",
"command": "npm",
"args": ["--silent", "run", "build:watch"],
"group": {
"kind": "build",
"isDefault": true
},
"problemMatcher": "$tsc-watch"
},
{
"label": "Build, Test and Lint",
"type": "shell",
"command": "npm",
"args": ["--silent", "run", "test:dev"],
"group": {
"kind": "test",
"isDefault": true
},
"problemMatcher": ["$tsc", "$tslint5"]
}
]
}
4 changes: 4 additions & 0 deletions examples/lb3-application/CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
# Change Log

All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
25 changes: 25 additions & 0 deletions examples/lb3-application/LICENSE
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
Copyright (c) IBM Corp. 2019. All Rights Reserved.
Node module: @loopback/example-lb3-application
This project is licensed under the MIT License, full text below.

--------

MIT license

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.
128 changes: 128 additions & 0 deletions examples/lb3-application/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,128 @@
# @loopback/example-lb3-application

This example demonstrates how to mount your existing LoopBack 3 application in a
new LoopBack 4 project.

## Tutorial

1. Create a new LoopBack 4 project using `lb4 app`.

```
$ lb4 app
```

2. Create a new directory `lb3app` from the root of your LoopBack 4 application
and copy your existing LoopBack 3 application there. You should end up with
the following directory layout:

```
lb3app/
# LoopBack 3 application in JavaScript
common/
models/
# LB3 model files
server/
boot/
# LB3 boot scripts
public/
# front-end assets (LB4 way)
src/
# LoopBack 4 application in TypeScript
```

3. Move LB3 dependencies to the main package.json file and remove
b-admike marked this conversation as resolved.
Show resolved Hide resolved
`lb3app/package.json`, `lb3app/node_modules/`, and`lb3app/package-lock.json`,
if it exists. Typically you will need to add the following entries, plus any
connectors or components you are using in your LB3 application.

```json
{
"compression": "^1.7.4",
"cors": "^2.8.5",
"helmet": "^3.16.0",
"loopback": "^3.25.1",
"loopback-boot": "^3.3.0"
}
```

Run `npm install` from the root of your LB4 project to install the LB3
dependencies.

4. Disable error handling in your LB3 app, leave it for the new LB4 app.

- Remove `lb3app/server/middleware.development.json`
- Edit `lb3app/server/middleware.json` and remove the following two entries:
- `final` >> `loopback#urlNotFound`
- `final:after` >> `strong-error-handler`
- Remove `strong-error-handler` from `package.json` dependencies.
- In `lb3app/server/config.json`, if `"handleErrors": false` is in
`remoting`, move it to `rest`.

5. Move your front-end files from `lb3app/client` to `public/` directory and
disable static assets in your LB3 app by removing the following entry in
`lb3app/server/middleware.json`:

- `files` >> `loopback#static`

Also remove `lb3app/server/boot/root.js`, since the main page will be served
by the LoopBack 4 project.

6. Remove `lb3app/server/component-config.json` to disable LoopBack 3's
explorer. The LoopBack 4 explorer will be used instead.

7. Install and configure `@loopback/booter-lb3app` to boot and mount the LB3
application:

1. `npm install --save @loopback/booter-lb3app`

2. Import the component at the top of your `src/application.ts` file.

```ts
import {Lb3AppBooterComponent} from '@loopback/booter-lb3app';
```

3. Register the component in Application's constructor:

```ts
this.component(Lb3AppBooterComponent);
```
b-admike marked this conversation as resolved.
Show resolved Hide resolved

## Try it out

Start the new LB4 application

```sh
$ npm start
Server is running at http://127.0.0.1:3000
```

Open the URL printed to console to view your front-end served from `public`
b-admike marked this conversation as resolved.
Show resolved Hide resolved
directory or go to `http://127.0.0.1:3000/explorer` to explore the REST API.

### Need help?

Check out our [Gitter channel](https://gitter.im/strongloop/loopback) and ask
for help with this tutorial.

### Bugs/Feedback

Open an issue in [loopback-next](https://github.com/strongloop/loopback-next)
and we'll take a look.

## Contributions

- [Guidelines](https://github.com/strongloop/loopback-next/blob/master/docs/CONTRIBUTING.md)
- [Join the team](https://github.com/strongloop/loopback-next/issues/110)

## Tests

Run `npm test` from the root folder.

## Contributors

See
[all contributors](https://github.com/strongloop/loopback-next/graphs/contributors).

## License

MIT
6 changes: 6 additions & 0 deletions examples/lb3-application/index.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
// Copyright IBM Corp. 2019. All Rights Reserved.
// Node module: @loopback/example-lb3-application
// This file is licensed under the MIT License.
// License text available at https://opensource.org/licenses/MIT

export * from './dist';
26 changes: 26 additions & 0 deletions examples/lb3-application/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
// Copyright IBM Corp. 2019. All Rights Reserved.
// Node module: @loopback/example-lb3-application
// This file is licensed under the MIT License.
// License text available at https://opensource.org/licenses/MIT

const application = require('./dist');

module.exports = application;

if (require.main === module) {
// Run the application
const config = {
rest: {
port: +process.env.PORT || 3000,
host: process.env.HOST || 'localhost',
openApiSpec: {
// useful when used with OASGraph to locate your application
setServersFromRequest: true,
},
},
};
application.main(config).catch(err => {
console.error('Cannot start the application.', err);
process.exit(1);
});
}
8 changes: 8 additions & 0 deletions examples/lb3-application/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
// Copyright IBM Corp. 2019. All Rights Reserved.
// Node module: @loopback/example-lb3-application
// This file is licensed under the MIT License.
// License text available at https://opensource.org/licenses/MIT

// DO NOT EDIT THIS FILE
// Add any additional (re)exports to src/index.ts instead.
export * from './src';
38 changes: 38 additions & 0 deletions examples/lb3-application/lb3app/common/models/coffee-shop.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
'use strict';

const debug = require('debug')('loopback:example:lb3application');

module.exports = function(CoffeeShop) {
CoffeeShop.status = async function() {
const currentDate = new Date();
const currentHour = currentDate.getHours();
const OPEN_HOUR = 6;
const CLOSE_HOUR = 20;
debug('Current hour is %d', currentHour);
let response;
if (currentHour > OPEN_HOUR && currentHour < CLOSE_HOUR) {
response = 'We are open for business.';
} else {
response = 'Sorry, we are closed. Open daily from 6am to 8pm.';
}
return response;
};
CoffeeShop.remoteMethod('status', {
http: {
path: '/status',
verb: 'get',
},
returns: {
arg: 'status',
type: 'string',
},
});

CoffeeShop.greet = async function() {
return 'Hello from this Coffee Shop';
};
CoffeeShop.remoteMethod('greet', {
http: {path: '/greet', verb: 'get'},
returns: {type: 'string'},
});
};
30 changes: 30 additions & 0 deletions examples/lb3-application/lb3app/common/models/coffee-shop.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
{
"name": "CoffeeShop",
"base": "PersistedModel",
"idInjection": true,
"forceId": false,
"options": {
"validateUpsert": true
},
"properties": {
"name": {
"type": "string",
"required": true
},
"city": {
"type": "string"
}
},
"validations": [],
"relations": {},
"acls": [
{
"accessType":"EXECUTE",
"principalType":"ROLE",
"principalId":"$unauthenticated",
"permission":"DENY",
"property":"greet"
}
],
"methods": {}
}