Rio: Web apps in pure Python

by doppp • 2 years ago

200 191 2 years ago

Nice work! Joined the discord

miso2024• 2 years ago

I have always been using Gradio, and it still comes short when it comes to slick UI, even with themes. So it is nice to see solutions like this that has a slicker UI.

atum47• 2 years ago

Is it the run_in_window() method cross platform? Can you talk a bit more about the implementation?

Retr0id2• 2 years ago

afaict it uses https://github.com/r0x0r/pywebview under the hood (so yes, cross-platform)

Sn3llius13• 2 years ago

Nailed it! We use pywebview. (Rio Dev here.)

Local apps run inside of a webview. Think of it like electron but for Python. Even though this _should_ be cross platform, we've unfortunately found a lot of subtle issues with pywebview. That's why we're still considering this to be experimental.

In my experience webview works great on Windows, but struggles on Linux. For examples Videos don't play reliably when using the GTK backend.

We're looking into other ways to run a browser - my favorite would be to just find one already installed and just start it without UI - but that's some way off.

3l3ktr4• 2 years ago

Curious to know what you're using under the hood for the python! I've download the repo and a quick search with "pyodide" didn't return anything.

KeplerBoy• 2 years ago

Is python actually executed in the browser or is there a cpython process running on the backend?

dncornholio2• 2 years ago

No, it needs a server to run. This can be a python process or nginx or anything that FastAPI supports, since this seems to be build on top of FastAPI

8organicbits3• 2 years ago

Looks like htpy, but with some components and a different syntax?

https://htpy.dev/

mlboss• 2 years ago

+1 for htpy. Awesome library.

aitchnyu• 2 years ago

Unlike Htpy, this one has callbacks and state in Python.

8organicbits3• 2 years ago

Storing state in-memory is usually not a good idea for web apps, most use databases with persistence. I got curious and found the example code for implementing password-based authentication on SQLite. I don't think it's very compelling when the alternatives include Django.

https://github.com/rio-labs/rio/blob/41a6bb828c2e20eb7fdc5c6...

DannyPage• 2 years ago

I love Python, but I also love building web apps in the native language of JS/HTML/CSS. Often times these "build the web in X" solutions are amalgamating that language into code that looks almost like HTML or JS, just with a Python flavor. I would love to hear from someone who used to do full-stack and now has moved mostly into a solution like Rio?

babyyoda• 2 years ago

When building a full fledged web app I prefer JavaScript - when I do want to do more in Python I find Streamlit is a perfect fit for Python native, low code, but not trying to do too much

Sai_Praneeth• 2 years ago

Nice! How does it compare to https://fastht.ml/

gmaster1440• 2 years ago

I've enjoyed working with Reflex (https://reflex.dev) as a pure Python wrapper over React.

vishnudeva3• 2 years ago

+1 for Reflex. Truly amazing.

greener_grass5• 2 years ago

How is it writing React without multi-line lambdas?

They are everywhere in JavaScript and I couldn't imagine my day-to-day without them!

a3w• 2 years ago

react license applies then to products made with this stack? i.e. no product that meta thinks of as a competitor is allowed?

pritambarhate• 2 years ago

React is fully OSS as far as I know: https://github.com/facebook/react/blob/main/LICENSE

I think the term you mentioned was there at the start but has since been removed and React is licensed pure MIT since 2017.

pjmlp5• 2 years ago

This kind "you don't need JavaScript, HTML and CSS" approach always fails flat.

We already went down this route several times since the first dotcom wave and all the frameworks that tried to target the browser as if we don't need to know "JavaScript, HTML and CSS".

Until we need to debug the application, or why it isn't rendering as it should.

It is also why I am not a big fan of Blazor, even though I admire its engineering effort.

dncornholio2• 2 years ago

It fails flat when you want to go beyond to scope of the framework. But for teaching programming or quick prototyping or some raspberry project, these are pretty great.

mattgreenrocks2• 2 years ago

Not sure I agree. What makes the presentation layer of HTML/JS/CSS so different from Win32 of yore, which had VB? VB enabled a LOT of bespoke monstrosities, but it let you do things quickly and easily. We need something like that for the web.

There will always be essential complexity in dealing with the client/server nature of web apps. But there's still a lot of incidental complexity that can be burned off.

worewood• 2 years ago

What makes the presentation layer of HTML/JS/CSS so different from Win32 of yore, which had VB?

