diff --git a/application/.gitignore b/application/.gitignore new file mode 100644 index 0000000..a803f50 --- /dev/null +++ b/application/.gitignore @@ -0,0 +1,2 @@ +/target +/dist \ No newline at end of file diff --git a/application/Cargo.toml b/application/Cargo.toml new file mode 100644 index 0000000..5ae2782 --- /dev/null +++ b/application/Cargo.toml @@ -0,0 +1,32 @@ +[package] +name = "application" +version = "0.1.0" +edition = "2021" +authors = ["xeovalyte "] + +# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html + +[dependencies] +leptos = { version = "0.6", features = ["csr"] } +leptos_meta = { version = "0.6", features = ["csr"] } +leptos_router = { version = "0.6", features = ["csr"] } +console_log = "1" +log = "0.4" +console_error_panic_hook = "0.1" + +# utils +# strum = { version = "0.25", features = ["derive", "strum_macros"] } +# strum_macros = "0.25" + + +[dev-dependencies] +wasm-bindgen = "0.2" +wasm-bindgen-test = "0.3" +web-sys = { version = "0.3", features = ["Document", "Window"] } + + +[profile.release] +opt-level = 'z' +lto = true +codegen-units = 1 +panic = "abort" diff --git a/application/README.md b/application/README.md new file mode 100644 index 0000000..a9f5539 --- /dev/null +++ b/application/README.md @@ -0,0 +1,79 @@ + + + Leptos Logo + + +# Leptos Client-Side Rendered (CSR) App Starter Template + +This is a template for use with the [Leptos][Leptos] web framework using the [Trunk][Trunk] tool to compile and serve your app in development. + +## Creating your repo from the template + +This template requires you to have `cargo-generate` installed. You can install it with + +```sh +cargo install cargo-generate +``` + + +To set up your project with this template, run + +```sh +cargo generate --git https://github.com/leptos-community/start-csr +``` + +to generate your new project, then + +```sh +cd application +``` + +to go to your newly created project. + +By default, this template uses Rust `nightly` and requires that you've installed the `wasm` compilation target for your toolchain. + + +Sass and Tailwind are also supported by the Trunk build tool, but are optional additions: [see here for more info on how to set those up with Trunk][Trunk-instructions]. + + +If you don't have Rust nightly, you can install it with +```sh +rustup toolchain install nightly --allow-downgrade +``` + +You can add the `wasm` compilation target to rust using +```sh +rustup target add wasm32-unknown-unknown +``` + + +## Developing your Leptos CSR project + +To develop your Leptos CSR project, running + +```sh +trunk serve --port 3000 --open +``` + +will open your app in your default browser at `http://localhost:3000`. + + +## Deploying your Leptos CSR project + +To build a Leptos CSR app for release, use the command + +```sh +trunk build --release +``` + +This will output the files necessary to run your app into the `dist` folder; you can then use any static site host to serve these files. + +For further information about hosting Leptos CSR apps, please refer to [the Leptos Book chapter on deployment available here][deploy-csr]. + + +[Leptos]: https://github.com/leptos-rs/leptos + +[Trunk]: https://github.com/trunk-rs/trunk +[Trunk-instructions]: https://trunkrs.dev/assets/ + +[deploy-csr]: https://book.leptos.dev/deployment/csr.html \ No newline at end of file diff --git a/application/index.html b/application/index.html new file mode 100644 index 0000000..9c45715 --- /dev/null +++ b/application/index.html @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/application/public/favicon.ico b/application/public/favicon.ico new file mode 100644 index 0000000..2ba8527 Binary files /dev/null and b/application/public/favicon.ico differ diff --git a/application/public/styles.css b/application/public/styles.css new file mode 100644 index 0000000..0b30a70 --- /dev/null +++ b/application/public/styles.css @@ -0,0 +1,52 @@ +/* --------------------- Open Props --------------------------- */ + +/* the props */ +@import "https://unpkg.com/open-props"; + +/* optional imports that use the props */ +@import "https://unpkg.com/open-props/normalize.min.css"; +@import "https://unpkg.com/open-props/buttons.min.css"; + +/* ------------------------------------------------------------ */ + +body { + font-family: sans-serif; + text-align: center; +} + +.container { + display: flex; + flex-direction: column; + justify-content: space-around; + align-items: center; +} + +.buttons { + display: flex; + justify-content: space-evenly; +} + +h1, +h2, +h3, +h4, +h5, +h6 { + text-align: center; + margin: 0 auto; + padding: 2rem; +} + +p, +button { + margin: var(--size-6); +} + +body > picture, +button { + display: block; + margin-left: auto; + margin-right: auto; + text-align: center; + margin: 2rem; +} diff --git a/application/rust-toolchain.toml b/application/rust-toolchain.toml new file mode 100644 index 0000000..5d56faf --- /dev/null +++ b/application/rust-toolchain.toml @@ -0,0 +1,2 @@ +[toolchain] +channel = "nightly" diff --git a/application/src/components/counter_btn.rs b/application/src/components/counter_btn.rs new file mode 100644 index 0000000..6e8dbde --- /dev/null +++ b/application/src/components/counter_btn.rs @@ -0,0 +1,16 @@ +use leptos::*; + +/// A parameterized incrementing button +#[component] +pub fn Button(#[prop(default = 1)] increment: i32) -> impl IntoView { + let (count, set_count) = create_signal(0); + view! { + + } +} diff --git a/application/src/components/mod.rs b/application/src/components/mod.rs new file mode 100644 index 0000000..d0af89d --- /dev/null +++ b/application/src/components/mod.rs @@ -0,0 +1 @@ +pub mod counter_btn; diff --git a/application/src/lib.rs b/application/src/lib.rs new file mode 100644 index 0000000..5e51efc --- /dev/null +++ b/application/src/lib.rs @@ -0,0 +1,60 @@ +use leptos::*; +use leptos_meta::*; +use leptos_router::*; + +// Modules +mod components; +mod pages; + +// Top-Level pages +use crate::pages::home::Home; +use crate::pages::not_found::NotFound; + +/// An app router which renders the homepage and handles 404's +#[component] +pub fn App() -> impl IntoView { + // Provides context that manages stylesheets, titles, meta tags, etc. + provide_meta_context(); + + view! { + + // injects info into HTML tag from application code + + + // sets the document title + + + // injects metadata in the <head> of the page + <Meta charset="UTF-8" /> + <Meta name="viewport" content="width=device-width, initial-scale=1.0" /> + + + <ErrorBoundary + fallback=|errors| view! { + <h1>"Uh oh! Something went wrong!"</h1> + + <p>"Errors: "</p> + // Render a list of errors as strings - good for development purposes + <ul> + {move || errors.get() + .into_iter() + .map(|(_, e)| view! { <li>{e.to_string()}</li>}) + .collect_view() + } + </ul> + } + > + <Router> + <Routes> + <Route path="/" view=Home /> + <Route path="/*" view=NotFound /> + </Routes> + </Router> + + </ErrorBoundary> + } +} diff --git a/application/src/main.rs b/application/src/main.rs new file mode 100644 index 0000000..169716a --- /dev/null +++ b/application/src/main.rs @@ -0,0 +1,14 @@ +use leptos::*; +use application::App; + +fn main() { + // set up logging + _ = console_log::init_with_level(log::Level::Debug); + console_error_panic_hook::set_once(); + + mount_to_body(|| { + view! { + <App /> + } + }) +} diff --git a/application/src/pages/home.rs b/application/src/pages/home.rs new file mode 100644 index 0000000..7022a70 --- /dev/null +++ b/application/src/pages/home.rs @@ -0,0 +1,24 @@ +use crate::components::counter_btn::Button; +use leptos::*; + +/// Default Home Page +#[component] +pub fn Home() -> impl IntoView { + view! { + <div class="container"> + + <picture> + <source srcset="https://raw.githubusercontent.com/leptos-rs/leptos/main/docs/logos/Leptos_logo_pref_dark_RGB.svg" media="(prefers-color-scheme: dark)" /> + <img src="https://raw.githubusercontent.com/leptos-rs/leptos/main/docs/logos/Leptos_logo_RGB.svg" alt="Leptos Logo" height="200" width="400"/> + </picture> + + <h1>"Welcome to Leptos"</h1> + + <div class="buttons"> + <Button /> + <Button increment=5 /> + </div> + + </div> + } +} diff --git a/application/src/pages/mod.rs b/application/src/pages/mod.rs new file mode 100644 index 0000000..8829694 --- /dev/null +++ b/application/src/pages/mod.rs @@ -0,0 +1,2 @@ +pub mod home; +pub mod not_found; diff --git a/application/src/pages/not_found.rs b/application/src/pages/not_found.rs new file mode 100644 index 0000000..2f867cb --- /dev/null +++ b/application/src/pages/not_found.rs @@ -0,0 +1,7 @@ +use leptos::*; + +/// 404 Not Found Page +#[component] +pub fn NotFound() -> impl IntoView { + view! { <h1>"Uh oh!" <br/> "We couldn't find that page!"</h1> } +} diff --git a/flake.lock b/flake.lock index c23049b..5d649ef 100644 --- a/flake.lock +++ b/flake.lock @@ -23,11 +23,11 @@ "systems": "systems_2" }, "locked": { - "lastModified": 1681202837, - "narHash": "sha256-H+Rh19JDwRtpVPAWp64F+rlEtxUWBAQW28eAi3SRSzg=", + "lastModified": 1705309234, + "narHash": "sha256-uNRRNRKmJyCRC/8y1RqBkqWBLM034y4qN7EprSdmgyA=", "owner": "numtide", "repo": "flake-utils", - "rev": "cfacdce06f30d2b68473a46042957675eebb3401", + "rev": "1ef2e671c3b0c19053962c07dbda38332dcebf26", "type": "github" }, "original": { @@ -38,11 +38,11 @@ }, "nixpkgs": { "locked": { - "lastModified": 1705916986, - "narHash": "sha256-iBpfltu6QvN4xMpen6jGGEb6jOqmmVQKUrXdOJ32u8w=", + "lastModified": 1707514827, + "narHash": "sha256-Y+wqFkvikpE1epCx57PsGw+M1hX5aY5q/xgk+ebDwxI=", "owner": "NixOS", "repo": "nixpkgs", - "rev": "d7f206b723e42edb09d9d753020a84b3061a79d8", + "rev": "20f65b86b6485decb43c5498780c223571dd56ef", "type": "github" }, "original": { @@ -54,11 +54,11 @@ }, "nixpkgs-unstable": { "locked": { - "lastModified": 1705856552, - "narHash": "sha256-JXfnuEf5Yd6bhMs/uvM67/joxYKoysyE3M2k6T3eWbg=", + "lastModified": 1707546158, + "narHash": "sha256-nYYJTpzfPMDxI8mzhQsYjIUX+grorqjKEU9Np6Xwy/0=", "owner": "NixOS", "repo": "nixpkgs", - "rev": "612f97239e2cc474c13c9dafa0df378058c5ad8d", + "rev": "d934204a0f8d9198e1e4515dd6fec76a139c87f0", "type": "github" }, "original": { @@ -70,11 +70,11 @@ }, "nixpkgs_2": { "locked": { - "lastModified": 1681358109, - "narHash": "sha256-eKyxW4OohHQx9Urxi7TQlFBTDWII+F+x2hklDOQPB50=", + "lastModified": 1706487304, + "narHash": "sha256-LE8lVX28MV2jWJsidW13D2qrHU/RUUONendL2Q/WlJg=", "owner": "NixOS", "repo": "nixpkgs", - "rev": "96ba1c52e54e74c3197f4d43026b3f3d92e83ff9", + "rev": "90f456026d284c22b3e3497be980b2e47d0b28ac", "type": "github" }, "original": { @@ -98,11 +98,11 @@ "nixpkgs": "nixpkgs_2" }, "locked": { - "lastModified": 1705889935, - "narHash": "sha256-77KPBK5e0ACNzIgJDMuptTtEqKvHBxTO3ksqXHHVO+4=", + "lastModified": 1707703915, + "narHash": "sha256-Vej69igzNr3eVDca6+32uO+TXjVWx6ZUwwy3iZuzhJ4=", "owner": "oxalica", "repo": "rust-overlay", - "rev": "e36f66bb10b09f5189dc3b1706948eaeb9a1c555", + "rev": "e6679d2ff9136d00b3a7168d2bf1dff9e84c5758", "type": "github" }, "original": { diff --git a/flake.nix b/flake.nix index fcfcbaa..081a48d 100644 --- a/flake.nix +++ b/flake.nix @@ -27,7 +27,7 @@ buildInputs = [ trunk dart-sass - rust-analyzer + unstable.rust-analyzer llvmPackages.clangNoLibc llvmPackages.lld dap