Skip to content

Add uix routing article (draft) #8

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
wants to merge 1 commit into
base: main
Choose a base branch
from
Draft

Add uix routing article (draft) #8

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 12 additions & 7 deletions articles/uix-routing.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,27 +11,29 @@

# Exploring the Power of Routing in the UIX Framework

Routing has always been a core issue in web server frameworks, and also in an increasing amount of frontend web frameworks to support Single-Page applications.
Routing has always been a core issue in web server frameworks, and also in an increasing amount of frontend web frameworks supporting Single-Page Applications.

Over the years many approaches for where established.
React is embracing Routing with JSX Components.

...

## Entrypoints

In UIX, every route is resolved starting from the `default` export in the `entrypoint.ts` file.
This default export value must satisfy the `UIX.Entrypoint` type.
(In general, every value that satisfies the `UIX.Entrypoint` type can be returned for nested routes)
This default export value can contain various different values, as explained in the following chapter. Valid values satisfy the `UIX.Entrypoint` type.

An `UIX.Entrypoint` can be any renderable content, like:
A `UIX.Entrypoint` can be any renderable content, like:
* A Component or simple HTML Element
* A primitive value, like a string or number
* A `Response` object

Displaying plain text:
```tsx
export default "Hello World";
```

Instead of static content, you can also always provide an (asnyc) function returning the content instead:
Instead of static content, you can also always provide an (async) function returning the content instead:

```tsx
export default () => `Hello World, the time is ${new Date().toLocaleString()}`;
Expand All @@ -42,7 +44,7 @@ If you want live content, you can pass in reactive values (Datex Pointers), for

```tsx
const currentTime: Datex.Pointer<Date> = Datex.Time.getLive();
export default () => text`Hello World, the time is ${currentTime}`;
export default () => text `Hello World, the time is ${currentTime}`;
```

Besides that, entrypoints can be an implementation of `UIX.RouteHandler`.
Expand All @@ -51,5 +53,8 @@ Besides that, entrypoints can be an implementation of `UIX.RouteHandler`.
A route handler is an entrypoint that takes a route as an input and returns a new entrypoint for that route.



UIX strictly regards JSX as another way to represent DOM Elements, and thus does support routing via JSX Components.


## File-Based Routing