From my experience: besides both Win32 and VB being from the same entity (Microsoft), which helps a lot, what we had basically were VB bindings for the underlying Win32 library.

This Rio project seems more analogous to a library that tries to do an abstraction on top of Win32, like wxWidgets or Java's AWT. They work but the end results always seem a bit "off".

And unlike Win32, web technologies are moving targets and any assumptions one makes may be wrong some browser updates down the line... and there's where the nightmare comes

pjmlp5• 2 years ago

Because of the rendering features provided by HTML, CSS and JavaScript semantics.

That is why Flash became so loved by Web designers, allowing them to target a rendering surface, completely bypassing the browser.

Also why we are now having Flash's revenge with WebGL/WebGPU/WebAssembly.

However the "until you have to debug it" still applies, unless you ship the browser with the application, but that isn't something people usually do. /s

wiseowise7• 2 years ago

We need something like that for the web.

It’s called HTML/CSS/JS.

rty32• 2 years ago

I find these projects very interesting as ideas but never ever suitable for any serious purpose. Not even for my personal website or blog. As soon as you approach the boundary of what the project provides, you are completely on your own. Also, unlike "established" projects, they may stop being maintained at any point. That's the reality.

Sn3llius13• 2 years ago

Hey, Rio dev here. Love to see us on Hackernews <3

Rio comes with its own set of debug tools, so I don't see debugging as a problem. Our components even explain their entire layouting flow, so I'd argue debugging Rio layout is much easer than CSS :P

For example, here's an excerpt of what the built-in dev-tools have to say about a button in one of my apps:

The component was allocated a width of 104.0 by its parent MyRoot. Due to align_x being set, the Button only takes up the minimum amount of space necessary and is centered in the available space.

eigilsagafos• 2 years ago

As developers/engineers we love to solve problems. Too many times though we mislabel "friction" as "problem" and then start trying to solve the friction based on our current skill set or viewpoint. So frontend devs feel friction working backend and vice versa leading to all sorts of efforts like this that mostly fail. Good luck though :)

8organicbits3• 2 years ago

It would be a lot easier if they didn't rename things. 'Text' becomes 'span' and 'justify' becomes 'text-align'. Unless there's more I'm missing, it looks like they've just added a layer of indirection.

    rio.Text(self.name, justify="left"),

Becomes:

   <span style="[...] text-align: left;">Dataset 1</span>

I'd prefer:

    rio.Span(self.name, text_align="left")

Sn3llius13• 2 years ago

We don't see ourselves as Python bindings for the web, but instead as a pythonic way to create apps. I understand that "span" has become a well known name amongst web developers, that's just not something most new developers understand.

Think of it like how Python has renamed a lot of things. What other languages call arrays, Python calls lists. HashTables are dicts, and so on. Python has faced a lot of resistance here from people that got used to the more technical names, but I think the popularity of the language speaks for itself. Easy to understand, meaningful names are a plus, not a downside :D

positus• 2 years ago

Using the term "justify" is very common outside of web. It's been used for decades in print ("left justify / right justify / center justify"). This is indeed a web project though, so I hear what you're saying.

magnio• 2 years ago

Yeah, that's gonna be annoying when you want to read HTML & CSS documentation and translate it to Python. How do you differentiate text-align, justify-content, justify-items, and justify-self?

vanviegen• 2 years ago

Their goal is for their target developers not to have to learn html and css. Text and justify make a lot more sense to those whose layouting experience is mostly based on MS Word then span and text_align do.

Also, let's not pretend that html/css is particularly well designed or easy too learn. It's the backwards compatible result of decades of experimentation, where the initial design did not even remotely consider building interactive apps with it.

Modern web app dev requires learning way to much (archaic) stuff, just to create something that ought to be simple. Rio at least seems to be trying hard to address that.

Sparkyte• 2 years ago

At yes lets use a screwdriver to do something which a hammer was meant for and call it progress.

That is what I read when I read the title. People should think about what a language's purpose is before planning to interate a technological design around it. Python is very good for many things just not this...

skeledrew9• 2 years ago

What exactly makes Python (the language) not good for this? Keep in mind we now also have PyScript.

zdragnar• 2 years ago

Remember GWT? I sure do.

pjmlp5• 2 years ago

Vaadin is still around.

davidsgk• 2 years ago

Going from GWT at my first internship to regular HTML/CSS/JavaScript at the next (before even TypeScript) was such a fresh experience.

ashconnor• 2 years ago

Apache Wicket

j45• 2 years ago

