seed-rs-realworld
seed-rs-realworld copied to clipboard
Exemplary real world application built with Seed
Seed codebase containing real world examples (CRUD, auth, advanced patterns, etc) that adheres to the RealWorld spec and API.
Demo RealWorld
This codebase was created to demonstrate a fully fledged fullstack application built with Seed including CRUD operations, authentication, routing, pagination, and more.
We've gone to great lengths to adhere to the Seed community styleguides & best practices.
For more information on how to this works with other frontends/backends, head over to the RealWorld repo.
NOTE: This project uses older Seed version 0.5.1. It will be updated and refactored once Seeder is ready. Please see built-in examples and other projects instead.
How it works
I think the best way to show you how it works is to describe what's going on step by step when you open this example in your browser. So let's say you've just written https://seed-rs-realworld.netlify.com/ to URL bar and pressed Enter:
- Netlify redirects your request to
index.html. (See/netlify.toml.) - There is a script in
/index.htmlthat loadswasmfile and starts application. - Application is initialized in
/src/lib.rs- see blockStartat the end of that file. - The first is called function
before_mount(we are still in filelib.rs):- You can select mount point with
.mount_point("element-id"). But the default one (app) is good for us. .mount_type(MountType::Takeover)means that the previous HTML content in the mount point will be replaced with the application HTML.
- You can select mount point with
- Then the function
after_mountis called:- It tries to load
Viewerfrom the local storage.Vieweris the object that contains info about currently logged in user (name, auth. token, avatar image url, etc). - Then it creates a new
SessionwithViewer(or without it if you are not logged in).Sessionis de facto shared state - you are able to get it from all pages. - Then the
Modelis created withSession.Modelis enum, where each variant represents one page. Here, ininitfunction, we createModelfrom variantRedirectbecause we haven't decided yet which page to show (i.e.Redirectis a "placeholder" variant). - And we also try to parse given URL and send result to Seed's runtime.
- It tries to load
after_mountfunction also sends messageRouteChangedwhich is handled inupdatefunction. Handler calls functionchange_model_by_routewhich choose the rightModelaccording to the URL path.Model::Homeis chosen in our example. However this variant should contain "sub-model" from/src/page/homeso we need to callpage::home::init(..)to get it.page::home::initloads required data (e.g. article feed or tags).- We have data to show so when Seed's runtime calls
Viewfunction again we can see it rendered in the browser.
We didn't talked about function sink in lib.rs in the steps above. sink has the similar purpose like update function but it handles global messages. It's the way how modules communicate with parents or with other modules. The most use case is to send GMsg::RoutePushed when we want to go to another page (see function go_to in /src/route.rs).
Getting started
- Install Rust
- Update Rust:
$ rustup update - Install WASM target:
$ rustup target add wasm32-unknown-unknown - Install cargo-make:
$ cargo install --force cargo-make - Build project from its root:
$ cargo make allor$ cargo make watch- Note: You need some dependencies like
pkg-configon Linux - just follow recommendations after compilation errors.
- Note: You need some dependencies like
- Start local server:
$ cargo make serve- Note: You have to open a new terminal tab/window if you used
$ cargo make watch.
- Note: You have to open a new terminal tab/window if you used
- Open in you browser localhost:8000
Contributing
- Create issues and PRs - bugs, missing documentation, typos, unreadable code...
- Squash commits, rebase on the current
masterand run$ cargo make verify(+ commit changes, if any) before creating PR.
Statistics
$ tokei
-------------------------------------------------------------------------------
Language Files Lines Code Comments Blanks
-------------------------------------------------------------------------------
HTML 1 21 19 2 0
Markdown 1 66 66 0 0
Rust 81 5899 4869 344 686
SVG 1 17 17 0 0
TOML 4 199 146 20 33
-------------------------------------------------------------------------------
Total 88 6202 5117 366 719
-------------------------------------------------------------------------------
