To make a long story short, I was disallowed to use Python (and Java) at work.
But that's only limited to major OS, right?
So, I searched for Python for browser and found Brython and it looked promising, I immediately used it.
Brython (Browser Python) is an implementation of Python 3 running in the browser
Brython is under a BSD-3-Clause License and as of the time of writing, ot has 3.6k stars and 334 forks on GitHub.
Alternative to JavaScript
It is used as an alternative to JavaScript on front-end web-development, and although I have a different reason, it still falls to using it as an alternative to JS.
Why? Because my exisiting codes are in Python and re-writing and refactoring the code from zero to JavaScript will cost me time.
Yestderday, I jump into writing my first Brython project and skimmed through its demos and tutorials.
View all Brython>Demos
View all Brython>Tutorials
Setup
Note: Full setup found on GitHub/Brython>ReadMe.md
I already have an existing, working code, but I still need to check if it works on a browser, specifically Google Chrome.
Because, I'm not allowed to use an IDE, why not use the handy Notepad, eh?
1. Just ready the standard HTML5 elements.
Other HTML features such as CSS still applies, everything HTML is still the same, only the things inside the Python script will be different than the usual web-development.
2. Set the Brython CDN links inside the head element, I prefer to use the development version:
<script type="text/javascript" src="https://raw.githack.com/brython-dev/brython/master/www/src/brython.js"></script>
<script type="text/javascript" src="https://raw.githack.com/brython-dev/brython/master/www/src/brython_stdlib.js"></script>
# Of course, skip adding `brython_stdlib.js` if you will not use its standard libraries.
3. Run Brython on page load:
<body onload="brython()"></body>
4. Inside the body, add a script tag with:
<script type="text/python"></script>
5. That's it! Put your Python codes in the script element. Or, call a separate Python file:
<script type="text/python" src="script.py"></script>
Imports
Brython supports the syntax of Python 3, including comprehensions, generators, metaclasses, imports, etc. and many modules of the CPython distribution.
You may check the standard library of Brython and what to do to use a currently unsupported library at Brython/stdlib.
Take note, there are limitations and you may consider it a stripped-down or lite version of Python/CPython, even some functions behaves like a wrapper instead of the real deal. (Correct me if I'm wrong.)
Basics
There's an in-browser interpreter, but I'll focus on the web-ui, DOM manipulation.
Required: For DOM maniopulation, inside the script tag for Python, do import:
from browser import document
Call the element using its ID
document["popup"]document["label"]document["username"]
Get / Set
content = document["title"].html
document["label"].text = "Input your username"
document["username"].value = "@oniemaniego"
Create HTML elements
from broswer import html
html.DIV()
html.SPAN("This is a text.")
Setting attributes
from browser import document, html
label = html.DIV(id="lbl")
label.style = dict(color="#fff", fonSize="12px")
label.style.backgroundColor = "#202020"
label.classList.add("custom-lbl")
# label.classList.remove("error-lbl")
Add new Element
from browser import html
box = html.DIV(id="box")
label = html.SPAN("This is a text.")
label.classList.add("custom-lbl")
label.classList.remove("error-lbl")
Appending Elements
from browser import document, html
# note, elemwnt must exist before accessing
main = document.getElementById("main-content")
box = html.DIV(id="box")
main.appendChild(box)
# or Brython-style
menu_item = html.DIV(id="item")
document["main-content"] <= menu_item
document.["item"] <= html.SPAN("This is a text.")
Takaways
Brython is a good option if you can't/won't download the actual Python/IDEs on your PC. I find it easy to learn, especially that I already have a background in web development (PHP/Python-Flask,HTML/JS/CSS) and in Python.
JavaScript is the standard for a reason, it is widely used and has other technologies/frameworks/software built on top of it, such as JQuery, Type/Coffee, NodeJS, and many others.
Brython is a good alternative to JS, although I will still have a lot to learn about Brython before recommending it in production, you may check it yourself and decide.
It has also an extensive documentation and learning resources, checkout Brython website for more information.
If find, CORS (Cross-origin resource sharing) a big roadblock to Brython, since most of my automations access multiple IP addresses. Though it uses "urllib.request" module, but major browsers block certain HTTP requests over cross-origin resources (had one that returns pure text that worked, but others that return XML show errors). A workaround might work, but isn't the optimal solution in the long run.
Do tell me if you find something inaccurate statements or wrong/mistyped code snippets so I can correct it.
How about you, what do you think of Brython?
Buy and Sell on Coinbase
Get Started
About Me
@oniemaniego is a test engineer, but outside work, he experiments in the kitchen, writes poetry and fiction, paints his heart out, or toils under the hot sun.
 | Onie Maniego was born in Leyte, PH. He grew up in a rural area with a close-knit community and a simple lifestyle, he is often visiting his father's orchards during summer and weekends, which has a great impact on his works. |
Sign Up