Now, python having some experimentation like this is quite nice to see.

I agree with some of what you’re saying and it made me think of how common this is or not.

It appears this renders html using python syntax.

Just like any html avoidant libraries of JavaScript that need to be debugged.

React can have debugging too to output html.

Maybe less so but still the case for Rails for Ruby.

jtr1• 2 years ago

Frontend dev here. I think it’s important to remember that there’s not necessarily one use case to rule them all when it comes to the web. If this helps a smaller project that is Python-first get their work in front of a wider audience, is that a bad thing? I’m inclined to think it’s just fine to have lots of approaches available.

Onawa• 2 years ago

I would argue that it depends on your skill as a developer, the stacks that you're familiar with, etc. As an example I work with a lot of scientific developers who are familiar with python and R but don't know anything about the website needing to make a web application. They're also not trying to optimize for thousands of users or have the cleanest interface. Technologies like Dash, Bokeh, Stream lot, and Shiny for Python and R all help these types of people make a functional web application for a small set of users without having to go down the rabbit hole of web technologies.

TrackerFF• 2 years ago

Back when I started programming, building programs with GUI was a breeze. Whether it was using Delphi, VB and WinForms, later .NET, or whatever - it was so easy that even complete beginners could get the hang of it.

At least for me, there's some nostalgia involved. The longing of "simple" - at least for smaller apps / software. Being able to slap together some simple app in 15 minutes.

afavour3• 2 years ago

IMO you either need to go all in or not at all. And by all in I mean your "web page" is nothing but a <canvas> tag and your non-web framework is handling basically everything. It's an unholy nightmare for many reasons but it would at least allow you to make a reliable self-contained system.

"We'll take your native constructs and jimmy them into some bastardized HTML" is almost always full of razor-sharp edge cases.

moffkalast• 2 years ago

Well that but with WebGPU just might work without turning your app into lagtown central, in a year or five when it's widely supported anyway.

pjmlp5• 2 years ago

Welcome to what made Flash took off in first place.

Sn3llius13• 2 years ago

Agreed! And indeed we are still considering switching Rio to a Canvas + WebGL/WebGPU. The reason we've decided against it for now is accessibility, and weird edge cases such as Copy & Pasting.

bobbylarrybobby• 2 years ago

How does a screen reader interact with one of these canvas pages?

wiseowise7• 2 years ago

And by all in I mean your "web page" is nothing but a <canvas> tag and your non-web framework is handling basically everything

What a huge step back for the web.

explorigin• 2 years ago

Streamlit seems to be doing ok.

manojlds• 2 years ago

With tailwind people aren't writing CSS anyway (technically)

pmarreck2• 2 years ago

Are there any other frameworks that have similar ideas, perhaps using a functional language?

airstrike2• 2 years ago

If you count Rust as a "functional language", my personal favorite is iced, which is bloody brilliant and blazing fast https://github.com/iced-rs/iced

It's desktop-first but compiles to WASM

It's honestly "just Rust", so I guess if you're looking for a DSL-type declarative, it doesn't quite fit the bill... but there are design reasons for why it's "just rust" and honestly I much prefer it. It still feels declarative enough

kitkat_new2• 2 years ago

slint is more declarative, supports Rust and Python

patrickmay• 2 years ago

If you choose to use Common Lisp as a functional language, CLOG is available: https://github.com/rabbibotton/clog

zem3• 2 years ago

elixir's liveview is perhaps the best known and arguably inspired a lot of the ones in other languages

pmarreck2• 2 years ago

yes but doesn't that expect view code that looks a lot like HTML and is usually styled with Tailwind?

tambourine_man• 2 years ago

Why the name Rio? Couldn't find in the docs

red_hare• 2 years ago

These frameworks are cute, and I understand the desire to avoid the modern SPA JavaScript build systems, but it always seems like so much more work than just writing HTML.

I swear, HTML/CSS + Flask + HTMX gets you so far these days. Then, you can throw in some AlpineJS for any inter-element interaction you need and build a responsive SPA without almost any JavaScript.

Sn3llius13• 2 years ago

Rio Dev here. I can see where you're coming from. Seeing an experience web-dev work can be mindblowingly fast. But there's two sides to each story - there's tons of developers that are experts in their own fields but that aren't familiar with web technologies. That's where frameworks like Rio, streamlit, reflex, etc. come in.

We've been getting a lot of reactions from people being surprised how quickly they can create Rio apps after just a few hours, when previously creating UIs was always a major roadblock for them. Seeing these reactions has been extremely rewarding.

