I started to make a small app a couple of years ago in order to have an easy way to convert notebooks and python scripts to a webpage. Extreme feature creep, lack of time and general stupidity led to code that is way too complex and bugs that are more frequent than roses. Not to speak about lots of undocumented and poorly documented features.
Still, I would like to share it to get some feedback. And perhaps somebody is interested in a collaboration.
The short version: It takes your code/notebook and puts it in an html file. This is published on the web (and you can download the html file). The code is run using pyodide (or Brython) when a user tries to access the page and the user gets to see the output of the code as well as the text in the original document, and special components that you may have used.
My use case is basically to make short tutorials and communicates research ideas.
It is not ready for public consumption and the whole project may close down (which will erase the pages you have made … make sure to download the html of the stuff you make if you want to keep it). Do not rely on it for anything serious yet, but feel free to test small things.
Here are some only partially misleading docs …
Docs
See all basic components
Extra components
More components (require pyodide)
How to Use pyApp - A Step-by-Step Guide
pyApp is a tool designed to convert the output from Python scripts and notebooks into interactive web pages effortlessly.
Note: This is an alpha version - with bugs and warts
Getting Started
- Code: You have three options to input your Python code:
-
Upload your Python script or notebook file.
-
Directly enter your Python code into the online editor
-
Connect pyApp to a github repository. Files will be automatically converted and published when the repository is changed.
-
You can import and use libraries (like Pandas, Numpy, etc). The final web page will take about ten second to initialize/load in that case.
-
If you do not need external packages (or only need pandas and some plots), select Brython in the options and the final page is much quicker to load.
- Run & Preview: Clicking “run” will give you a preview of the web-page. Remember to save the code at regular intervals.
- Publish: Clicking publish makes the web page accessible online. You may add a password to keep the content more private. You can also “Download the file as a single html file” .
Understanding the Output
- pyApp generates web pages based on the python script, that include the following :
- Text in lines starting with single or triple quotes is converted into Markdown.
- Special elements, starting with ui.COMPONENT() like info boxes, accordions, mermaid graphs, and more can be included
- The output of variable names used on a single line (e.g., dataframes, plots, lists) is incorporated.
- When using cell notation (#%%), the output from code cells is included, but this can be changed if you use a cell-headline to indicate what kind of output the cell should create (e.g., markdown, HTML, GUI, cell).
Styling
- Web pages with no interactive elements are styled using pico CSS and text is formatted with Markdown.
- For code execution and interactive elements, pyodide runs Python code, and shoelace web components are included.
- You can put components in containers to change the layout (row, column, grid, split_panel)
Use Cases
- Sharing research findings.
- Creating interactive tutorials.
- Conducting reproducible research.
- Crafting interactive blogs.
- Sharing preliminary data analysis and results with password protection.
- Automatically generating presentations from scripts.
- Offering interactive options in presentations.
Features
- Converting scripts to interactive web pages.
- Downloading as a stand-alone HTML file.
- Python code execution in the browser using pyodide or brython
- Support for various Python libraries.
- Integrated editor for testing and editing.
- Password protection for privacy.
- Github integration
- Conversion to slideshow format.
- Markdown support, including math formatting.
- Inclusion of widgets, graphs, accordions, and more.
- Adding animation and sound to text.
- Integrated drawing component (Drawcast).
- Interactive questions and comments.
- Integrated YouTube/images/sound search and addition.
- Displaying dataframes in different styles.
- Embedding files (data and images) for stand-alone apps.
- Including standard elements like buttons and sliders.
- Incorporating web components from shoelace.
- Connecting events to Python functions in executed locally in the browser.
- Using specialized data science widgets.
- Converting functions to GUI components.
- Supporting animation and motion charts.
- Simplified grid layout.
- Comment component that allows users to give comments to elements on the page
- question (and answer) component
When to Use pyApp
- Easily share draft research/data science analysis.
- Create interactive tutorials with animations, videos, and code examples.
- Present a web version of research or data analysis.
When NOT to Use pyApp
- If beauty is more important than substance
- For complex apps requiring extensive layout and CSS customization.
- For long and intricate multi-page apps not focused on data analysis.
Roadmap
- Future updates may include:
- Integrated database functionality.
- Enhanced layout and styling options.
- Custom widget creation.
- Interval function calls.
- Conversion of components to true web components.
- Custom URL deployment.
Our Story
- pyApp was developed to streamline research sharing and teaching.
- It helps make complex models and concepts more accessible through interactivity.
- Promotes open and reproducible science.
Acknowledgments
- Gratitude to the creators and teams behind Anvil, Brython, Jupyter, Pandas, Pico, Pyodide, Python, and Markdown-it.