Django-LiveView/docs
1
0
Fork 0
mirror of https://github.com/Django-LiveView/docs.git synced 2024-11-10 02:45:42 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Update

Browse Source
This commit is contained in:
Andros Fenollosa 2024-03-04 15:36:50 +01:00
parent 0b2dc4fb0c
commit 99e3e983ca
5 changed files with 28 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
assets/css/main.css
View File

@ -261,6 +261,15 @@ a:hover,
}
/* Home */
.home img {
display: block;
width: 100%;
max-width: 40rem;
padding-block: var(--gap-l);
margin-inline: auto;
}
.nav-home__list {
justify-content: center;
gap: var(--gap-l);

BIN
assets/img/example-blog.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 82 KiB

BIN
assets/img/example-scheme.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 60 KiB

18
one.org
View File

@ -6,6 +6,24 @@
:DESCRIPTION: Framework for creating Realtime SPAs using HTML over the Wire technology.
:END:
** What is HTML over the Wire?
HTML over ther Wire, or HTML over the WebSockets, is a strategy for creating real-time SPAs by creating a WebSockets connection between a client and a server. It allows JavaScript to request actions, its only responsibility is to handle events, and the backend handles the business logic as well as rendering HTML. This means you can create pages without reloading the page, without AJAX, APIs or requests. One technology provides a secure, stable and low-delay connection for real-time web applications.
[[#/img/example-scheme.png][Architecture]]
Let's illustrate with an example. I want to render article number 2.
[[#/img/example-blog.png][Blog example]]
1. A WebSockets connection, a channel, is established between the client and the server.
2. JavaScript sends a text, not a request, via WebSockets to the Server (in our case Django).
3. Django interprets the text and renders the HTML of the article through the template system and the database.
4. Django sends the HTML to JavaScript via the channel and tells it which selector to embed it in.
5. JavaScript draws the received HTML in the indicated selector.
The same process is repeated for each action, such as clicking a button, submitting a form, etc.
** What is Django LiveView?
Django LiveView is a framework for creating Realtime SPAs using HTML over the Wire technology. It is inspired by Phoenix LiveView and it is built on top of Django Channels.

2
onerc.el
View File

@ -83,7 +83,7 @@
(:h1.hero__title "Django LiveView")
(:h2.hero__subtitle "Framework for creating Realtime SPAs using HTML over the Wire technology")
(:img.image.hero__logo (@ :alt "pet" :src "img/pet.webp")))))
(:section
(:section.home
(:div.container ,content)))))))
(defun one-custom-default-doc (page-tree pages _global)