Compare commits
5 commits
Author | SHA1 | Date | |
---|---|---|---|
314f7cb273 | |||
79640a16fa | |||
91206c9ed0 | |||
bd5f4d749d | |||
bd136d64af |
1 changed files with 21 additions and 28 deletions
49
README.md
49
README.md
|
@ -1,8 +1,10 @@
|
|||
# HSX – Hypertext S-expression
|
||||
|
||||
**HSX** is a lightweight and expressive HTML generation library for Common Lisp, inspired by JSX. It allows you to write HTML using native Lisp syntax via S-expressions.
|
||||
**HSX** is a simple and powerful HTML generation library for Common Lisp, inspired by JSX. It allows you to write HTML using native Lisp syntax.
|
||||
|
||||
> 🚧 **ALPHA NOTICE:**
|
||||
[Practical usage example](https://github.com/skyizwhite/website)
|
||||
|
||||
> 🚧 **BETA NOTICE:**
|
||||
> This library is still in early development. APIs may change.
|
||||
> See [release notes](https://github.com/skyizwhite/hsx/releases) for details.
|
||||
|
||||
|
@ -26,28 +28,26 @@ For example:
|
|||
Is internally transformed (by macro expansion) into:
|
||||
|
||||
```lisp
|
||||
(create-element :article '(:class "container")
|
||||
(list
|
||||
(create-element :h1 nil (list "Title"))
|
||||
(create-element :p nil (list "Paragraph"))
|
||||
(create-element #'~share-button '(:service :x) (list))))
|
||||
(create-element :article
|
||||
(list :class "container")
|
||||
(list (create-element :h1
|
||||
(list)
|
||||
(list "Title"))
|
||||
(create-element :p
|
||||
(list)
|
||||
(list "Paragraph"))
|
||||
(create-element #'~share-button
|
||||
(list :service :x)
|
||||
(list))))
|
||||
```
|
||||
|
||||
This is made possible via the hsx macro, which detects HTML tags and components, then rewrites them using create-element. Tags are converted to keywords (e.g., div → :div), and custom components (starting with ~) are passed as functions.
|
||||
|
||||
This uniform representation allows rendering, manipulation, and analysis of the HTML structure in a Lisp-friendly way.
|
||||
|
||||
|
||||
## 🚀 Quick Example
|
||||
|
||||
```lisp
|
||||
(hsx
|
||||
(div :id "main" :class "container"
|
||||
(h1 "Hello, HSX!")
|
||||
(p "This is a simple paragraph.")
|
||||
(ul
|
||||
(loop for i from 1 to 3 collect
|
||||
(hsx (li (format nil "Item ~a" i)))))))
|
||||
(p "This is a simple paragraph.")))
|
||||
```
|
||||
|
||||
Generates:
|
||||
|
@ -56,11 +56,6 @@ Generates:
|
|||
<div id="main" class="container">
|
||||
<h1>Hello, HSX!</h1>
|
||||
<p>This is a simple paragraph.</p>
|
||||
<ul>
|
||||
<li>Item 1</li>
|
||||
<li>Item 2</li>
|
||||
<li>Item 3</li>
|
||||
</ul>
|
||||
</div>
|
||||
```
|
||||
|
||||
|
@ -73,7 +68,7 @@ Use `render-to-string` to convert an HSX structure to a string of HTML:
|
|||
(hsx ...))
|
||||
```
|
||||
|
||||
## 🔐 Escaping Behavior
|
||||
## 🔐 Escaping text
|
||||
|
||||
All elements automatically escape special characters in content to prevent XSS and HTML injection:
|
||||
|
||||
|
@ -176,13 +171,11 @@ Or loop:
|
|||
(hsx (li item))))))
|
||||
```
|
||||
|
||||
## 🏷️ Built-in Tags
|
||||
|
||||
All standard HTML5 tags (and a few extras like `<>`, `raw!`) are automatically defined and exported from the hsx package. You don’t need to declare them manually.
|
||||
|
||||
## 📄 License
|
||||
|
||||
MIT License
|
||||
• © 2024 Akira Tempaku
|
||||
• © 2018 Bo Yao (original [flute](https://github.com/ailisp/flute) project)
|
||||
|
||||
© 2024 Akira Tempaku
|
||||
|
||||
© 2018 Bo Yao (original [flute](https://github.com/ailisp/flute) project)
|
||||
|
||||
|
|
Loading…
Add table
Reference in a new issue