Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/tomasr8/pyjsx
Write JSX directly in Python
https://github.com/tomasr8/pyjsx
jsx python template-engine transpiler
Last synced: 25 days ago
JSON representation
Write JSX directly in Python
- Host: GitHub
- URL: https://github.com/tomasr8/pyjsx
- Owner: tomasr8
- License: apache-2.0
- Created: 2024-08-12T22:07:39.000Z (3 months ago)
- Default Branch: master
- Last Pushed: 2024-09-24T21:32:34.000Z (about 1 month ago)
- Last Synced: 2024-09-29T06:23:46.381Z (about 1 month ago)
- Topics: jsx, python, template-engine, transpiler
- Language: Python
- Homepage:
- Size: 60.5 KB
- Stars: 23
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
# PyJSX - Write JSX directly in Python
```python
# coding: jsx
from pyjsx import jsx, JSX
def Header(children, style=None, **rest) -> JSX:
return
{children}
def Main(children, **rest) -> JSX:
return {children}
def App() -> JSX:
return (
Hello, world!
This was rendered with PyJSX!
)
```
## Installation
Get it via pip:
```sh
pip install python-jsx
```
## Minimal example
```python
# hello.py
# coding: jsx
from pyjsx import jsx
def hello():
print(
Hello, world!
)
```
```python
# main.py
from pyjsx import auto_setup
from hello import hello
hello()
```
```sh
$ python main.py
Hello, word!
```
> [!TIP]
> There are more examples available in the [examples folder](examples).
Each file containing JSX must contain two things:
- `# coding: jsx` directive - This tells Python to let our library parse the
file first.
- `from pyjsx import jsx` import. PyJSX transpiles JSX into `jsx(...)` calls so
it must be in scope.
To run a file containing JSX, the `jsx` codec must be registered first which can
be done with `from pyjsx import auto_setup`. This must occur before importing
any other file containing JSX.
## Supported grammar
The full [JSX grammar](https://facebook.github.io/jsx/) is supported.
Here are a few examples:
### Normal and self-closing tags
```python
x =
y = ![]()
```
### Props
```python
Click me!
This is red
Spread operator
```
### Nested expressions
```python
{[Row: {i}
for i in range(10)]}
```
### Fragments
```python
fragment = (
<>
1st paragraph
2nd paragraph
>
)
```
### Custom components
A custom component can be any function that takes `**kwargs` and
returns JSX or a plain string. The special prop `children` is a list
containing the element's children.
```python
def Header(children, **rest):
return
{children}
header = Title
print(header)
```
## Prior art
Inspired by [packed](https://github.com/michaeljones/packed) and
[pyxl4](https://github.com/pyxl4/pyxl4).