Skip to content

Commit

Permalink
update readme
Browse files Browse the repository at this point in the history
  • Loading branch information
kimonp committed Jan 7, 2024
1 parent 0cd6798 commit aa1e52d
Show file tree
Hide file tree
Showing 2 changed files with 27 additions and 6 deletions.
2 changes: 1 addition & 1 deletion Dioxus.toml
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ name = "game_of_life"
# default platfrom
# you can also use `dx serve/build --platform XXX` to use other platform
# value: web | desktop
default_platform = "web"
default_platform = "desktop"

# Web `build` & `serve` dist path
out_dir = "dist"
Expand Down
31 changes: 26 additions & 5 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,22 +8,43 @@ With the Dioxus framework the code is 100% Rust.

<img src="game_of_life.png" alt="Game of Life" class="center" width="480" height="616">

## Versions

* 1.x: Works on web only, uses canvas for rendering
* 2.x: Works on web or desktop, uses SVG for rendering

## Demonstrates
* A Dioxus web app written completely in Rust.
* A Dioxus web/desktop app written completely in Rust.
* Frame animation using `request_animation_frame()` and abstracting to a Dioxus `use_state` hook.
* Limited by the frame rate of the monitor.
* A FramesPerSecond component that displays the current frames per second.
* Building a component from a 2d HTML canvas.
* Using using Dioxus' onmount event to get an element (similar to react's use_ref)
* Version 1.x
* Building a component from a 2d HTML canvas.
* Using using Dioxus' onmount event to get an element (similar to react's use_ref)
* Version 2.x
* How to create a Dioxus app that works with both desktop and web
* Use use_eval() to get access to the DOM
* Don't use canvas (svg instead)
* Access to precise system time
* Generating random numbers
* Use of SVG to draw grid and cells
* Use view_port to set coordinate systems to simplify coding
* Cell grid's units are pixels
* Create a grid using patterns with major and minor grid lines

## Install and run
* Install the rust development environment: https://www.rust-lang.org/tools/install
* Install the [dioxus CLI](https://dioxuslabs.com/learn/0.4/CLI/installation): `cargo install dioxus-cli`
* Install the wasm target for rust: `rustup target add wasm32-unknown-unknown`
* clone this repository: `git clone https://github.com/kimonp/dioxus-game-of-life.git`
* `cd dioxus-game-of-life`
* Run in debug mode with the dioxus cli: `dx serve --platform=web`
* Point your browser at: http://localhost:8080
* Version 2.0:
* Desktop: `dx serve --platform=desktop --featues=desktop`
* Web: `dx serve --platform=web --featues=web`
* Point your browser at: http://localhost:8080
* Version 1.0
* Run in debug mode with the dioxus cli: `dx serve --platform=web`
* Point your browser at: http://localhost:8080

## Methodology
Defines a `GameOfLifeGrid` component that renders the game of life (with several control buttons),
Expand Down

0 comments on commit aa1e52d

Please sign in to comment.