spankalee• 2 years ago

And you don't even need build systems for modern SPAs. You can write web components in plain JS, load JS and CSS with standard module imports. Use bare import specifiers with import maps. Things have gotten much simpler.

fkyoureadthedoc3• 2 years ago

Alpine is great for your blog, but it's not even a little bit tempting for real world professional projects. Looking back at every project I've worked on there's no shot I would ever select Alpine for any of them.

These type of condescending comments really scream "I'm not even a web developer but here's my strong opinion as someone who only makes toy front ends to demo my data work"

zem3• 2 years ago

would you use one of these python-to-web frameworks like rio though? I think gp was just saying alpine was a good alternative to that.

rmbyrro• 2 years ago

An undesired level of condescendence for a message against it, no? My first impression...

pier252• 2 years ago

Back in the day we did plenty of "real world professional projects" with jQuery.

I don't see why you couldn't with Alpine.

Yeah at some point you may need a more sophisticated solution but plenty of projects don't need React. This very forum you're using is just a very simple vanilla js file.

robertoandred4• 2 years ago

Flask + HTMX + AlpineJS always seem like so much more work than just writing JavaScript.

beretguy• 2 years ago

All of it is so much more work compared to PHP + HTML + CSS (and no JS).

mike_hearn• 2 years ago

Another rather unconventional way to do this, though it can be powerful, is to combine GraalPython, JavaFX and jpro.one:

https://www.jpro.one

The primary advantage is that the built in set of components is pretty powerful (e.g. a real table view), everything runs server side, the Python can be JIT compiled, and from the user's POV it still feels like a web app (e.g. zoom is respected). You can "shell out" to Javascript if needed, you can use Java libraries. The JPro website is itself a JavaFX app running as a web app. Also there's a visual UI builder that's decent (and free).

Primary downside beyond just the obscurity of the stack (same problem as for Rio), is just that JPro is a commercial solution. But then you get commercial support and bug fixes in case you need something special or hit an obscure rendering case.

mwcampbell• 2 years ago

I should caution that the jpro.one home page has some pretty obvious screen reader accessibility issues. Assuming the website is rendered with the framework itself, I wouldn't be comfortable using that framework in a real application unless someone did a comprehensive accessibility audit first.

montebicyclelo• 2 years ago

Nice, I guess a more established framework for writing webapps in Python is Streamlit, which is pretty good - minimal syntax can create quite an advanced, "reactive", GUI. It's very quick to throw together functional / relatively complex stuff with. But it's also very opinionated, so all Streamlit apps tend to have a similar look. Also it's more aimed at ML demos, for a few, non-persistent users, rather than for large apps with persistant users, etc. Wonder how this compares.

maipen• 2 years ago

Every framework, requires a learning curve.

You need to spend time learning how it works, what are it's limitations and what not.

The newer it is, the fewer components, help and support you have at your dispose.

I don't like these frameworks because it tempts people to learn something that isn't going to get mainstream adoption.

We already have to be careful when choosing a framework like React, vue, svelte etc...

Are you building a side project? You probably should just do it with what you already know, it's gonna be faster and probably better.

Not saying we shouldn't try new things or build new ways of doing stuff, but in this case you are not really running your python code on the web, your running compiled js,html and css...

I much rather choose something that allows me to write vanilla js with some extra features like signals.

ramon156• 2 years ago

What would solve these issues is backwards compatibility. I want to be able to write a full JS/HTML app, a full "framework specific" solution, and anything in between.

Let me migrate my current project into the new framework and see what the experience is like. Let me hack some stuff together for fun, only then I'll consider the framework.

igtztorrero• 2 years ago

Good for python developers without JavaScript knowledge, but your app will be attached to a fixed same graphic style.

Sn3llius13• 2 years ago

Rio dev here. You're right in that all Rio components use Material Design, but there is still room for configuration. I can't post pictures here, but if you check our discord, somebody has made a full-retro website that doesn't look material-y at all.

In addition to high-level components there's also some very basic building blocks, like a humble Rectangle. By combining these in clever ways you can get more styles than you might originally expect - just like everything on the web is ultimately colored boxes.

meehai• 2 years ago

how does this compare to streamlit ?

bnchrch2• 2 years ago

While I'm not certain if the world needs more Javascript,

I am certain it does not need more Python.

imiric• 2 years ago

That's overly harsh IMO.

