Skip to content

Commit

Permalink
update routing doc
Browse files Browse the repository at this point in the history
  • Loading branch information
maxence-charriere committed May 31, 2024
1 parent cd9adfb commit d339577
Show file tree
Hide file tree
Showing 2 changed files with 13 additions and 17 deletions.
4 changes: 2 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -79,8 +79,8 @@ Apps created with go-app complies with [Go standard HTTP](https://golang.org/pkg
```go
func main() {
// Components routing:
app.Route("/", &hello{})
app.Route("/hello", &hello{})
app.Route("/", func() app.Composer { return &hello{} })
app.Route("/hello", func() app.Composer { return &hello{} })
app.RunWhenOnBrowser()

// HTTP routing:
Expand Down
26 changes: 11 additions & 15 deletions docs/web/documents/routing.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,46 +4,42 @@ Routing is about **associating a component with an URL path**.

## Define a route

Defining a route is done by **associating a URL path with a given component type**.

When a page is requested, its URL path is compared with the defined routes. Then **a new instance of the component type associated with the route is created and displayed**.

Routes are defined by using a simple pattern or by a regular expression.
Defining a route is done by **associating a URL path with a function that returns a component**. The requested URL path is matched and the function is used to create an instance of the component to display. Paths can be defined with a simple pattern or a regular expression.

### Simple route

Simple routes are when a component type matches an exact URL path. They are defined with the [Route()](/reference#Route) function:
Simple routes are when the requested URL path matches a given one. They are defined with the [Route()](/reference#Route) function:

```go
func main() {
app.Route("/", &hello{}) // hello component type is associated with default path "/".
app.Route("/foo", &foo{}) // foo component type is associated with "/foo".
app.RunWhenOnBrowser() // Launches the app when in a web browser.
app.Route("/", func() app.Composer { return &component{} }) // component is created for the root path
app.Route("/foo", func() app.Composer { return &component{} }) // component is created when the path is /foo
app.RunWhenOnBrowser() // Launches the app when in a web browser
}
```

### Route with regular expression

Routes with regular expressions are when a component type matches an URL path with a given pattern. They are defined with the [RouteWithRegexp()](/reference#RouteWithRegexp)function:
Routes with regular expressions are used when the requested URL path matches a given pattern. They are defined using the [RouteWithRegexp()](/reference#RouteWithRegexp) function:

```go
func main() {
app.RouteWithRegexp("^/bar.*", &bar) // bar component is associated with all paths that start with /bar.
app.RunWhenOnBrowser() // Launches the app when in a web browser.
app.RouteWithRegexp("^/bar/(code|tender).*", func() app.Composer { return &component{} }) // component is created when the path is /bar/code or /bar/tender
app.RunWhenOnBrowser() // Launches the app when in a web browser.
}
```

Regular expressions follow [Go standard syntax](https://github.com/google/re2/wiki/Syntax).
Regular expressions follow the [Go standard syntax](https://github.com/google/re2/wiki/Syntax).

## How it works?

Progressive web apps created with the **go-app** package are working as a [single page application](https://en.wikipedia.org/wiki/Single-page_application). At first navigation, the app is loaded in the browser. Once loaded, each time a page is requested, the navigation event is intercepted and **go-app**'s routing mechanism reads the URL path, then loads a new instance of the associated [component](/components).
Progressive web apps created with the **go-app** package function as a [single-page application](https://en.wikipedia.org/wiki/Single-page_application). On the first navigation, the app is loaded in the browser. Once loaded, each time a page is requested, the navigation event is intercepted, and **go-app**'s routing mechanism reads the URL path, then loads the [component](/components) returned by the associated function.

![routing.png](/web/images/routing.svg)

## Detect navigation

Some scenarios may require additional actions to be done when a page is navigated on. Components can detect when a page is navigated on by implementing the [Navigator](/reference#Navigator) interface:
Some scenarios may require additional actions when a page is navigated. Components can detect when a page is navigated by implementing the [Navigator](/reference#Navigator) interface:

```go
type foo struct {
Expand Down

0 comments on commit d339577

Please sign in to comment.