Giter VIP home page Giter VIP logo

vuejsbobuilder's Introduction

Logo

VuejsBOBuilder

๐Ÿ’ก Build a scalable and customisable CRUD Back-Office based on API services with very simple json config. ๐Ÿ’ก

๐Ÿšง Work In Progress ๐Ÿšง

CONFIGURATION

The application uses a .json file to build the entire CRUD application. For the reading and the writing, the configuration is divide into different .json files. A service will merge all config files in one.

ENTITIES

In the directory config/entities you will have a .json file for each model you want a CRUD.

An entity config look like this :

{
  "name": "<Name of the entity/resource>",
  "icon": "<Icon used in sidebar menu>",
  "url": "<Url used in front>",
  "api": "<optionnal>",
  "schema": []
}

The key api is optional because by default, the url path is retrieves from config/common/api/default_api.json and a service will merge and provide default endpoints like this :

{
    "endpoints": {
      "fetchAll": {
        "url": "${resource}s"
      },
      "fetchOne": {
        "url": "${resource}s/:id"
      },
      "create": {
        "url": "${resource}s"
      },
      "update": {
        "url": "${resource}s/:id"
      },
      "delete": {
        "url": "${resource}s/:id"
      }
    }
}

EXAMPLE

So for example, for the comment entity :

{
  "name": "comment",
  "icon": "chat",
  "url": "/comment",
  "schema": [
    "name",
    "email",
    { 
      "key": "postId",
      "type": "entity-select",
      "inputType": "post",
      "label": "postId",
      "model": "postId",
      "convertToString": ["title"],
      "isRelation": true
    },
    {
      "key": "body",
      "type": "textArea",
      "label": "body",
      "model": "body",
      "placeholder": "Entrer un corps de message"
    }
  ]
}

COMMON

In order to simplify the writing, and the reading of entity config file, it's possible to define common config files.

API

Like we saw just before, the default_api.json provide the default url of the api.

FIELDS

On the comment example, in the schema, we have a name field. It's a common field (can be use in others entity config file). So, in config/common/fields/name.json you will have the simple field config

{
  "key": "name",
  "type": "input",
  "inputType": "text",
  "label": "Nom",
  "model": "name"
}

After That, you will be able to just use "name" in entity schema config.

FEATURES

A simple .json file to active or deactivate application features.

{
  "clock": true
}

VIEWS

CRUD view, Login, home

DEFAULT VIEWS

CRUD :

  • views/defaultView/DefaultDataTable,
  • views/defaultView/DefaultEditEntity,
  • views/defaultView/DefaultCreateEntity

SLOTS

EXTENDED VIEWS

views/extendedViews/<resource> and have to be the same name of default views

Project commands

yarn install
yarn serve
yarn build
yarn lint

vuejsbobuilder's People

Contributors

dependabot[bot] avatar jeremydolle avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

Forkers

zilliq11

vuejsbobuilder's Issues

Documentation

Add some documentation in order to use the project

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.