Python is not perfect—no language is—but it arguably has the lowest barrier to entry for new programmers, with far fewer "wats" than languages of its kind and era (certainly less than JS). Sure, its reference implementation is not the most performant, but it easily interoperates with C/C++, and alternative implementations like PyPy are also relatively easy to switch to, so it can be performant when it needs to. Dynamic typing is not great for maintaining large codebases, but with the advent of gradual typing, this shouldn't be a major hindrance anymore. It has a great standard library, and a huge ecosystem. My only major gripe with it is the packaging and the insane amount of tooling around it, which I doubt will ever be resolved at this point. But Python is not so bad overall.

bnchrch2• 2 years ago

I don't know if its overly harsh, but ill give you harsh.

The thing is Python deserves all the hate JS gets and more.

1. The foot guns are real and mean (look up Mutable Default Arguments)

2. The language pushes beginners towards some bad habits (Deep inheritance) and away from good ones (Functional)

3. The performance is very poor (both single and multi threaded)

4. There are no real safe guards, and unexpected type behaviour

5. The packaging story is archaic with no fix in site. (There exist no standard out of the box way to guarantee deterministic builds)

Sure its good at Data, but that is a cultural accident, not by design.

timkq4• 2 years ago

"Dynamic typing is not great for maintaining large codebases" - when your language has an option to not use types, most SWEs will NOT use them - I experienced this firsthand (Angular TS codebases littered with "any" types - direct equivalent analogy to Python in this case). I heard the saying, "you can only burn yourself so many times" - but this seems to be untrue in this case - it's as infinite as human stupidity is.

Ecosystem is great - and probably the greatest thing Python has to offer after the aforementioned low barrier to entry. No language comes close if one wants to get up & going and try out AI/ML - whether using an API or using some packages to make models of one's own - it has everything one can ever need.

ZeroCool2u• 2 years ago

This looks almost identical to Dash. Any meaningful difference here? https://dash.plotly.com/

weakfish• 2 years ago

I would hesitate to label anything Python as “type-safe” per the README - maybe type-conscious or just “typed Python”

insane_dreamer• 2 years ago

I love a framework that replaces JS with Python. I'm less certain about replacing HTML/CSS with Python?

joshdavham3• 2 years ago

Me too, but I’m curious where this could lead!

surfingdino2• 2 years ago

It's amazing how much you can build without resorting to those fancy frameworks if you dedicate some time to learning Django and how its views work. You do not need a SPA, you need a working app that looks good.

robertoandred4• 2 years ago

Why would I want to dedicate time to learning Django when I can just use a simple React framework?

mrweasel• 2 years ago

In general I'm not convinced that these "no Javacript" frameworks will last, and to some extend you going to have to re-learn a lot. That's not to say that the idea isn't interesting.

While I have no idea how this would work, I think it would be more useful to have tools like this as a sort of template language for something like Django or Flask. So you get the mature frameworks on the backend and something like Rio to generate the backend, within the context of Django/Flask/Bottle/whatever.

Some modern web applications do need VueJS, React, something like that. CRUD apps mostly don't, but we are way past CRUD apps for a lot of thing. You can maybe get away with calling Asana and Jira CRUD apps, but you can't do Figma with just Django.

surfingdino2• 2 years ago

Agreed. There are legitimate cases for using SPAs, but often CRUD will suffice.

fmnxl• 2 years ago

You'd need to re-invent the wheel on so many things.

Flexbox layout? CSS animations? Some custom npm library that I need to use to provide social logins, SDKs to integrate payment gateways? etc etc

If all you want is just a set of UI components, sure. We already have plenty of UI libraries out there.

These days there are many better ways to write low-JS, low-boilerplate code. HTMX for interactivity, UnoCSS for generated CSS on the fly. It's even possible not to bundle your ES6 modules these days, with <script type="importmap">.

fsndz• 2 years ago

I will start using this once a startup raises millions in VC funding and their whole app is built with this.

apetuskey• 2 years ago

https://reflex.dev/ is all made in Reflex and has raised a seed round! There are also a few YC companies using Reflex that have raised seed rounds too.

tempest_• 2 years ago

The VC bit is the entire reason I would not use something like this.

Just waiting for them to want their money out and then I am stuck deep in a product fast headed for enshitifaction or abandonment when it fails to make a billion dollars in 2 years.

ag_rin• 2 years ago

I feel like you’re getting a lot of pushback on this and I’m going to go out and say this is cool and I’m glad people continue to try to innovate on the webdev experience.

