A powerful web admin for your database

A powerful web admin for your database

piccolo_admin provides a simple yet powerful admin interface on top of Piccolo models - allowing you to easily add / edit / filter your data.

Piccolo Admin

piccolo_admin provides a simple yet powerful admin interface on top of Piccolo models - allowing you to easily add / edit / filter your data.

Screenshot

Try it

Try it online (username: piccolo, password: piccolo123).

Local Demo

To run a demo locally, using Python 3.7 or above:

pip install piccolo_admin
admin_demo

And then just launch localhost:8000 in your browser.

To see what happens behind the scenes, see piccolo_admin/example.py.

In a few lines of code we are able to:

  • Define our models
  • Setup a database
  • Create a REST API
  • Setup a web server and admin interface

ASGI

Since the admin is an ASGI app, you can either run it standalone like in the demo, or integrate it with a larger ASGI app.

For example, using Starlette routes:

from piccolo_admin.endpoints import create_admin
from starlette.routing import Router, Route
import uvicorn

from my_project.tables import Director, Movie

admin = create_admin([Director, Movie])

router = Router([
    Route(path="/", endpoint=Hello),
    Mount(path="/admin/", app=admin),
])

if __name__ == '__main__':
    uvicorn.run(router)

Session table

The admin uses session auth, which requires a database table.

Add piccolo_admin.piccolo_app to the APP_REGISTRY in your piccolo_conf.py project file, then run:

piccolo migrations forwards session_auth

To learn more about the Piccolo project files, check out the docs.

Contributing

The backend is just vanilla Python.

The front end is built using Vue.js. To make modifications, clone the repo, and cd into the admin_ui directory.

Install the npm dependencies:

npm install

And then you can launch the admin as follows:

npm run serve

It will auto refresh the UI as you make changes to the source files.

The UI needs an API to interact with - the easiest way to do this is to use the demo app.

admin_demo

# Or alternatively
python -m piccolo_admin.example

You will need to configure a local webserver as a proxy - see extra/piccolo_admin.

Download Details:

Author: piccolo-orm

GitHub: https://github.com/piccolo-orm/piccolo_admin

vuejs javascript database

Bootstrap 5 Complete Course with Examples

Bootstrap 5 Tutorial - Bootstrap 5 Crash Course for Beginners

Nest.JS Tutorial for Beginners

Hello Vue 3: A First Look at Vue 3 and the Composition API

Building a simple Applications with Vue 3

Deno Crash Course: Explore Deno and Create a full REST API with Deno

How to Build a Real-time Chat App with Deno and WebSockets

Convert HTML to Markdown Online

HTML entity encoder decoder Online

Hire Dedicated VueJS Developers

Want to Hire VueJS Developer to develop an amazing app? **[Hire Dedicated VueJS Developers](https://hourlydeveloper.io/hire-dedicated-vue-js-developer/ "Hire Dedicated VueJS Developers")** on the contract (time/project) basis providing regular...

The essential JavaScript concepts that you should understand

The essential JavaScript concepts that you should understand - For successful developing and to pass a work interview

AlaSQL in Action: The JavaScript SQL Database

Overview on AlaSQL, the popular lightweight client-side in memory SQL database, including a real life example of AlaSQL in action. I was surprised to see that there aren’t more posts about this popular lightweight client-side in-memory SQL database online apart from this awesome article I found.

JavaScript Memory Management System

The main goal of this article is help to readers to understand that how memory management system performs in JavaScript. I will use a shorthand such as GC which means Garbage Collection. When the browsers use Javascript, they need any memory location to store objects, functions, and all other things. Let’s deep in dive that how things going to work in GC.

Create a Marvel Database with SQL and Javascript, the easy way

In this post I explain how to create a Marvel Database (or a DC Database) using Wikipedia, Javascript and SQL. We will make a flexible tool that allows you to create different tables to use in your projects. The concepts explained here can be extended for other subjects.