{"id":18498471,"url":"https://github.com/xpodev/pydom","last_synced_at":"2025-04-09T00:31:21.192Z","repository":{"id":255437985,"uuid":"850498145","full_name":"xpodev/pydom","owner":"xpodev","description":"PyDOM is a Python library that allows you to create web pages using a declarative syntax.","archived":false,"fork":false,"pushed_at":"2025-03-27T13:08:19.000Z","size":337,"stargazers_count":1,"open_issues_count":2,"forks_count":1,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-03-27T14:23:57.381Z","etag":null,"topics":["html","python","python-components"],"latest_commit_sha":null,"homepage":"https://pydom.dev","language":"Python","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/xpodev.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-09-01T00:10:44.000Z","updated_at":"2025-03-27T13:08:19.000Z","dependencies_parsed_at":null,"dependency_job_id":"b60d2da6-2370-4b09-aa1f-971ff50cd4ea","html_url":"https://github.com/xpodev/pydom","commit_stats":null,"previous_names":["xpodev/pydom"],"tags_count":12,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xpodev%2Fpydom","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xpodev%2Fpydom/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xpodev%2Fpydom/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xpodev%2Fpydom/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/xpodev","download_url":"https://codeload.github.com/xpodev/pydom/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247949886,"owners_count":21023409,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":["html","python","python-components"],"created_at":"2024-11-06T13:40:31.460Z","updated_at":"2025-04-09T00:31:21.184Z","avatar_url":"https://github.com/xpodev.png","language":"Python","funding_links":[],"categories":[],"sub_categories":[],"readme":"# PyDOM\n\n\u003cp align=\"center\"\u003e\n  \u003cimg src=\"https://raw.githubusercontent.com/xpodev/pydom/refs/heads/main/docs/_static/images/logo.svg\" alt=\"pydom-logo\" width=\"200\"\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cstrong\u003eSimple to learn, easy to use, fully-featured UI library for Python\u003c/strong\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://pypi.org/project/pydom/\"\u003e\n    \u003cimg src=\"https://img.shields.io/pypi/v/pydom.svg?color=32bc31\" alt=\"PyPI Version\"\u003e\n  \u003c/a\u003e\n  \u003cimg src=\"https://img.shields.io/pypi/pyversions/pydom.svg?color=32bc31\" alt=\"Supported Python Versions\"\u003e\n\u003c/p\u003e\n\nPyDOM is a Python library that allows you to create web pages using a declarative syntax.\n\nPyDOM provides a set of components that represent HTML elements and can be composed to create complex web pages.\n\n## Quick Start\n\nThis is a quick start guide to get you up and running with PyDOM. The guide will show you how to setup PyDOM and integrate it with [FastAPI](https://fastapi.tiangolo.com/).\n\n### Installation\n\nFirst, install the PyDOM package.\n\n```bash\npip install pydom\n```\n\n### Create Reusable Page\n\nPyDOM provides a default page component that is the minimal structure for a web page.\n\nThe page can be customized by extending the default page component and overriding the `head` and the `body` methods.\n\nMore information about the default page component can be found [here](#page).\n\n```python\n# app_page.py\n\nfrom pydom import Link, Page\n\nclass AppPage(Page):\n      def head(self):\n        return (\n          *super().head(),\n          Script(\n            src=\"https://cdn.tailwindcss.com/\",\n          )\n        )\n```\n\n### Creating the FastAPI app\n\nLastly, create the `FastAPI` app and add an endpoint that will render the page when the user accesses the root route.\n\n```python\n# main.py\n\nfrom fastapi import FastAPI\nfrom fastapi.responses import HTMLResponse\nfrom pydom import render, Div, P\n\nfrom app_page import AppPage\n\napp = FastAPI()\n\n@app.get(\"/\", response_class=HTMLResponse)\nasync def read_root():\n    return render(\n        AppPage(\n            Div(classes=\"text-center p-4 rounded\")(\n                Div(classes=\"text-4xl\")(\n                    \"Hello, World!\"\n                ),\n                P(classes=\"text-lg text-gray-600\")(\n                    \"Welcome to PyDOM\"\n                ),\n            )\n        )\n    )\n\nif __name__ == \"__main__\":\n    import uvicorn\n    uvicorn.run(app, host=\"localhost\", port=8000)\n```\n\nThat's it! Now you can run the app and access it at [http://localhost:8000/](http://localhost:8000/).\n\nIt should display a page like this:\n\n\u003cp align=\"center\"\u003e\n  \u003cimg src=\"https://raw.githubusercontent.com/xpodev/pydom/refs/heads/main/docs/_static/images/quick-start.jpeg\" alt=\"Quick Start\"\u003e\n\u003c/p\u003e\n\n## Documentation\n\nThe full documentation can be found at [our documentation site](https://pydom.dev/).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxpodev%2Fpydom","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fxpodev%2Fpydom","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxpodev%2Fpydom/lists"}