The way I see it is building apps somewhat similarly to SwiftUI is actually a pretty good idea. If you have established rules for how each container expands or fills its content you can build a great web app development experience without getting down into css and html explicitly. Just Vbox container Hbox container text container etc. I can certainly see a niche for this as it is a different style of UI development.

I’ve never been great as a UI designer so doing it in the traditional web stack has always been even harder but I’ve found that with SwiftUI I can usually get 90% of a good look very quickly.

jhot• 2 years ago

I spend 95% of my work time doing backend python microservices for internal tools, 5% on terraform for the infrastructure, and 0.0001% of my time building frontends for these tools (I just use plain html and JS, and only add a frontend when absolutely necessary). I've build a react app for fun in the past just to learn how that works but if I had to do it again for work I would basically have to go through the entire learning process again.

So, something like this where I'm writing pure python for my web components could really save me a lot of that churn time, not to mention that many of my coworkers have absolutely no JS experience. I have an upcoming task to build a new frontend and am going to add in a couple days to try this out to see if it meets our needs.

davepeck3• 2 years ago

I'm excited to see more projects like Rio exploring the full-stack python web dev space. There are definitely categories of users for which the approach makes sense.

---

For me personally -- and I'm guessing for a bunch of other HNers -- writing full-stack web apps strictly in python is a non-goal.

I've settled on a comfortable (for me) stack for smaller projects that need python on the backend that combines:

1. Litestar (or another lightweight HTTP framework of choice like flask, etc.)

2. HTMX

3. htpy.dev (an in-python HTML builder)

4. Custom web components implemented in a plain-old JavaScript ES6 module loaded directly by the browser

A typical project only needs a handful of components. HTMX and htpy.dev both play very nicely with web components.

When I want zero build steps, I write plain JavaScript + JSDoc comments. JSDoc is... okay-ish, but it ain't no typescript.

If I need a database, I'll grab SQLAlchemy. I wish there were a mature lightweight solution here; maybe Tortoise ORM will get there soon?

There's nothing in this stack that couldn't strictly be done in javascript-land. JSX syntax with HTMX is pretty great and much better than any in-python HTML builder. But often my projects have other requirements (like ML) where python is, at least today, inevitable.

synergy20• 2 years ago

Hopefully JSX can be more mainstream, that is, I can use it directly in js/html/css projects without all the extra tools pre-installed and pre-configured, making jsx part of the 'vanilla' development will be really nice(no react, no vuejs etc).

timkq4• 2 years ago

I agree about the JSX part - but the thing about real dev is that you have to use all the tools you can, so you don't have to reinvent the wheel. Nobody's still making Windows-only GUI apps using the Win32 API - it's easier and all, but there's so much stuff you have to code yourself that it's simpler to learn a GUI library/framework and Just Use That. I had a quick glance at HTMX - and it seems to just be going backwards (similar to Go - the language is so simple that it's actually hard to code real stuff in it). Why should I make an API that's essentially web only (because you have to send back HTML from the server using HTMX) if I can just use JSON/Protobuf/etc. and with just a few build tools I can automatically generate functions that I can call directly in JS. Sure, it's easier to build a website with plain JS (and by that HTMX, which is glorified plain JS) but this is the real world.

mixmastamyk4• 2 years ago

Where’s a good place to learn about the web components aspect? I’ve tried a few times (and the shoelace docs) but it doesn’t stick.

davepeck3• 2 years ago

I may be the wrong person to answer, alas. I nearly entirely avoid the machinery of web components.

With the stack above, I typically write small classes that derive from HTMLElement and implement a couple key callbacks (usually, connectedCallback and disconnectedCallback). In those, I typically (a) initialize state by reading attributes from the DOM and (b) configure event handlers. Pretty simple.

That's... about it. I'm templating elsewhere, so I avoid using web component templates. And the less I think about the shadow DOM, the better.

For this, the MDN documentation on custom components is enough.

nomdep2• 2 years ago

If I need a database, I'll grab SQLAlchemy. I wish there were a mature lightweight solution here; maybe Tortoise ORM will get there soon?

