Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

toui

Package Overview
Dependencies
Maintainers
1
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

toui

Creates user interfaces (websites and desktop apps) from HTML easily

  • 3.4.2
  • PyPI
  • Socket score

Maintainers
1

ToUI Image

License PyPI - Downloads Latest version Docs

Overview

ToUI is a Python framework for creating user interfaces (web apps and desktop apps) from HTML code easily. It allows you to call your Python functions from HTML. No JavaScript knowledge is required, but some knowledge of HTML is usually required.

Why ToUI

  • Converts HTML and CSS files into a fast-responsive app using Python alone.
  • Simple to understand for programmers who only know Python and HTML.
  • Edit HTML files dynamically.
  • The method of creating websites and the method of creating desktop apps are similar, which makes it easy to convert a website to a desktop app and vice versa.
  • Contains features that will greatly support you while creating your apps, such as:
    • Sign-in feature
    • User-specific database
    • Uploading and downloading files
    • Google sign in (experimental)
    • Firebase (experimental)
    • Password protection for your app

Preview

Calling a Python function from HTML code

gif

Simple calculator

gif

Follow the link below to preview a live app created using ToUI:

https://toui-92bd1594dbed.herokuapp.com/

To download this template and customize to create your own web app, go to this section.

How to install

Run this command:

pip install toui

To install only the required dependencies, run these commands:

pip install --no-deps toui
toui --minimal-reqs

How to create a basic website

Import the required classes:

from toui import Website, Page

Create a Website object:

app = Website(name=__name__, assets_folder="path/to/assets_folder",  secret_key="some secret key")

Create a Page and add it to the website:

main_page = Page(html_file="path/to/html", url="/")
app.add_pages(main_page)

Run the app:

if __name__ == "__main__":
    app.run()

The complete code:

from toui import Website, Page

app = Website(name=__name__, assets_folder="path/to/assets_folder", 
              secret_key="some secret key")

main_page = Page(html_file="path/to/html", url="/")
app.add_pages(main_page)

if __name__ == "__main__":
    app.run()

How to create a desktop app

Creating a desktop app is similar to creating a website. Only replace Website class with DesktopApp:

from toui import DesktopApp, Page

app = DesktopApp(name="MyApp", assets_folder="path/to/assets_folder")

main_page = Page(html_file="path/to/html", url="/")
app.add_pages(main_page)

if __name__ == "__main__":
    app.run()

Start with a template

To start with a basic template for a ToUI project. Run the command:

toui init

You can find the same template here.

To start with a full template that includes a Home page, an About page, Contact page, a simple Calculator page, a Sign-in page (including Google sign-in), a simple Dashboard, and more, run the following command:

toui init --full

You can also find the full template here. Additionally, you can find a live preview of the template in this link: https://toui-92bd1594dbed.herokuapp.com/

Make the app responsive

Check this example and other examples to learn how to make the website / desktop app responsive.

Deploy the app

You can deploy the web app the same way you deploy a Flask app (How to deploy Flask app). The only difference is that you need to access the Flask object first:

app = Website(__name__)
flask_app = app.flask_app

Then you need to deploy the flask_app and not the app.

How to contribute

ToUI welcomes contribution, small or big. For anyone who wants to contribute please check the contribution page.

License and Copyrights

Copyrights (c) 2023 Mubarak Almehairbi. This package is licensed under the MIT license.

Documentation

You can find the documentation in this link: ToUI docs.

FAQs


Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc