GithubHelp home page GithubHelp logo

apihub's Introduction

Layer7 API Hub

Prerequisite: You have read the Layer7 API Hub Overview.

Packages Directory

This section provides an overview of the react-admin application structure, describes the key directories, and the content of these directories. The packages directory includes the following libraries and apps.

Layer7 API Hub Library

The Layer7 API Hub library README includes the following information:

Example App

The Example app has the same source code as the standard API Hub. The Example app README includes the following information:

Healthcare App

The Healthcare app demonstrates a possible customized variation of API Hub with a Healthcare theme. It includes the same developer features as the Example app. It further extends the API Hub to include custom pages and additional calls (PAPI and Portal Metrics API). You use this app with the mock server.

The Healthcare app README includes the following information:

Layer7 API Hub Mock Server

The Layer7 API Hub mock server README includes the following information:

Cypress End-To-End Testing

The end-to-end (E2E) tests are for the Example app.

For more information about this testing, see the Cypress - End-To-End Testing README.

Quick Start

Use the following commands to set up you local development environment.

Prerequisites:

Before setting up your local development environment, ensure that you have completed the following:

  • You have installed Yarn.
  • You have installed Make.

Install the JavaScript Dependencies

Install the JavaScript dependencies by issuing the following command:

make install

Start an App

Start the Example app or the Healthcare app in watch mode.

To start the Example app, issue the following command:

make start

To start the Healthcare app, issue the following command:

make start-healthcare

Run the Tests

Run the unit tests and the E2E tests by issuing the following command:

make test

Unit Tests

Run only the unit tests by issuing the following command:

make test-unit

End-To-End Tests

Run only the E2E tests:

make test-e2e

Open the E2E tests GUI (useful for writing and debugging E2E tests):

make test-e2e-local

Deploy the Example App

Build the API Hub library, the Example app, and then copy the production configuration by issuing the following commands:

make build
make build-example
DEPLOY_ENV=prod make copy-deploy-config-example

Copy the contents of the packages/example/build directory to your favorite web hosting service. For example, the following command launches an nginx Docker container on your local machine:

docker run --name APIHub -v `pwd`/packages/example/build:/usr/share/nginx/html:ro -p 8888:80 nginx

Create an API Hub Implementation

Follow these steps:

  1. From the root of this repository, initialize a new react-app called my-own-apihub by issuing the following commands:
$ cd packages && yarn create react-app my-own-apihub --scripts-version=3.2.0 
  1. Add the layer7-aphub, layer7-apihub-mock, and react-admin packages as dependencies in the new package.json:
  # in packages/my-own-apihub/package.json
 "dependencies": {
        "layer7-apihub": "~1.0.0",
        "layer7-apihub-mock": "~1.0.0",
        "react": "~16.13.1",
        "react-admin": "~3.6.2",
        "react-scripts": "~3.2.0"
    },
  1. Copy the config files to the example package by issuing the following commands:
$ cp -r packages/example/config packages/my-own-apihub/config/
$ cp packages/my-own-apihub/config/config-dev.js packages/my-own-apihub/public/config.js
  1. Update the public index.html file to include the config.js file:
<!-- in packages/my-own-apihub/public/index.html -->
<head>
...
  <script type="text/javascript" src="%PUBLIC_URL%/config.js"></script>
... 
 </head>
  1. Include the base API Hub component in the App.js file:
// in packages/my-own-apihub/src/App.js
import { ApiHubAdmin } from 'layer7-apihub';
const App = () => {
    const { APIHUB_URL, TENANT_NAME, ORIGIN_HUB_NAME } = global.APIHUB_CONFIG;
    return (
        <ApiHubAdmin
            url={APIHUB_URL} 
            tenantName={TENANT_NAME}
            originHubName={ORIGIN_HUB_NAME}
        />
    );
};
  1. Add the mock server to the index.js file:
// in packages/my-own-apihub/src/index.js
import { startApiHubMockedServer } from 'layer7-apihub-mock';
...
const { ENABLE_MOCK, MOCK_SERVER_INDICATOR_LINK } = global.APIHUB_CONFIG;
export const shouldEnableMock = (enableMock = ENABLE_MOCK) =>
    enableMock === 'true' || enableMock === true;
if (!shouldEnableMock(ENABLE_MOCK)) {
    ReactDOM.render(<App />, document.getElementById('root'));
} else {
    console.log('Starting the mocked server');
    startApiHubMockedServer({
        runningIndicatorLink: MOCK_SERVER_INDICATOR_LINK,
    }).then(() => ReactDOM.render(<App />, document.getElementById('root')));
}
  1. Start the bare-bones my-own-apihub app by issuing the following commands:
$ cd packages/my-own-apihub
$ yarn install
$ yarn start

apihub's People

Contributors

gzavgo avatar mb666712 avatar melil02 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.