[Peewee ORM](https://docs.peewee-orm.com/)

davepeck3• 2 years ago

Peewee never quite got there IMO, and it hasn't kept up with the times (modern asyncio, etc.)

Sn3llius13• 2 years ago

Rio dev here. I 100% agree with you. We aren't expecting for JS developers to flock to rio en-masse. Instead, we're targeting the many, many Python devs that have been completely left out in the web revolution and are still stuck construcing user-interfaces using tkinter and similar.

bityard2• 2 years ago

It's a bit sad that most of the comments here are negative. Most of them seem to be some variation of, "Nobody needs a tool like this, all you have to do is simply dedicate yourself to multiple years of writing corporate CRUD apps in both vanilla soul-crushing Javascript and web frameworks. You know, like I did."

So, I am the target audience of this. I have a LOT of experience writing tools and automation and that is where most of my Python knowledge comes from. I am not an expert Python programmer, but I am competent.

But sometimes, I have an idea for writing a web application that would greatly improve my day-to-day life in some way. I know exactly what I want it to do, I know exactly what I want it to look like. I have already designed the API in my head, and could probably write the bulk of the Flask code in under an hour. Maybe a couple of hours if you want tests. But what I DON'T have is the time to learn is the vagaries of HTML+CSS layout and internalize the Great Lessons of the last 20 years of JS development history.

I have consciously stayed away from (non-trivial) web development because the tooling and patterns change almost daily. But the old stuff is not replaced, it is simply bolted on top of. And you have to know the WHOLE stack in order to troubleshoot most any part of it. Waking up one morning and saying, "I know a fair amount about computers, I want to write a web application," is just about as fanciful as saying, "I know a fair amount about airplanes, I want to design a jet engine."

Rio devs, thank you for releasing this as open source. I look forward to checking it out. Even if it doesn't pan out for me, I appreciate that you took a crack at it.

darepublic2• 2 years ago

Ok that's great. I guess I'm just skeptical you won't have to either A. Settle for premade layouts B. Learn some CSS like specification of custom styles. And that is where you get sucked into the rabbit hole

thunky• 2 years ago

Settle for premade layouts

Just think of how many man years we could have saved if we did this.

Sn3llius13• 2 years ago

Nope! No premade layouts, and not a single line CSS. Give it a shot :)

thegiogi• 2 years ago

On the css side, I can tell you that rio (that is by no means the first library of its kind) actually does not require any knowledge of css to be used. It does not use the same concepts. While the simplification costs you some levels of customization, it is not something that would truly matter in a lot if not most of its use cases.

The simplified layout system comes with its own inspection tool built into the dev version of your app so you get productive in an hour or so. They really got that part right in my opinion. As soon as they make custom components done I’m gonna discuss adopting it for our internal tooling.

I am not affiliated with them btw.

Sn3llius13• 2 years ago

Thank you so much for the kind words! It's always great to read messages like this.

I can't wait to hear your feedback

wiseowise7• 2 years ago

because the tooling and patterns change almost daily.

That is just plain wrong. And that comes from someone who stayed from web dev for the same reason. Nowadays it’s vite/esbuild and you’re good to go.

And you don’t need any web framework to come up with basic ui.

touch index.html; touch styles.css; python3 -m http.server

And you’re good to go.

"I know a fair amount about computers, I want to write a web application," is just about as fanciful as saying, "I know a fair amount about airplanes, I want to design a jet engine."

This analogy makes no sense.

jononor• 2 years ago

Last time I (kinda halfway / didn't) learned frontend it was react-create-app. Before that webpack. And before that grunt.

You do not need a framework if you really know CSS and HTML5 well, but that is exactly "knowing the whole stack" - which was the parents point.

bityard2• 2 years ago

Well, both of those things were hyperbole, not really to be taken quite so literally.

joezydeco• 2 years ago

Coming off yesterday's Qt discussion (summary: it's fucked up and there are no usable alternatives in embedded), I was dreading the possibility of having to learn Node/React to make anything usable on future projects.

This may have come along at exactly the right time. I'm kind of interested.

lburton• 2 years ago

I agree frameworks like this are great to see. I wonder how it compares with https://nicegui.io which is something I've used to build several small web applications in pure python (and wrap one up with their included pyinstaller based packer into an executable).. Either way, also glad to see competition in the space.

korantu• 2 years ago

It is very useful to me, even though I know some webdev. For projects where you need to expose majorly python functionality on the web, and don't want to add whole other dimension and toolkits to your python code, this is brilliant.

darepublic2• 2 years ago

To be fair a lot of small startups could benefit from forgoing custom CSS styles for very straightforward frontend dev. So much money wasted on react devs imho (including myself)

robertoandred4• 2 years ago

Don't hire a React dev, hire a web dev.

joshdavham3• 2 years ago

