{"id":38520885,"url":"https://github.com/chunribu/pyspage","last_synced_at":"2026-01-17T06:39:58.882Z","repository":{"id":61987611,"uuid":"555952400","full_name":"chunribu/pyspage","owner":"chunribu","description":"Quickly build open source web pages for academic purposes in a pythonic and elegant way.","archived":false,"fork":false,"pushed_at":"2022-10-27T10:15:15.000Z","size":156,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-08-28T15:48:39.576Z","etag":null,"topics":["pyscript"],"latest_commit_sha":null,"homepage":"","language":"Python","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/chunribu.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2022-10-22T18:16:23.000Z","updated_at":"2022-10-24T18:52:03.000Z","dependencies_parsed_at":"2022-10-24T19:15:15.783Z","dependency_job_id":null,"html_url":"https://github.com/chunribu/pyspage","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/chunribu/pyspage","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chunribu%2Fpyspage","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chunribu%2Fpyspage/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chunribu%2Fpyspage/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chunribu%2Fpyspage/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/chunribu","download_url":"https://codeload.github.com/chunribu/pyspage/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/chunribu%2Fpyspage/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28502792,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-17T04:31:57.058Z","status":"ssl_error","status_checked_at":"2026-01-17T04:31:45.816Z","response_time":85,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["pyscript"],"created_at":"2026-01-17T06:39:58.821Z","updated_at":"2026-01-17T06:39:58.876Z","avatar_url":"https://github.com/chunribu.png","language":"Python","funding_links":[],"categories":[],"sub_categories":[],"readme":"# pyspage \u003cimg src=\"assets/icon.png\" align=\"right\" /\u003e\n\nQuickly build open source web pages for academic purposes in a pythonic and elegant way.\n\npyspage makes it possible to build web pages with sophisticated logic from a single Python script. What pyspage actually does is turn a plain `.py` file into a valid [pyscript](https://pyscript.net/) page, you don't have to worry about anything other than what you really want to do.\n\n## Installation\n\n```shell\npip install pyspage\n```\n\n## An Example\n\nGo to directory `demo/`, there is already a script `scatter_hist.py`.\n\n```shell\npyspage scatter_hist.py -sb\n```\n\nA file named `scatter_hist.html` is generated, your browser opens a tab and show it.\n\n![demo](assets/screenshot.png)\n\n## Usage\n\n### Step 1\n\nCreate a new file named `index.py` which consists of mainly two parts, **layout** and **script**.\n\nIn the layout part, a `layout` variable should be defined, of which the contents are the page elements named in a way you like. The hierarchical relationships are expressed by indenting.\n\n```python\nlayout = '''\nrow_a\n    box\nrow_b\n    col_a\n        btn_a\n    col_b\n        btn_b\n'''\n```\n\nIn the script part, all the elements above should be created.\n\n```python\nfrom pyspage import *\nimport matplotlib.pyplot as plt\n\nrow_a = Row()\nrow_b = Row()\ncol_a = Column()\ncol_b = Column()\nbox   = Column(class_='col-6')\nbtn_a = Button('CLICK a')\nbtn_b = Button('CLICK b')\n```\n\nYou can define a function and let an element run it on a certain event happens.\n\n```python\nbtn_a.onclick = lambda e: print('a is clicked!')\n\ndef click_b(e):\n    fig, ax = plt.subplots()\n    fruits = ['apple', 'blueberry', 'cherry', 'orange']\n    counts = [40, 100, 30, 55]\n    ax.bar(fruits, counts)\n    box.write(fig)\nbtn_b.onclick = click_b\n\ndef create_box():\n    row_a.classList.add('bg-warning')\n    box.write('This is the content.')\nbox.oncreate = create_box\n```\n\nYou can create a figure with `matplotlib` or `altair`, and show it in an empty box(`row` or `column`) by `box.write(fig)`.\n\n### Step 2\n\nIn your terminal, run as follow\n```shell\npyspage index.py\n```\n\na `index.html` in current directory is generated. \n\nIf you use the arguments `-s`(for server) and `-b`(for browser), pyspage will start a server on 127.0.0.1:8000 and open browser automatically.\n\n```shell\npyspage index.py -sb\n```\n\n## Deployment\n\nThis page can then be deployed on [GitHub Pages](https://pages.github.com/), you don't have to bother about anything with HTML, JS or backend APIs.🎉🎉🎉\n\nThe easiest way to use GitHub Pages with your built HTML is to use the `ghp-import` package. ghp-import is a lightweight Python package that makes it easy to push HTML content to a GitHub repository.\n\nghp-import works by copying all of the contents of a folder to a branch of your repository called **gh-pages**, and pushes it to GitHub. The gh-pages branch will be created and populated automatically for you by ghp-import.\n\n1. Install `ghp-import`.\n\n```shell\npip install ghp-import\n```\n\n2. Call ghp-import and point it to the directory containing your HTML files. \n\n```shell\nghp-import -n -p -f demo/\n```\n\nNow goto https://chunribu.github.io/pyspage/scatter_hist.html .The URL format is always *{USER}.github.io/{REPOSITORY}/{FILENAME}*. The filename can be omitted by changing name to `index.html`.\n\nDeployment is that easy!🎉🎉🎉\n\n*Tips:*\n\n- *Make sure that you included the `-n`, it tells GitHub not to build your book with Jekyll, which we don’t want because our HTML is already built.*\n\n- *You may neet to update the settings for your GitHub pages site:*\n\n    - *Use the `gh-pages` branch to host your website.*\n\n    - *Choose root directory `/`.*\n\n## Supported Elements (Todo List)\n\n- [x] Row\n- [x] Column\n- [x] Text\n- [x] Button\n- [x] Input\n- [x] Textarea\n- [x] SelectOne\n- [ ] SelectMulti\n- [ ] File\n- [ ] Image\n\n## License\nThe [MIT License](LICENSE).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchunribu%2Fpyspage","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fchunribu%2Fpyspage","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fchunribu%2Fpyspage/lists"}