@webqit/webflo 0.20.6 → 0.20.7-next.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/site/api/webflo-routing/HttpCookies.md +1 -0
- package/site/api/webflo-routing/HttpEvent/respondWith.md +1 -1
- package/site/api/webflo-routing/HttpEvent/waitUntil.md +1 -1
- package/site/api/webflo-routing/HttpEvent/waitUntilNavigate.md +1 -1
- package/site/api/webflo-routing/HttpEvent.md +1 -1
- package/site/api/webflo-routing/HttpSession.md +1 -0
- package/site/api/webflo-routing/HttpState.md +1 -0
- package/site/api/webflo-routing/HttpUser.md +1 -0
- package/site/api/webflo-routing/handler/fetch.md +1 -1
- package/site/api/webflo-routing/handler/next.md +1 -1
- package/site/api/webflo-routing/handler.md +1 -1
- package/site/docs/advanced/lifecycles.md +3 -1
- package/site/docs/advanced/redirects.md +1 -0
- package/site/docs/advanced/routing.md +1 -1
- package/site/docs/advanced.md +5 -2
- package/site/docs/concepts/rendering.md +1 -60
- package/site/docs/concepts/requests-responses.md +1 -47
- package/site/docs/concepts/state.md +3 -1
- package/site/docs/concepts/templates.md +5 -3
- package/site/docs/tech-stack.md +1 -1
- package/site/examples/pwa.md +1 -1
- package/site/examples/web.md +1 -1
- package/site/guides/guide-auth.md +1 -1
- package/site/guides/guide-file-upload.md +1 -1
- package/site/guides/guide-service-worker.md +1 -1
- package/site/guides/tutorial-1-todo.md +1 -1
- package/site/api/webflo-fetch/FormData.md +0 -0
- package/site/api/webflo-fetch/Headers.md +0 -0
- package/site/api/webflo-fetch/LiveResponse.md +0 -0
- package/site/api/webflo-fetch/Request.md +0 -0
- package/site/api/webflo-fetch/Response.md +0 -0
- package/site/api/webflo-fetch/fetch.md +0 -0
package/package.json
CHANGED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
# HttpCookies (Page Coming Soon)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
# `event.respondWith()`
|
|
1
|
+
# `event.respondWith()` (Page Coming Soon)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
# `event.waitUntil()`
|
|
1
|
+
# `event.waitUntil()` (Page Coming Soon)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
# `event.waitUntilNavigate()`
|
|
1
|
+
# `event.waitUntilNavigate()` (Page Coming Soon)
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
# HttpSession (Page Coming Soon)
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
# HttpState (Page Coming Soon)
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
# HttpUser (Page Coming Soon)
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
# Redirects (Page Coming Soon)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
# Advanced Routing
|
|
1
|
+
# Advanced Routing (Page Coming Soon)
|
package/site/docs/advanced.md
CHANGED
|
@@ -1,60 +1 @@
|
|
|
1
|
-
# Rendering
|
|
2
|
-
|
|
3
|
-
Rendering in Webflo is about turning handler data into UI, both on the server (SSR) and in the browser (CSR).
|
|
4
|
-
|
|
5
|
-
## The Mental Model
|
|
6
|
-
|
|
7
|
-
- Your handler returns data (a plain object or Response).
|
|
8
|
-
- Webflo makes this data available as `document.bindings.data` in your HTML.
|
|
9
|
-
- Rendering can happen on the server, the client, or both—using the same mental model.
|
|
10
|
-
|
|
11
|
-
## Example: Returning Data
|
|
12
|
-
|
|
13
|
-
```js
|
|
14
|
-
// app/handler.server.js
|
|
15
|
-
export default async function(event, next) {
|
|
16
|
-
if (next.stepname) return await next();
|
|
17
|
-
return { title: 'Home', greeting: 'Hello World!' };
|
|
18
|
-
}
|
|
19
|
-
```
|
|
20
|
-
|
|
21
|
-
## Accessing Data in HTML
|
|
22
|
-
|
|
23
|
-
```html
|
|
24
|
-
<!-- public/index.html -->
|
|
25
|
-
<!DOCTYPE html>
|
|
26
|
-
<html>
|
|
27
|
-
<head>
|
|
28
|
-
<title>My App</title>
|
|
29
|
-
<script>
|
|
30
|
-
setTimeout(() => {
|
|
31
|
-
document.title = document.bindings.data.title;
|
|
32
|
-
}, 0);
|
|
33
|
-
</script>
|
|
34
|
-
</head>
|
|
35
|
-
<body>
|
|
36
|
-
<h1 id="greeting"></h1>
|
|
37
|
-
<script>
|
|
38
|
-
setTimeout(() => {
|
|
39
|
-
document.getElementById('greeting').textContent = document.bindings.data.greeting;
|
|
40
|
-
}, 0);
|
|
41
|
-
</script>
|
|
42
|
-
</body>
|
|
43
|
-
</html>
|
|
44
|
-
```
|
|
45
|
-
|
|
46
|
-
## SSR & CSR
|
|
47
|
-
|
|
48
|
-
- **SSR:** Data is rendered into HTML on the server for fast first paint and SEO.
|
|
49
|
-
- **CSR:** Data is updated in the browser for dynamic, interactive UIs.
|
|
50
|
-
- **Hybrid:** You can use both together for best results.
|
|
51
|
-
|
|
52
|
-
## Reactivity & OOHTML
|
|
53
|
-
|
|
54
|
-
- Use [OOHTML](https://github.com/webqit/oohtml) for reactive UI logic and templates.
|
|
55
|
-
- OOHTML enables `<script quantum>` and `<template>` for declarative, reactive UIs.
|
|
56
|
-
|
|
57
|
-
---
|
|
58
|
-
|
|
59
|
-
- [See Templates →](./templates.md)
|
|
60
|
-
- [See Lifecycle →](./lifecycle.md)
|
|
1
|
+
# Rendering (Page Coming Soon)
|
|
@@ -1,47 +1 @@
|
|
|
1
|
-
# Requests & Responses
|
|
2
|
-
|
|
3
|
-
This page explains how Webflo orchestrates each interaction from request to response, and how you can hook into various stages, including realtime.
|
|
4
|
-
|
|
5
|
-
## Overview
|
|
6
|
-
1. A request is received and a route is resolved.
|
|
7
|
-
2. Matching handler(s) execute, optionally delegating via `next()` for nested routes.
|
|
8
|
-
3. A value is produced: data, `Response`, or `LiveResponse`.
|
|
9
|
-
4. The client renders data into the UI or consumes the response stream.
|
|
10
|
-
5. Optional realtime keeps the channel open for additional updates until closed.
|
|
11
|
-
|
|
12
|
-
## The HttpEvent
|
|
13
|
-
- `event.request`, `event.url` — normalized request data.
|
|
14
|
-
- `event.cookies`, `event.session`, `event.user` — common state interfaces.
|
|
15
|
-
- `event.signal` — aborts when lifecycle completes or client aborts.
|
|
16
|
-
- `event.waitUntil(promise)` — extend lifecycle to await background work.
|
|
17
|
-
- `event.respondWith(value, optionsOrCallback)` — emit one or more responses.
|
|
18
|
-
|
|
19
|
-
See also: [/api/webflo-routing/HttpEvent](/api/webflo-routing/HttpEvent)
|
|
20
|
-
|
|
21
|
-
## Delegation via next()
|
|
22
|
-
```js
|
|
23
|
-
export default async function (event, next) {
|
|
24
|
-
if (next.stepname) return next();
|
|
25
|
-
return { title: 'Home' };
|
|
26
|
-
}
|
|
27
|
-
```
|
|
28
|
-
|
|
29
|
-
## Returning Values
|
|
30
|
-
- Single value: `return {...}` or `return Response.json({...})`
|
|
31
|
-
- Multiple/progressive values: call `event.respondWith(...)` one or more times
|
|
32
|
-
- Generators or live functions can yield multiple values naturally
|
|
33
|
-
|
|
34
|
-
See: [/api/webflo-routing/handler](/api/webflo-routing/handler)
|
|
35
|
-
|
|
36
|
-
## Realtime
|
|
37
|
-
Realtime extends the lifecycle beyond a single response so server and client can exchange multiple messages.
|
|
38
|
-
|
|
39
|
-
Close conditions:
|
|
40
|
-
- Handler finishes and no more messages are expected
|
|
41
|
-
- `HttpEvent.signal` aborts (client navigated away or server closed)
|
|
42
|
-
|
|
43
|
-
See: [/docs/concepts/realtime](/docs/concepts/realtime)
|
|
44
|
-
|
|
45
|
-
## Completion and Abort
|
|
46
|
-
- The root event aborts when all subtree handlers complete or the request aborts.
|
|
47
|
-
- Child events inherit from the parent and abort when the parent aborts.
|
|
1
|
+
# Requests & Responses (Page Coming Soon)
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
# State, Mutation, & Reactivity
|
|
1
|
+
# State, Mutation, & Reactivity (Page Coming Soon)
|
|
2
2
|
|
|
3
|
+
<!--
|
|
3
4
|
Webflo’s approach to state is refreshingly simple: your UI state is just a plain JavaScript object. When your server handler returns data, it becomes available as `document.bindings.data` for your templates and UI. No special syntax, no framework-specific magic—just JavaScript you already know.
|
|
4
5
|
|
|
5
6
|
## How State Flows
|
|
@@ -42,3 +43,4 @@ document.bindings.data.todos.push("Write code"); // UI updates!
|
|
|
42
43
|
- [Rendering](./rendering.md)
|
|
43
44
|
- [Realtime](./realtime.md)
|
|
44
45
|
- [API: Observer](../api/observer.md)
|
|
46
|
+
-->
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
# Templates
|
|
1
|
+
# Templates (Page Coming Soon)
|
|
2
2
|
|
|
3
|
+
<!--
|
|
3
4
|
Templates let you compose, reuse, and organize HTML in your Webflo app using modern standards.
|
|
4
5
|
|
|
5
6
|
## The Mental Model
|
|
@@ -11,10 +12,10 @@ Templates let you compose, reuse, and organize HTML in your Webflo app using mod
|
|
|
11
12
|
## Example: HTML Modules & Imports
|
|
12
13
|
|
|
13
14
|
```html
|
|
14
|
-
<!-- public/header.html
|
|
15
|
+
<!-- public/header.html - ->
|
|
15
16
|
<header>Header Area</header>
|
|
16
17
|
|
|
17
|
-
<!-- public/index.html
|
|
18
|
+
<!-- public/index.html - ->
|
|
18
19
|
<!DOCTYPE html>
|
|
19
20
|
<html>
|
|
20
21
|
<head>
|
|
@@ -46,3 +47,4 @@ oohtml bundle --recursive --auto-embed=app
|
|
|
46
47
|
|
|
47
48
|
- [See Rendering →](./rendering.md)
|
|
48
49
|
- [See Lifecycle →](./lifecycle.md)
|
|
50
|
+
-->
|
package/site/docs/tech-stack.md
CHANGED
package/site/examples/pwa.md
CHANGED
package/site/examples/web.md
CHANGED
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|