Looks cool! But I'm wondering who the target audience is. Most web devs prefer javascript. Are you hoping to target data scientists to build data apps, for example?

Sn3llius13• 2 years ago

Exactly! We've seen from personal experience just how many people are currently working on AI/datascience projects and would love to create UIs for them, but just can't. That's exactly who Rio is for - people who are experts in one field, and don't want to invest hours and hours into other languages just to create interfaces for what they're working on.

joshdavham3• 2 years ago

That’s really smart. I was previously a data scientist who only knew python and made the transition last year to become a full stack web dev and I honestly had no idea what I was in for. I probably won’t use your tool, but I’ll happily recommend other data scientists check it out so they don’t have to go through what I did.

kitkat_new2• 2 years ago

I probably don't want to know about the performance implications

quantadev4• 2 years ago

The biggest tragedy in the history of software engineering was back in the mid 1990s when they failed to get Java (Applets) to run in the browser so they had to invent JavaScript, which was purely nothing but a hack put together over a weekend by one guy and it "stuck" like napalm onto humanity and has been burning us ever since. I would say at least one billion man hours (100 billion? Trillion?) has been wasted trying to contend with all the ugliness that ensued. Even the most popular language today on the web TypeScript only has one reason for existing: To try to continue to work around this napalm fire, in some semblance of a tolerable way.

Sure I love TypeScript, and use it every day, because it's the best solution to the current dumpster fire, but I'd like to get away from dumpsters some day. So it's really refreshing to see something good being done to replace this mess we call "Web Development"

mixmastamyk4• 2 years ago

Applets did run in the browser, I wrote a couple.

quantadev4• 2 years ago

I wrote lots of Applets too. My parenthetical "(Applets)" in that post was misleading, sorry.

Java and Applets pre-existed JavaScript, and purely due to a 10 day timing constraint put on him by Netscape management (right after their deal with Sun Microsystems), Brendan Eich, wanting a Java-syntax, but not having enough time to do it right, cobbled together JavaScript instead.

meiraleal• 2 years ago

Java is the new COBOL in many places, thanks God it is not part of the browser. Such a terrible development of language, terribly slow for anything desktop, terribly slow as DX. We would have 100x more people complaining if there weren't a script attached to that Java.

quantadev4• 2 years ago

Most people just can't objectively do the "Counterfactual Thinking" of what if only Java had ever existed and JavaScript never did.

Any developer who has loved JS all their lives would've also loved Java if that's what was available to them all their life. It's largely just what you're used to.

Running JS on the server side is just a mess, and has only been popular to do since NodeJS was invented. Imagine if it was always the SAME code on both client and server starting since 1995. That would've definitely been a better world by far.

chirau• 2 years ago

Is the rio.dev website built with Rio?

Technetium• 2 years ago

"Once your components are ready, you can mix and match them to create entire web applications. Even this entire website is written in Rio."

senko• 2 years ago

I am definitely target audience for this.

I am often in need of building internal tools, dashboards - simple apps with simple UI that doesn't need to be unique, drive engagement, or whatever. It needs to get the job done and let me move on.

Streamlit is close but the peculiar approach they take (rerun the script) makes it unwieldly for more complex apps (say, a few related pages, a few dozen components each).

I've been looking for a way to just let me do "GUI app in Python" that get delivered over HTTP and rendered in browser, and Rio is exactly what I was hoping for.

Yeah, no chance Meta will rewrite FB frontend to use Rio. Also pretty sure that I won't be doing any fancy websites in it. But if I can skip dealing with React/Vue/HTMX/whatever on the frontend for some internal thingy.

I only tried doing some simple stuff but so far I really like what I see!

abdullahkhalids• 2 years ago

How difficult is it to add authentication in this framework? How many lines of code? How secure?

None of the python->web projects have this.

timkq4• 2 years ago

I agree with your sentiment. There's so many non-JS/TS frontend webapp frameworks (using either Kotlin, Go, Python, etc. - not even talking about the WASM ones) - but they all come to a halt once they actually need to use those frameworks besides writing a simple blog site, HN reader, etc.

marcelr• 2 years ago

so, uh, how does this work?

liveview kinda deal? python to js compiler? something else?

it drives me nuts when this isn’t in the readme, or from what i can find the docs

this is a major implementation detail that will determine the usecases for apps written in rio

somesun• 2 years ago

there are maybe 50 web framework / app builder in python

just like there are new frameworks everyday in javascript

Rio: Web apps in pure Python

Related Stories