-
Notifications
You must be signed in to change notification settings - Fork 90
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
docs(examples): added some new examples and a template for more
- Loading branch information
1 parent
cb2f49d
commit 07289f6
Showing
33 changed files
with
351 additions
and
19 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
.perseus/ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
[package] | ||
name = "perseus-example-base" | ||
version = "0.3.2" | ||
edition = "2018" | ||
|
||
# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html | ||
|
||
[dependencies] | ||
perseus = { path = "../../packages/perseus", features = [ "hydrate" ] } | ||
sycamore = "0.7" | ||
serde = { version = "1", features = ["derive"] } | ||
serde_json = "1" |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,7 @@ | ||
# Base Example | ||
|
||
This isn't an example per se, rather it's a template for future examples. If you want to create a new example, you should copy this directory and modify it to suit your needs, its purpsoe is just to create a universal minimal boilerplate from which examples can work. | ||
|
||
After copying this, you'll need to change this README to describe your example, and you'll need to change the name of your example in `Cargo.toml` to `perseus-example-<name>` (right now, it's `perseus-example-base`, leabving it as this will cause a compilation error). | ||
|
||
If you need some help with creating your example, feel free to pop over to our [Discord channel](https://discord.com/invite/GNqWYWNTdp)! |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8" /> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
</head> | ||
<body> | ||
<div id="root"></div> | ||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
use perseus::{ErrorPages, Html}; | ||
use sycamore::view; | ||
|
||
pub fn get_error_pages<G: Html>() -> ErrorPages<G> { | ||
let mut error_pages = ErrorPages::new(|url, status, err, _| { | ||
view! { | ||
p { (format!("An error with HTTP code {} occurred at '{}': '{}'.", status, url, err)) } | ||
} | ||
}); | ||
error_pages.add_page(404, |_, _, _, _| { | ||
view! { | ||
p { "Page not found." } | ||
} | ||
}); | ||
|
||
error_pages | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
mod error_pages; | ||
mod templates; | ||
|
||
use perseus::define_app; | ||
define_app! { | ||
templates: [ | ||
crate::templates::index::get_template::<G>() | ||
], | ||
error_pages: crate::error_pages::get_error_pages() | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,20 @@ | ||
use perseus::{Html, Template}; | ||
use sycamore::prelude::{view, SsrNode, View}; | ||
|
||
#[perseus::template_rx(IndexPage)] | ||
pub fn index_page() -> View<G> { | ||
view! { | ||
p { "Hello World!" } | ||
} | ||
} | ||
|
||
#[perseus::head] | ||
pub fn head() -> View<SsrNode> { | ||
view! { | ||
title { "Index Page" } | ||
} | ||
} | ||
|
||
pub fn get_template<G: Html>() -> Template<G> { | ||
Template::new("index").template(index_page).head(head) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
pub mod index; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,2 +1 @@ | ||
|
||
.perseus/ | ||
.perseus/ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
# Fetching Example | ||
|
||
This examples demonstrates how to interact with a server with Perseus and fetch data on both the server and in the browser. Specifically, this uses `ureq` on the server-side (with Perseus' inbuilt caching mechanism to speed up development builds) and `reqwasm` on the client-side. | ||
|
||
On the server-side, this will simply fetch the server's IP address, and on the client-side it will fetch the message at `/.perseus/static/message.txt`, automatically served by Perseus from `static/message.txt`. The reason for fetching a file on the same site is to prevent issues with CORS, as documented in the book. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
use perseus::{ErrorPages, Html}; | ||
use sycamore::view; | ||
|
||
pub fn get_error_pages<G: Html>() -> ErrorPages<G> { | ||
let mut error_pages = ErrorPages::new(|url, status, err, _| { | ||
view! { | ||
p { (format!("An error with HTTP code {} occurred at '{}': '{}'.", status, url, err)) } | ||
} | ||
}); | ||
error_pages.add_page(404, |_, _, _, _| { | ||
view! { | ||
p { "Page not found." } | ||
} | ||
}); | ||
|
||
error_pages | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,16 +1,10 @@ | ||
mod index; | ||
mod error_pages; | ||
mod templates; | ||
|
||
use perseus::define_app; | ||
define_app! { | ||
templates: [ | ||
index::get_template::<G>() | ||
crate::templates::index::get_template::<G>() | ||
], | ||
error_pages: perseus::ErrorPages::new(|url, status, err, _| { | ||
sycamore::view! { | ||
p { (format!("An error with HTTP code {} occurred at '{}': '{}'.", status, url, err)) } | ||
} | ||
}), | ||
static_aliases: { | ||
"/message" => "message.txt" | ||
} | ||
error_pages: crate::error_pages::get_error_pages() | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
pub mod index; |
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
.perseus/ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
[package] | ||
name = "perseus-example-global-state" | ||
version = "0.3.2" | ||
edition = "2018" | ||
|
||
# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html | ||
|
||
[dependencies] | ||
perseus = { path = "../../packages/perseus", features = [ "hydrate" ] } | ||
sycamore = "0.7" | ||
serde = { version = "1", features = ["derive"] } | ||
serde_json = "1" |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
# Global State Example | ||
|
||
This example demonstrates using global state to generate state that all pages have access to at build time. This state will then be made automatically reactive, and it can be modified easily. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8" /> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
</head> | ||
<body> | ||
<div id="root"></div> | ||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
use perseus::{ErrorPages, Html}; | ||
use sycamore::view; | ||
|
||
pub fn get_error_pages<G: Html>() -> ErrorPages<G> { | ||
let mut error_pages = ErrorPages::new(|url, status, err, _| { | ||
view! { | ||
p { (format!("An error with HTTP code {} occurred at '{}': '{}'.", status, url, err)) } | ||
} | ||
}); | ||
error_pages.add_page(404, |_, _, _, _| { | ||
view! { | ||
p { "Page not found." } | ||
} | ||
}); | ||
|
||
error_pages | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
use perseus::{state::GlobalStateCreator, RenderFnResult}; | ||
|
||
pub fn get_global_state_creator() -> GlobalStateCreator { | ||
GlobalStateCreator::new().build_state_fn(get_build_state) | ||
} | ||
|
||
#[perseus::make_rx(AppStateRx)] | ||
pub struct AppState { | ||
pub test: String, | ||
} | ||
|
||
#[perseus::autoserde(global_build_state)] | ||
pub async fn get_build_state() -> RenderFnResult<AppState> { | ||
Ok(AppState { | ||
test: "Hello World!".to_string(), | ||
}) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,13 @@ | ||
mod error_pages; | ||
mod global_state; | ||
mod templates; | ||
|
||
use perseus::define_app; | ||
define_app! { | ||
templates: [ | ||
crate::templates::index::get_template::<G>(), | ||
crate::templates::about::get_template::<G>() | ||
], | ||
error_pages: crate::error_pages::get_error_pages(), | ||
global_state_creator: crate::global_state::get_global_state_creator() | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
use perseus::{Html, Template}; | ||
use sycamore::prelude::{view, SsrNode, View}; | ||
|
||
use crate::global_state::AppStateRx; | ||
|
||
// This template needs global state, but doesn't have any state of its own, so the first argument is the unit type `()` (which the macro will detect) | ||
#[perseus::template_rx(AboutPage)] | ||
pub fn about_page(_: (), global_state: AppStateRx) -> View<G> { | ||
let test = global_state.test; | ||
let test_2 = test.clone(); | ||
view! { | ||
// The user can change the global state through an input, and the changes they make will be reflected throughout the app | ||
p { (test.get()) } | ||
input(bind:value = test_2) | ||
|
||
a(href = "") { "Index" } | ||
} | ||
} | ||
|
||
#[perseus::head] | ||
pub fn head() -> View<SsrNode> { | ||
view! { | ||
title { "About Page" } | ||
} | ||
} | ||
|
||
pub fn get_template<G: Html>() -> Template<G> { | ||
Template::new("about").template(about_page).head(head) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
use perseus::{Html, Template}; | ||
use sycamore::prelude::{view, SsrNode, View}; | ||
|
||
use crate::global_state::AppStateRx; | ||
|
||
// This template needs global state, but doesn't have any state of its own, so the first argument is the unit type `()` (which the macro will detect) | ||
#[perseus::template_rx(AboutPage)] | ||
pub fn index_page(_: (), global_state: AppStateRx) -> View<G> { | ||
let test = global_state.test; | ||
let test_2 = test.clone(); | ||
view! { | ||
// The user can change the global state through an input, and the changes they make will be reflected throughout the app | ||
p { (test.get()) } | ||
input(bind:value = test_2) | ||
|
||
a(href = "about") { "About" } | ||
} | ||
} | ||
|
||
#[perseus::head] | ||
pub fn head() -> View<SsrNode> { | ||
view! { | ||
title { "Index Page" } | ||
} | ||
} | ||
|
||
pub fn get_template<G: Html>() -> Template<G> { | ||
Template::new("index").template(index_page).head(head) | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,2 @@ | ||
pub mod about; | ||
pub mod index; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
.perseus/ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,12 @@ | ||
[package] | ||
name = "perseus-example-unreactive" | ||
version = "0.3.2" | ||
edition = "2018" | ||
|
||
# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html | ||
|
||
[dependencies] | ||
perseus = { path = "../../packages/perseus", features = [ "hydrate" ] } | ||
sycamore = "0.7" | ||
serde = { version = "1", features = ["derive"] } | ||
serde_json = "1" |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
# Unreactive Example | ||
|
||
This example shows you how to use the old `#[template(...)]` macro that doesn't make use of Perseus' reactive state platform. There are very few cases in which you'll actually use this, as it doesn't play well with more modern features like HSR and global state, so this example is mostly for legacy reference. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,10 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8" /> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
</head> | ||
<body> | ||
<div id="root"></div> | ||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
use perseus::{ErrorPages, Html}; | ||
use sycamore::view; | ||
|
||
pub fn get_error_pages<G: Html>() -> ErrorPages<G> { | ||
let mut error_pages = ErrorPages::new(|url, status, err, _| { | ||
view! { | ||
p { (format!("An error with HTTP code {} occurred at '{}': '{}'.", status, url, err)) } | ||
} | ||
}); | ||
error_pages.add_page(404, |_, _, _, _| { | ||
view! { | ||
p { "Page not found." } | ||
} | ||
}); | ||
|
||
error_pages | ||
} |
Oops, something went wrong.