Rio: WebApps in pure Python. No JavaScript, HTML and CSS needed!
Tags: python, datascience, opensource
Published: 2024-05-19 09:37:32

Hi everyone! We're excited to announce that our reactive web UI framework is now public. This project has been in the works for quite some time, and we're excited to share it with you. Feel free to check it out and share your feedback!

- [Website](https://rio.dev/?src=dev)
- [GitHub](https://github.com/rio-labs/rio)
- [Demo Video](https://github.com/rio-labs/rio/assets/41641225/44279406-0c2d-47e2-98b5-4582722054b2)

## What My Project Does

Rio is a brand new GUI framework designed to let you create modern web apps with just a few lines of Python. Our goal is to simplify web and app development, allowing you to focus on what matters most instead of getting stuck on complicated user interface details.

We achieve this by adhering to the core principles of Python that we all know and love. Python is meant to be simple and concise, and Rio embodies this philosophy. There's no need to learn additional languages like HTML, CSS, or JavaScript, as all UI, logic, components, and even layout are managed entirely in Python. Moreover, there's no separation between front-end and back-end; Rio transparently handles all communication for you.

## Showcase

Rio doesn't just serve HTML templates like you might be used to from frameworks like Flask. In Rio you define components as simple dataclasses with a React/Flutter style build method. Rio continuously watches your attributes for changes and updates the UI as necessary.

```python
class MyComponent(rio.Component):
    clicks: int = 0

    def _on_press(self) -> None:
        self.clicks += 1

    def build(self) -> rio.Component:
        return rio.Column(
            rio.Button('Click me', on_press=self._on_press),
            rio.Text(f'You clicked the button {self.clicks} time(s)'),
        )

app = rio.App(build=MyComponent)
app.run_in_browser()
```

Notice how there is no need for any explicit HTTP requests. In fact there isn't even a distinction between frontend and backend. Rio handles all communication transparently for you. Unlike ancient libraries like tkinter, Rio ships with over 50 builtin components in Google's Material Design. Moreover the same exact codebase can be used for both local apps and websites.

## Key Features

- **Full-Stack Web Development:** Rio handles front-end and backend for you. In fact, you won't even notice they exist. Create your UI, and Rio will take care of the rest.
- **Python Native:** Rio apps are written in 100% Python, meaning you don't need to write a single line of CSS or JavaScript.
- **Modern Python:** We embrace modern Python features, such as type annotations and asynchrony. This keeps your code clean and maintainable, and helps your code editor help you out with code completions and type checking.
- **Python Debugger Compatible:** Since Rio runs on Python, you can connect directly to the running process with a debugger. This makes it easy to identify and fix bugs in your code.
- **Declarative Interface:** Rio apps are built using reusable components, inspired by react, flutter & vue. They're declaratively combined to create modular and maintainable UIs.
- **Batteries included:** Over 50 builtin components based on Google's Material Design

## Target Audience

Rio is perfect for developers who want to create web apps without spending time learning new languages. It’s also ideal for those who want to build modern, professional-looking apps without stressing over the details

## We Want Your Feedback!

We welcome your thoughts and questions in the comments! If you like the project, **please give us a star on [GitHub](https://github.com/rio-labs/rio)** to show your support and help us continue improving it.