zoapp-front

0.26.8 • Public • Published

zoapp-front

Build Status GitHub license npm version

Javascript ES7 React Zoapp frontend client

Getting started

Prerequisites

First of all, make sure you have Node 8.x and Yarn installed.

This project requires a backend application to start. At the moment, you have to install this backend application by yourself. In the following, we assume this backend application runs locally and is available at: 127.0.0.1:8081.

Usage

  1. Create a minimal react application

    TODO: create a minimal project

    import React from "react";
    import { Front, Screen } from "zoapp-front";
    
    const app = {
      name: "Zoapp",
      version: "0.1.0",
      design: {
        toolbar: {
          theme: "white",
        },
        drawer: {
          type: "persistent",
          themeDark: true,
        },
      },
      screens: [
        {
          id: "1",
          to: "/",
          icon: "dashboard",
          name: "Dashboard",
          access: "auth",
          path: "/",
          panels: ["Panel 1", "Panel 2"],
          toolbox: ["todo"],
          render: props => React.createElement(Screen, props, "Dashboard"),
        },
        {
          id: "2",
          to: "/admin",
          icon: "settings",
          name: "Admin",
          path: "/admin",
          access: "auth",
          panels: ["General", "Extensions", "Users", "Advanced"],
          render: props => React.createElement(Screen, props, "Admin"),
        },
        {
          id: "3",
          to: "/",
          icon: "home",
          name: "Home",
          path: "*",
          access: "public",
          render: props => React.createElement(Screen, props, "Home"),
        },
        {
          id: "4",
          to: "/help",
          name: "Help",
          icon: "help",
          path: "/help",
          access: "all",
          render: props => React.createElement(Screen, props, "Help"),
        },
      ],
    };
    
    const front = new Front("app", app, config);
    
    front.start();
    
  2. Add zoapp-front to your dependencies:

    $ yarn add zoapp-front
    $ yarn install
    
  3. Register a new client application on the backend application in order to obtain client ID/secret and allow authentication:

    $ curl -H "Content-Type: application/json" -X POST \
       -d '{ "name": "Your Client Name", "email": "hello@example.org", "grant_type": "password", "redirect_uri": "http://127.0.0.1:8080" }' \
       http://127.0.0.1:8081/auth/application
    

You should receive a response with credentials that will be needed in the next step. Also you need to create a first user:

TODO: process

  1. Create a configuration file named config/default.json with the following content:

    {
       "backend": {
          "api": {
             "host": "127.0.0.1",
             "port": "8081",
             "path": "api/v1/"
          },
          "auth": {
             "clientId": "<YOUR CLIENT ID>",
             "clientSecret": "<YOUR CLIENT SECRET>",
             "host": "127.0.0.1",
             "port": "8081",
             "path": "auth/"
          },
          "secure": false
       }
    }

5 Start the dev environment:

$ yarn dev

This application should be available at: http://127.0.0.1:8080/.

Contributing

Please, see the CONTRIBUTING file.

Contributor Code of Conduct

Please note that this project is released with a Contributor Code of Conduct. By participating in this project you agree to abide by its terms. See CODE_OF_CONDUCT file.

License

zoapp-front is released under the MIT License. See the bundled LICENSE file for details.

Readme

Keywords

Package Sidebar

Install

npm i zoapp-front

Weekly Downloads

1

Version

0.26.8

License

MIT

Unpacked Size

1.15 MB

Total Files

173

Last publish

Collaborators

  • mikbry