diff --git a/assets/img/example-blog.png b/assets/img/example-blog.png deleted file mode 100644 index 0806574..0000000 Binary files a/assets/img/example-blog.png and /dev/null differ diff --git a/assets/img/example-scheme.png b/assets/img/example-scheme.png deleted file mode 100644 index 715a762..0000000 Binary files a/assets/img/example-scheme.png and /dev/null differ diff --git a/assets/img/step-1.png b/assets/img/step-1.png new file mode 100644 index 0000000..ed3b2a3 Binary files /dev/null and b/assets/img/step-1.png differ diff --git a/assets/img/step-2.png b/assets/img/step-2.png new file mode 100644 index 0000000..7ad6056 Binary files /dev/null and b/assets/img/step-2.png differ diff --git a/assets/img/step-3.png b/assets/img/step-3.png new file mode 100644 index 0000000..d1748a8 Binary files /dev/null and b/assets/img/step-3.png differ diff --git a/assets/img/step-4.png b/assets/img/step-4.png new file mode 100644 index 0000000..a4ec897 Binary files /dev/null and b/assets/img/step-4.png differ diff --git a/one.org b/one.org index f132a62..a2ae06b 100644 --- a/one.org +++ b/one.org @@ -11,12 +11,18 @@ 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. #+ATTR_HTML: :class center-block image image--home -[[#/img/example-scheme.png][Architecture]] +[[#/img/step-1.png][Architecture send]] + +#+ATTR_HTML: :class center-block image image--home +[[#/img/step-2.png][Architecture receive]] Let's illustrate with an example. I want to render article number 2. #+ATTR_HTML: :class center-block image image--home -[[#/img/example-blog.png][Blog example]] +[[#/img/step-3.png][Send string]] + +#+ATTR_HTML: :class center-block image image--home +[[#/img/step-4.png][Send JSON]] 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). @@ -417,6 +423,7 @@ async def random_number(consumer, client_data, lang=None): await consumer.send_html(data) #+END_SRC + * Views :PROPERTIES: :ONE: one-custom-default-doc