Introduction to Probo-ui — Write HTML Entirely in Python series

A tutorial series, DEV.to blog series — from your first HTML element to production-grade User Interfaces, all in pure Python. Modern Python web frameworks force developers into a split workflow: business logic lives in Python files with full IDE support, while presentation logic is exiled to template files that offer none of it. Template languages like Jinja2 introduce their own syntax for conditionals, loops, and variable access — syntax that your linter cannot check, your type checker cannot verify, and your debugger cannot step through. Every context variable passed across that boundary is a potential KeyError waiting to surface at runtime. Probo eliminates this divide entirely by making HTML a native Python construct — written, validated, and refactored with the same tools you already use for the rest of your codebase. PART 1: Introduction to Probo — Write HTML Entirely in Python What is Probo? Probo is a Python-first, declarative UI rendering framework . Instead of writing HTML in .html files or using template languages like Jinja2, you write everything in pure Python. No template files. No string concatenation. No f-strings full of angle brackets. Just Python functions and classes that are your HTML. The Two Flavors of Every Tag Every HTML tag in Probo comes in two forms: Flavor Example Returns Use Case Function (lowercase) div() , h1() , p() Rendered HTML Quick rendering, lightweight Class (uppercase) DIV() , H1() , P() SSDOM tree node Tree manipulation, streaming from probo import div , DIV # Function: returns a string immediately # return_list=True html_string = div ( " Hello World " ,) # → "<div>Hello World</div>" # Class: returns a tree node, call .render() to get the string node = DIV ( " Hello World " , Id = " main-title " ) # Because it's a Node, you can manipulate it dynamically node . add ( div ( " Subtitle added later! " )) html_string = node . render () # → '<div id="main-title">Hello World<div>Subtitle added later!</div></div>' Note: by adding ret