快速搭建web见面

Falko Schindler 43a20079a6 fix formatting of docstrings 2 年之前
.github aae7db89ae switching back to old poetry gh action; seems more stable 2 年之前
.vscode 4f500e88d1 began with first selenium pytest 2 年之前
examples 1c7a1cef17 Merge branch 'yield_for_on_page_ready' 2 年之前
nicegui 1c7a1cef17 Merge branch 'yield_for_on_page_ready' 2 年之前
sceenshots 02e770f4c1 adding docs for some interactive elements 4 年之前
tests 1ba3a11f3b forbid yield on shared pages 2 年之前
.gitignore e54569cada Creating screenshot for every test. 2 年之前
.syncignore 426f420a0f providing ignore file for livesync 2 年之前
LICENSE 0cb68ea25c Adding license 4 年之前
README.md 347b201212 code review 2 年之前
api_docs_and_examples.py 43a20079a6 fix formatting of docstrings 2 年之前
development.dockerfile 4a99a17e50 fixing poetry installation 2 年之前
docker-compose.yml a1e97ac112 fixed port 3 年之前
docker.sh e40f78d90a starting and stopping all services 2 年之前
examples.py 2f562a3c31 sort imports and other formatting improvements 3 年之前
main.py 43a20079a6 fix formatting of docstrings 2 年之前
nicegui.code-workspace 2f562a3c31 sort imports and other formatting improvements 3 年之前
poetry.lock c3def387fe adding pytest 2 年之前
pyproject.toml c3def387fe adding pytest 2 年之前
pytest.ini 16e1b05150 moved pytest.ini to root because pytests are executed from this dir 2 年之前
release.dockerfile 7adead634a adding examples to docker image 2 年之前
setup.py ff08954e1a Increases version to 1.0 for local installations 3 年之前
test_startup.sh 76bfaac70b code review 2 年之前
traffic_tracking.py aae3506c8f storing referrers 2 年之前

README.md

NiceGUI

NiceGUI is an easy-to-use, Python-based UI framework, which shows up in your web browser. You can create buttons, dialogs, markdown, 3D scenes, plots and much more.

It is great for micro web apps, dashboards, robotics projects, smart home solutions and similar use cases. You can also use it in development, for example when tweaking/configuring a machine learning algorithm or tuning motor controllers.

NiceGUI is available as PyPI package, Docker image and on GitHub.

PyPI version PyPI - Downloads Docker Pulls
GitHub commit activity GitHub issues GitHub forks GitHub stars GitHub license

Features

  • browser-based graphical user interface
  • implicit reload on code change
  • standard GUI elements like label, button, checkbox, switch, slider, input, file upload, ...
  • simple grouping with rows, columns, cards and dialogs
  • general-purpose HTML and markdown elements
  • powerful high-level elements to
    • plot graphs and charts,
    • render 3D scenes,
    • get steering events via virtual joysticks
    • annotate and overlay images
    • interact with tables
    • navigate foldable tree structures
  • built-in timer to refresh data in intervals (even every 10 ms)
  • straight-forward data binding to write even less code
  • notifications, dialogs and menus to provide state of the art user interaction
  • shared and individual web pages
  • ability to add custom routes and data responses
  • capture keyboard input for global shortcuts etc
  • customize look by defining primary, secondary and accent colors
  • live-cycle events and session data

Installation

python3 -m pip install nicegui

Usage

Write your nice GUI in a file main.py:

from nicegui import ui

ui.label('Hello NiceGUI!')
ui.button('BUTTON', on_click=lambda: ui.notify('button was pressed'))

ui.run()

Launch it with:

python3 main.py

The GUI is now available through http://localhost:8080/ in your browser. Note: NiceGUI will automatically reload the page when you modify the code.

Documentation and Examples

The API reference is hosted at https://nicegui.io/reference and provides a ton of live examples. The whole content of https://nicegui.io is implemented with NiceGUI itself.

You may also have a look at the following examples for in-depth demonstrations of what you can do with NiceGUI:

  • Slideshow: implements a keyboard-controlled image slideshow
  • Authentication: shows how to use sessions to build a login screen
  • Customization: provides an example of how to modularize your application into multiple files and create a specialized @ui.page decorator.
  • Map: using the JavaScript library leaflet to display a map at specific locations
  • AI User Interface: utilizing the great but non-async API from https://replicate.com to perform voice-to-text transcription and generate images from prompts with Stable Diffusion.

Why?

We like Streamlit but find it does too much magic when it comes to state handling. In search for an alternative nice library to write simple graphical user interfaces in Python we discovered JustPy. While we liked the approach, it is too "low-level HTML" for our daily usage.

Therefore we created NiceGUI on top of JustPy, which itself is based on the ASGI framework Starlette (like FastAPI) and the ASGI webserver Uvicorn.

Docker

You can use our multi-arch Docker image:

docker run --rm -p 8888:8080 -v $(pwd):/app/ -it zauberzeug/nicegui:latest

This will start the server at http://localhost:8888 with the code from your current directory. The file containing your ui.run(port=8080, ...) command must be named main.py. Code modification triggers an automatic reload.

Deployment

To deploy your NiceGUI app, you will need to execute your main.py (or whichever file contains your ui.run(...)) on your server infrastructure. You can either install the NiceGUI python package via pip on the server or use our pre-built Docker image which contains all necessary dependencies (see above). For example you can use this docker run command to start the script main.py in the current directory on port 80:

docker run -p 80:8080 -v $(pwd)/:/app/ -d --restart always zauberzeug/nicegui:latest

The example assumes main.py uses the port 8080 in the ui.run command (which is the default). The --restart always makes sure the container is restarted if the app crashes or the server reboots. Of course this can also be written in a docker compose file:

nicegui:
  image: zauberzeug/nicegui:latest
  restart: always
  ports:
    - 80:8080
  volumes:
    - ./:/app/

While it is possible to provide SSL certificates directly through NiceGUI (using JustPy config), we also like reverse proxies like Traefik or NGINX. See our docker-compose.yml as an example.