update readmes to reflect new versions

This commit is contained in:
Jonathan Kelley 2024-11-17 19:58:01 -05:00
parent 06a269a285
commit de9fdefa84
No known key found for this signature in database
GPG key ID: 1FBB50F7EB0A08BE
38 changed files with 129 additions and 111 deletions

View file

@ -4,4 +4,4 @@ This example shows how an app might be styled with TailwindCSS.
## Running
Our [Tailwind](https://dioxuslabs.com/learn/0.5/cookbook/tailwind) guide explains how to setup and run Dioxus-Tailwind projects.
Our [Tailwind](https://dioxuslabs.com/learn/0.6/cookbook/tailwind) guide explains how to setup and run Dioxus-Tailwind projects.

View file

@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5) |
[Guides](https://dioxuslabs.com/learn/0.6) |
[API Docs](https://docs.rs/dioxus-autofmt/latest/dioxus_autofmt) |
[Chat](https://discord.gg/XgGxMSkvUM)

View file

@ -15,13 +15,13 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5) |
[Guides](https://dioxuslabs.com/learn/0.6) |
[API Docs](https://docs.rs/dioxus-check) |
[Chat](https://discord.gg/XgGxMSkvUM)
## Overview
`dioxus-check` analyzes Dioxus source code and reports errors and warnings. Primarily, it enforces the [Rules of Hooks](https://dioxuslabs.com/learn/0.5/reference/hooks#rules-of-hooks).
`dioxus-check` analyzes Dioxus source code and reports errors and warnings. Primarily, it enforces the [Rules of Hooks](https://dioxuslabs.com/learn/0.6/reference/hooks#rules-of-hooks).
## Contributing

View file

@ -162,11 +162,11 @@ impl Display for IssueReport {
#[allow(clippy::enum_variant_names)] // we'll add non-hook ones in the future
/// Issues that might be found via static analysis of a Dioxus file.
pub enum Issue {
/// <https://dioxuslabs.com/learn/0.5/reference/hooks#no-hooks-in-conditionals>
/// <https://dioxuslabs.com/learn/0.6/reference/hooks#no-hooks-in-conditionals>
HookInsideConditional(HookInfo, ConditionalInfo),
/// <https://dioxuslabs.com/learn/0.5/reference/hooks#no-hooks-in-loops>
/// <https://dioxuslabs.com/learn/0.6/reference/hooks#no-hooks-in-loops>
HookInsideLoop(HookInfo, AnyLoopInfo),
/// <https://dioxuslabs.com/learn/0.5/reference/hooks#no-hooks-in-closures>
/// <https://dioxuslabs.com/learn/0.6/reference/hooks#no-hooks-in-closures>
HookInsideClosure(HookInfo, ClosureInfo),
HookInsideAsync(HookInfo, AsyncInfo),
HookOutsideComponent(HookInfo),

View file

@ -68,4 +68,4 @@ title = "Hello"
[web.resource.dev]
```
The full anatomy of `Dioxus.toml` is shown on the [Dioxus website](https://dioxuslabs.com/learn/0.5/CLI/configure).
The full anatomy of `Dioxus.toml` is shown on the [Dioxus website](https://dioxuslabs.com/learn/0.6/CLI/configure).

View file

@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5) |
[Guides](https://dioxuslabs.com/learn/0.6) |
[API Docs](https://docs.rs/dioxus-config-macro/latest/dioxus_config_macro/) |
[Chat](https://discord.gg/XgGxMSkvUM)

View file

@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5) |
[Guides](https://dioxuslabs.com/learn/0.6) |
[API Docs](https://docs.rs/dioxus-core-macro/latest/dioxus_core_macro) |
[Chat](https://discord.gg/XgGxMSkvUM)

View file

@ -1055,7 +1055,7 @@ Finally, call `.build()` to create the instance of `{name}`.
name: field_name, ..
} = field;
if *field_name == "key" {
return Err(Error::new_spanned(field_name, "Naming a prop `key` is not allowed because the name can conflict with the built in key attribute. See https://dioxuslabs.com/learn/0.5/reference/dynamic_rendering#rendering-lists for more information about keys"));
return Err(Error::new_spanned(field_name, "Naming a prop `key` is not allowed because the name can conflict with the built in key attribute. See https://dioxuslabs.com/learn/0.6/reference/dynamic_rendering#rendering-lists for more information about keys"));
}
let StructInfo {
ref builder_name, ..

View file

@ -81,7 +81,7 @@ fn main() {
## Contributing
- Check out the website [section on contributing](https://dioxuslabs.com/learn/0.5/contributing).
- Check out the website [section on contributing](https://dioxuslabs.com/learn/0.6/contributing).
- Report issues on our [issue tracker](https://github.com/dioxuslabs/dioxus/issues).
- [Join](https://discord.gg/XgGxMSkvUM) the discord and ask questions!

View file

@ -6,7 +6,7 @@ edition = "2021"
description = "WebView renderer for Dioxus"
license = "MIT OR Apache-2.0"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com/learn/0.5/getting_started"
homepage = "https://dioxuslabs.com/learn/0.6/getting_started"
keywords = ["dom", "ui", "gui", "react"]
[dependencies]

View file

@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5) |
[Guides](https://dioxuslabs.com/learn/0.6) |
[API Docs](https://docs.rs/dioxus-desktop/latest/dioxus_desktop) |
[Chat](https://discord.gg/XgGxMSkvUM)
@ -25,7 +25,7 @@
This requires that webview is installed on the target system. WebView is installed by default on macOS and iOS devices, but might not come preinstalled on Windows or Linux devices. To fix these issues, follow the [instructions in the guide](guide-url).
[guide-url]: https://dioxuslabs.com/learn/0.5/getting_started
[guide-url]: https://dioxuslabs.com/learn/0.6/getting_started
## Features

View file

@ -47,4 +47,4 @@ To configure the webview, menubar, and other important desktop-specific features
## Future Steps
Make sure to read the [Dioxus Guide](https://dioxuslabs.com/learn/0.5/) if you already haven't!
Make sure to read the [Dioxus Guide](https://dioxuslabs.com/learn/0.6/) if you already haven't!

View file

@ -6,7 +6,7 @@ edition = "2021"
description = "Build fullstack web, desktop, and mobile apps with a single codebase."
license = "MIT OR Apache-2.0"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com/learn/0.5/"
homepage = "https://dioxuslabs.com/learn/0.6/"
keywords = ["dom", "ui", "gui", "react", "wasm"]
rust-version = "1.79.0"

View file

@ -11,8 +11,8 @@
This overview provides a brief introduction to Dioxus. For a more in-depth guide, make sure to check out:
- [Getting Started](https://dioxuslabs.com/learn/0.5/getting_started)
- [Book (0.5)](https://dioxuslabs.com/learn/0.5)
- [Getting Started](https://dioxuslabs.com/learn/0.6/getting_started)
- [Book (0.5)](https://dioxuslabs.com/learn/0.6)
- [Examples](https://github.com/DioxusLabs/dioxus/tree/main/examples)
# Overview and Goals
@ -202,7 +202,7 @@ fn App() -> Element {
```
Hooks are sensitive to how they are used. To use hooks, you must abide by the
["rules of hooks"](https://dioxuslabs.com/learn/0.5/reference/hooks#rules-of-hooks):
["rules of hooks"](https://dioxuslabs.com/learn/0.6/reference/hooks#rules-of-hooks):
- Functions with "use\_" should not be called in callbacks
- Functions with "use\_" should not be called out of order

View file

@ -23,35 +23,47 @@
width="100%"
class="lightmode-image"
>
<div>
<a href=https://dioxuslabs.com/learn/0.6/getting_started>Getting Started</a> | <a href="https://dioxuslabs.com/learn/0.6">Book (0.6)</a> | <a href="https://github.com/DioxusLabs/dioxus/tree/main/examples">Examples</a>
</div>
</div>
# Resources
This overview provides a brief introduction to Dioxus. For a more in-depth guide, make sure to check out:
- [Getting Started](https://dioxuslabs.com/learn/0.6/getting_started)
- [Book (0.6)](https://dioxuslabs.com/learn/0.6)
- [Examples](https://github.com/DioxusLabs/dioxus/tree/main/examples)
# Overview
---
Dioxus is a framework for building cross-platform apps in Rust. With one codebase, you can build web, desktop, and mobile apps with fullstack server functions. Dioxus is designed to be easy to learn for developers familiar with web technologies like HTML, CSS, and JavaScript.
<div align="center">
<img src="https://github.com/user-attachments/assets/dddae6a9-c13b-4a88-84e8-dc98c1286d2a" alt="App with dioxus" height="600px">
</div>
# At a glance
## At a glance
Dioxus is crossplatform app framework that empowers developer to build beautiful, fast, type-safe apps with Rust. By default, Dioxus apps are declared with HTML and CSS, but you can use other technologies like Skia or AppKit.
Dioxus is crossplatform app framework that empowers developer to build beautiful, fast, type-safe apps with Rust. By default, Dioxus apps are declared with HTML and CSS though alternative renderers are available. Dioxus includes a number of useful features:
Dioxus includes a number of useful features:
- Hotreloading of RSX markup and assets
- Interactive CLI
- Interactive CLI with logging, project templates, linting, and more
- Integrated bundler for deploying to the web, macOS, Linux, and Windows
- Support for modern web features like SSR, Hydration, and HTML streaming
- Direct access to system APIs through JNI (Android), CoreFoundation (Apple), and web-sys (web)
- Type-safe application routing and server functions
## Brief Overview
## Quick start
To get started with Dioxus, you'll want to grab the dioxus-cli tool: `dx`. We distribute `dx` with `cargo-binstall` - if you already have binstall skip this step.
```shell
# skip if you already have cargo-binstall
cargo install cargo-binstall
# install the precompiled `dx` tool
cargo binstall dioxus-cli
# create a new app, following the template
dx new my-app && cd my-app
# and then serve!
dx serve --platform desktop
```
## Your first app
All Dioxus apps are built by composing functions return an `Element`.
@ -67,7 +79,6 @@ fn main() {
// The #[component] attribute streamlines component creation.
// It's not required, but highly recommended. It will lint incorrect component definitions and help you create props structs.
#[component]
#[component]
fn App() -> Element {
rsx! { "hello world!" }
}
@ -80,7 +91,8 @@ Any element in `rsx!` can have attributes, listeners, and children. For
consistency, we force all attributes and listeners to be listed _before_
children.
```rust, ignore
```rust, no_run
# use dioxus::prelude::*;
let value = "123";
rsx! {
@ -94,7 +106,8 @@ rsx! {
The `rsx!` macro accepts attributes in "struct form". Any rust expression contained within curly braces that implements [`IntoDynNode`](dioxus_core::IntoDynNode) will be parsed as a child. We make two exceptions: both `for` loops and `if` statements are parsed where their body is parsed as a rsx nodes.
```rust, ignore
```rust, no_run
# use dioxus::prelude::*;
rsx! {
div {
for _ in 0..10 {
@ -107,7 +120,8 @@ rsx! {
Putting everything together, we can write a simple component that renders a list of
elements:
```rust, ignore
```rust, no_run
# use dioxus::prelude::*;
#[component]
fn App() -> Element {
let name = "dave";
@ -128,7 +142,9 @@ We can compose these function components to build a complex app. Each new compon
In Dioxus, all properties are memoized by default with `Clone` and `PartialEq`. For props you can't clone, simply wrap the fields in a [`ReadOnlySignal`](dioxus_signals::ReadOnlySignal) and Dioxus will handle converting types for you.
```rust, ignore
```rust, no_run
# use dioxus::prelude::*;
# #[component] fn Header(title: String, color: String) -> Element { todo!() }
#[component]
fn App() -> Element {
rsx! {
@ -142,7 +158,8 @@ fn App() -> Element {
The `#[component]` macro will help us automatically create a props struct for our component:
```rust, ignore
```rust, no_run
# use dioxus::prelude::*;
// The component macro turns the arguments for our function into named fields we can pass in to the component in rsx
#[component]
fn Header(title: String, color: String) -> Element {
@ -155,7 +172,7 @@ fn Header(title: String, color: String) -> Element {
}
```
> You can read more about props in the [reference](https://dioxuslabs.com/learn/0.5/reference/component_props).
> You can read more about props in the [reference](https://dioxuslabs.com/learn/0.6/reference/component_props).
## Hooks
@ -164,7 +181,8 @@ it to render UI elements.
By convention, all hooks are functions that should start with `use_`. We can use hooks to define the state and modify it from within listeners.
```rust, ignore
```rust, no_run
# use dioxus::prelude::*;
#[component]
fn App() -> Element {
// The use signal hook runs once when the component is created and then returns the current value every run after the first
@ -174,14 +192,14 @@ fn App() -> Element {
}
```
Hooks are sensitive to how they are used. To use hooks, you must abide by the ["rules of hooks"](https://dioxuslabs.com/learn/0.5/reference/hooks#rules-of-hooks):
Hooks are sensitive to how they are used. To use hooks, you must abide by the ["rules of hooks"](https://dioxuslabs.com/learn/0.6/reference/hooks#rules-of-hooks):
- Hooks can only be called in the body of a component or another hook. Not inside of another expression like a loop, conditional or function call.
- Hooks should start with "use\_"
In a sense, hooks let us add a field of state to our component without declaring an explicit state struct. However, this means we need to "load" the struct in the right order. If that order is wrong, then the hook will pick the wrong state and panic.
Dioxus includes many built-in hooks that you can use in your components. If those hooks don't fit your use case, you can also extend Dioxus with [custom hooks](https://dioxuslabs.com/learn/0.5/cookbook/state/custom_hooks).
Dioxus includes many built-in hooks that you can use in your components. If those hooks don't fit your use case, you can also extend Dioxus with [custom hooks](https://dioxuslabs.com/learn/0.6/cookbook/state/custom_hooks).
## Putting it all together
@ -208,18 +226,18 @@ fn App() -> Element {
## Conclusion
This overview doesn't cover everything. Make sure to check out the [tutorial](https://dioxuslabs.com/learn/0.5/guide) and [reference](https://dioxuslabs.com/learn/0.5/reference) on the official
This overview doesn't cover everything. Make sure to check out the [tutorial](https://dioxuslabs.com/learn/0.6/guide) and [reference](https://dioxuslabs.com/learn/0.6/reference) on the official
website for more details.
Beyond this overview, Dioxus supports:
- [Server-side rendering](https://dioxuslabs.com/learn/0.5/reference/fullstack)
- [Server-side rendering](https://dioxuslabs.com/learn/0.6/reference/fullstack)
- Concurrent rendering (with async support)
- Web/Desktop/Mobile support
- Pre-rendering and hydration
- Fragments, and Suspense
- Inline-styles
- [Custom event handlers](https://dioxuslabs.com/learn/0.5/reference/event_handlers#handler-props)
- [Custom event handlers](https://dioxuslabs.com/learn/0.6/reference/event_handlers#handler-props)
- Custom elements
- Basic fine-grained reactivity (IE SolidJS/Svelte)
- and more!

View file

@ -9,7 +9,7 @@
//! - `html`: (default) exports `dioxus-html` as the default elements to use in rsx
//! - `hooks`: (default) re-exports `dioxus-hooks`
//! - `hot-reload`: (default) enables hot rsx reloading in all renderers that support it
//! - `router`: exports the [router](https://dioxuslabs.com/learn/0.5/router) and enables any router features for the current platform
//! - `router`: exports the [router](https://dioxuslabs.com/learn/0.6/router) and enables any router features for the current platform
//! - `third-party-renderer`: Just disables warnings about no active platform when no renderers are enabled
//!
//! Platform features (the current platform determines what platform the [`launch()`] function runs):

View file

@ -7,7 +7,7 @@ authors = ["Jonathan Kelley"]
description = "Wire format for the Dioxus CLI"
license = "MIT OR Apache-2.0"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com/learn/0.5/"
homepage = "https://dioxuslabs.com/learn/0.6/"
keywords = ["dom", "ui", "gui", "react", "wasm"]
rust-version = "1.79.0"

View file

@ -28,11 +28,11 @@ Formats the current file as RSX.
This overview provides a brief introduction to Dioxus. For a more in-depth guide, make sure to check out:
- [Getting Started](https://dioxuslabs.com/learn/0.5/getting_started)
- [Book (0.5)](https://dioxuslabs.com/learn/0.5)
- [Getting Started](https://dioxuslabs.com/learn/0.6/getting_started)
- [Book (0.5)](https://dioxuslabs.com/learn/0.6)
## Contributing
- Check out the website [section on contributing](https://dioxuslabs.com/learn/0.5/contributing).
- Check out the website [section on contributing](https://dioxuslabs.com/learn/0.6/contributing).
- Report issues on our [issue tracker](https://github.com/dioxuslabs/dioxus/issues).
- [Join](https://discord.gg/XgGxMSkvUM) the discord and ask questions!

View file

@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/) |
[Guides](https://dioxuslabs.com/learn/0.6/) |
[API Docs](https://docs.rs/dioxus-fullstack/latest/dioxus_fullstack/) |
[Chat](https://discord.gg/XgGxMSkvUM)
@ -205,7 +205,7 @@ async fn get_meaning(of: String) -> Result<Option<u32>, ServerFnError> {
## Getting Started
To get started with full stack Dioxus, check out our [getting started guide](https://dioxuslabs.com/learn/0.5/getting_started), or the [full stack examples](https://github.com/DioxusLabs/dioxus/tree/master/examples).
To get started with full stack Dioxus, check out our [getting started guide](https://dioxuslabs.com/learn/0.6/getting_started), or the [full stack examples](https://github.com/DioxusLabs/dioxus/tree/master/examples).
## Contributing

View file

@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/) |
[Guides](https://dioxuslabs.com/learn/0.6/) |
[API Docs](https://docs.rs/dioxus-hooks/latest/dioxus_hooks) |
[Chat](https://discord.gg/XgGxMSkvUM)
@ -29,7 +29,7 @@
- use_memo
- use_coroutine
Unlike React, none of these hooks are foundational since they all build off the primitive `use_hook`. You can extend these hooks with [custom hooks](https://dioxuslabs.com/learn/0.5/cookbook/state/custom_hooks) in your own code. If you think they would be useful for the broader community, you can open a PR to add your hook to the [Dioxus Awesome](https://github.com/DioxusLabs/awesome-dioxus) list.
Unlike React, none of these hooks are foundational since they all build off the primitive `use_hook`. You can extend these hooks with [custom hooks](https://dioxuslabs.com/learn/0.6/cookbook/state/custom_hooks) in your own code. If you think they would be useful for the broader community, you can open a PR to add your hook to the [Dioxus Awesome](https://github.com/DioxusLabs/awesome-dioxus) list.
## State Cheat Sheet
@ -41,9 +41,9 @@ Depending on where you need to access the state, you can put your state in one o
| Location | Where can you access the state? | Recommended for Libraries? | Examples |
| ---------------------------------------------------------------------------------------- | ------------------------------- | -------------------------- | --------------------------------------------------------------------------- |
| [Hooks](https://docs.rs/dioxus-hooks/latest/dioxus_hooks/fn.use_signal.html) | Any components you pass it to | ✅ | `use_signal(\|\| 0)`, `use_memo(\|\| state() * 2)` |
| [Context](https://docs.rs/dioxus-hooks/latest/dioxus_hooks/fn.use_context_provider.html) | Any child components | ✅ | `use_context_provider(\|\| Signal::new(0))`, `use_context::<Signal<i32>>()` |
| [Global](https://docs.rs/dioxus/latest/dioxus/prelude/struct.Signal.html#method.global) | Anything in your app | ❌ | `Signal::global(\|\| 0)` |
| [Hooks](https://docs.rs/dioxus-hooks/latest/dioxus_hooks/fn.use_signal.html) | Any components you pass it to | ✅ | `use_signal(\|\| 0)`, `use_memo(\|\| state() * 2)` |
| [Context](https://docs.rs/dioxus-hooks/latest/dioxus_hooks/fn.use_context_provider.html) | Any child components | ✅ | `use_context_provider(\|\| Signal::new(0))`, `use_context::<Signal<i32>>()` |
| [Global](https://docs.rs/dioxus/latest/dioxus/prelude/struct.Signal.html#method.global) | Anything in your app | ❌ | `Signal::global(\|\| 0)` |
### Derived State
@ -51,9 +51,9 @@ If you don't have an initial value for your state, you can derive your state fro
| Hook | Reactive (reruns when dependencies change) | Async | Memorizes Output | Example |
| ----------------------------------------------------------------------------------- | ------------------------------------------ | ----- | ---------------- | ----------------------------------------------------------------------------------- |
| [`use_memo`](https://docs.rs/dioxus/latest/dioxus/prelude/fn.use_memo.html) | ✅ | ❌ | ✅ | `use_memo(move \|\| count() * 2)` |
| [`use_resource`](https://docs.rs/dioxus/latest/dioxus/prelude/fn.use_resource.html) | ✅ | ✅ | ❌ | `use_resource(move \|\| reqwest::get(format!("/users/{user_id}")))` |
| [`use_future`](https://docs.rs/dioxus/latest/dioxus/prelude/fn.use_future.html) | ❌ | ✅ | ❌ | `use_future(move \|\| println!("{:?}", reqwest::get(format!("/users/{user_id}"))))` |
| [`use_memo`](https://docs.rs/dioxus/latest/dioxus/prelude/fn.use_memo.html) | ✅ | ❌ | ✅ | `use_memo(move \|\| count() * 2)` |
| [`use_resource`](https://docs.rs/dioxus/latest/dioxus/prelude/fn.use_resource.html) | ✅ | ✅ | ❌ | `use_resource(move \|\| reqwest::get(format!("/users/{user_id}")))` |
| [`use_future`](https://docs.rs/dioxus/latest/dioxus/prelude/fn.use_future.html) | ❌ | ✅ | ❌ | `use_future(move \|\| println!("{:?}", reqwest::get(format!("/users/{user_id}"))))` |
### Persistent State
@ -61,8 +61,8 @@ The core hooks library doesn't provide hooks for persistent state, but you can e
| State | Sharable | Example |
| ---------------------------------------------------------------------------------- | -------- | ------------------------------------------------------------------------------------------------- |
| [`use_persistent`](https://github.com/DioxusLabs/sdk/tree/master/examples/storage) | ❌ | `use_persistent("unique_key", move \|\| initial_state)` |
| [`Router<Route> {}`](https://dioxuslabs.com/learn/0.5/router) | ✅ | `#[derive(Routable, Clone, PartialEq)] enum Route { #[route("/user/:id")] Homepage { id: u32 } }` |
| [`use_persistent`](https://github.com/DioxusLabs/sdk/tree/master/examples/storage) | ❌ | `use_persistent("unique_key", move \|\| initial_state)` |
| [`Router<Route> {}`](https://dioxuslabs.com/learn/0.6/router) | ✅ | `#[derive(Routable, Clone, PartialEq)] enum Route { #[route("/user/:id")] Homepage { id: u32 } }` |
## Contributing

View file

@ -3,7 +3,7 @@
You will often need to move state around between your components. Dioxus provides three different ways to pass around state:
1. Just pass your values as [props](https://dioxuslabs.com/learn/0.5/reference/component_props):
1. Just pass your values as [props](https://dioxuslabs.com/learn/0.6/reference/component_props):
```rust
# use dioxus::prelude::*;
@ -30,7 +30,7 @@ fn IncrementButton(mut count: Signal<i32>) -> Element {
This is the most common way to pass state around. It is the most explicit and local to your component. Use this when it isn't overly annoying to pass around a value.
2. Use [use_context](https://dioxuslabs.com/learn/0.5/reference/context) to pass state from a parent component to all children:
2. Use [use_context](https://dioxuslabs.com/learn/0.6/reference/context) to pass state from a parent component to all children:
```rust
# use dioxus::prelude::*;

View file

@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/) |
[Guides](https://dioxuslabs.com/learn/0.6/) |
[API Docs](https://docs.rs/dioxus-html/latest/dioxus_html) |
[Chat](https://discord.gg/XgGxMSkvUM)

View file

@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/) |
[Guides](https://dioxuslabs.com/learn/0.6/) |
[API Docs](https://docs.rs/dioxus-interpreter-js/latest/dioxus_interpreter_js) |
[Chat](https://discord.gg/XgGxMSkvUM)

View file

@ -3,7 +3,7 @@ name = "dioxus-liveview"
version = { workspace = true }
edition = "2021"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com/learn/0.5/getting_started"
homepage = "https://dioxuslabs.com/learn/0.6/getting_started"
keywords = ["dom", "ui", "gui", "react", "liveview"]
description = "Build server-side apps with Dioxus"
authors = ["Jonathan Kelley", "Evan Almloff"]

View file

@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/) |
[Guides](https://dioxuslabs.com/learn/0.6/) |
[API Docs](https://docs.rs/dioxus-liveview/latest/dioxus_liveview) |
[Chat](https://discord.gg/XgGxMSkvUM)

View file

@ -5,7 +5,7 @@ authors = ["Jonathan Kelley"]
edition = "2021"
description = "Mobile-compatible renderer for Dioxus"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com/learn/0.5/getting_started"
homepage = "https://dioxuslabs.com/learn/0.6/getting_started"
keywords = ["dom", "ui", "gui", "react"]
license = "MIT OR Apache-2.0"

View file

@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/) |
[Guides](https://dioxuslabs.com/learn/0.6/) |
[API Docs](https://docs.rs/dioxus-mobile/latest/dioxus_mobile) |
[Chat](https://discord.gg/XgGxMSkvUM)
@ -29,7 +29,7 @@ Dioxus Mobile supports both iOS and Android. However, Android support is still q
Getting set up with mobile can but quite challenging. The tooling here isn't great (yet) and might take some hacking around to get things working. macOS M1 is broadly unexplored and might not work for you.
You can read [our guide](https://dioxuslabs.com/learn/0.5/getting_started) on mobile development with Dioxus to get started.
You can read [our guide](https://dioxuslabs.com/learn/0.6/getting_started) on mobile development with Dioxus to get started.
## Contributing

View file

@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/router/) |
[Guides](https://dioxuslabs.com/learn/0.6/router/) |
[API Docs](https://docs.rs/dioxus-router/latest/dioxus_router) |
[Chat](https://discord.gg/XgGxMSkvUM)

View file

@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/) |
[Guides](https://dioxuslabs.com/learn/0.6/) |
[API Docs](https://docs.rs/rsx-rosetta/latest/rsx-rosetta) |
[Chat](https://discord.gg/XgGxMSkvUM)

View file

@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/) |
[Guides](https://dioxuslabs.com/learn/0.6/) |
[API Docs](https://docs.rs/dioxus-rsx/latest/dioxus_rsx) |
[Chat](https://discord.gg/XgGxMSkvUM)

View file

@ -9,8 +9,8 @@
This crate is a part of the broader Dioxus ecosystem. For more resources about Dioxus, check out:
- [Getting Started](https://dioxuslabs.com/learn/0.5/getting_started)
- [Book](https://dioxuslabs.com/learn/0.5/)
- [Getting Started](https://dioxuslabs.com/learn/0.6/getting_started)
- [Book](https://dioxuslabs.com/learn/0.6/)
- [Examples](https://github.com/DioxusLabs/dioxus/tree/main/examples)
## Overview

View file

@ -6,7 +6,7 @@ edition = "2021"
description = "Web-sys renderer for Dioxus: Build fullstack web, desktop, and mobile apps with a single codebase."
license = "MIT OR Apache-2.0"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com/learn/0.5/getting_started"
homepage = "https://dioxuslabs.com/learn/0.6/getting_started"
keywords = ["dom", "ui", "gui", "web", "wasm"]
[dependencies]

View file

@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/) |
[Guides](https://dioxuslabs.com/learn/0.6/) |
[API Docs](https://docs.rs/dioxus-web/latest/dioxus_web) |
[Chat](https://discord.gg/XgGxMSkvUM)

View file

@ -40,7 +40,7 @@
<span> | </span>
<a href="https://github.com/DioxusLabs/example-projects"></a>
<span> | </span>
<a href="https://dioxuslabs.com/learn/0.5/"> ガイド </a>
<a href="https://dioxuslabs.com/learn/0.6/"> ガイド </a>
<span> | </span>
<a href="https://github.com/DioxusLabs/dioxus/blob/main/translations/zh-cn/README.md"> 中文 </a>
<span> | </span>

View file

@ -45,7 +45,7 @@
<span> | </span>
<a href="https://github.com/DioxusLabs/dioxus/tree/main/examples"> Examples </a>
<span> | </span>
<a href="https://dioxuslabs.com/learn/0.5/guide"> Guide </a>
<a href="https://dioxuslabs.com/learn/0.6/guide"> Guide </a>
<span> | </span>
<a href="https://github.com/DioxusLabs/dioxus/blob/main/translations/zh-cn/README.md"> 中文 </a>
<span> | </span>
@ -81,7 +81,7 @@ fn app() -> Element {
- [인체공학적 상태 관리](https://dioxuslabs.com/blog/release-050)은 React, Solid, Svelte의 장점을 결합했습니다
- 극도로 높은 성능을 자랑하며 Rust의 가장 빠른 wasm 프레임워크 [sledgehammer](https://dioxuslabs.com/blog/templates-diffing)에 의해 구동됩니다
- 웹, macOS, Linux, Windows에 배포할 수 있는 통합 번들러
- 그 외에도 많은 기능! [Dioxus 투어를 살펴보세요](https://dioxuslabs.com/learn/0.5/).
- 그 외에도 많은 기능! [Dioxus 투어를 살펴보세요](https://dioxuslabs.com/learn/0.6/).
## 핫 리로딩
@ -93,7 +93,7 @@ fn app() -> Element {
## 웹 및 데스크톱 배포를 위한 번들러
단순히 `dx bundle`을 실행하면 앱이 빌드되고 최적화된 번들로 패키징됩니다. 웹에서는 [`.avif` 생성, `.wasm` 압축, 최소화](https://dioxuslabs.com/learn/0.5/reference/assets) 등을 활용할 수 있습니다. [50kb 미만](https://github.com/ealmloff/tiny-dioxus/)의 웹앱과 15mb 미만의 데스크톱/모바일 앱을 빌드하세요.
단순히 `dx bundle`을 실행하면 앱이 빌드되고 최적화된 번들로 패키징됩니다. 웹에서는 [`.avif` 생성, `.wasm` 압축, 최소화](https://dioxuslabs.com/learn/0.6/reference/assets) 등을 활용할 수 있습니다. [50kb 미만](https://github.com/ealmloff/tiny-dioxus/)의 웹앱과 15mb 미만의 데스크톱/모바일 앱을 빌드하세요.
<div align="center">
<img src="../../notes/bundle.gif">
@ -101,7 +101,7 @@ fn app() -> Element {
## 환상적인 문서
깨끗하고 읽기 쉽고 포괄적인 문서를 구축하는 데 많은 노력을 기울였습니다. 모든 HTML 요소와 리스너는 MDN 문서로 문서화되었으며, 저희 문서 사이트는 Dioxus 자체와 지속적인 통합을 실행하여 문서가 항상 최신 상태로 유지되도록 합니다. 가이드, 참조, 레시피 등을 보려면 [Dioxus 웹사이트](https://dioxuslabs.com/learn/0.5/)를 확인하세요. 재미있는 사실: 저희는 Dioxus 웹사이트를 새로운 Dioxus 기능의 테스트베드로 사용합니다 - [확인해보세요!](https://github.com/dioxusLabs/docsite)
깨끗하고 읽기 쉽고 포괄적인 문서를 구축하는 데 많은 노력을 기울였습니다. 모든 HTML 요소와 리스너는 MDN 문서로 문서화되었으며, 저희 문서 사이트는 Dioxus 자체와 지속적인 통합을 실행하여 문서가 항상 최신 상태로 유지되도록 합니다. 가이드, 참조, 레시피 등을 보려면 [Dioxus 웹사이트](https://dioxuslabs.com/learn/0.6/)를 확인하세요. 재미있는 사실: 저희는 Dioxus 웹사이트를 새로운 Dioxus 기능의 테스트베드로 사용합니다 - [확인해보세요!](https://github.com/dioxusLabs/docsite)
<div align="center">
<img src="../../notes/docs.avif">
@ -109,7 +109,7 @@ fn app() -> Element {
## 개발자 경험에 중점
Dioxus는 개발자 경험을 우선시하며, end-to-end 도구 개발에 많은 노력을 기울였습니다. RSX 코드를 자동으로 포맷하고 HTML을 RSX로 변환하는 등 다양한 기능을 제공하는 [VSCode 확장 프로그램](https://marketplace.visualstudio.com/items?itemName=DioxusLabs.dioxus)을 제작했습니다. 또한 새로운 앱 생성, 서비스 실행, 크로스 플랫폼 번들링을 지원하는 매우 강력한 [CLI](https://dioxuslabs.com/learn/0.5/CLI)를 개발했으며, 배포는 향후 로드맵에 포함되어 있습니다.
Dioxus는 개발자 경험을 우선시하며, end-to-end 도구 개발에 많은 노력을 기울였습니다. RSX 코드를 자동으로 포맷하고 HTML을 RSX로 변환하는 등 다양한 기능을 제공하는 [VSCode 확장 프로그램](https://marketplace.visualstudio.com/items?itemName=DioxusLabs.dioxus)을 제작했습니다. 또한 새로운 앱 생성, 서비스 실행, 크로스 플랫폼 번들링을 지원하는 매우 강력한 [CLI](https://dioxuslabs.com/learn/0.6/CLI)를 개발했으며, 배포는 향후 로드맵에 포함되어 있습니다.
<div align="center">
<img src="../../notes/autofmt.gif">
@ -375,7 +375,7 @@ Dioxus와 Electron은 유사한 목표를 가진 완전히 다른 두 프로젝
## 기여하기
- 웹사이트의 [기여 섹션](https://dioxuslabs.com/learn/0.5/contributing)을 확인하세요.
- 웹사이트의 [기여 섹션](https://dioxuslabs.com/learn/0.6/contributing)을 확인하세요.
- [이슈 트래커](https://github.com/dioxuslabs/dioxus/issues)에 이슈를 보고하세요.
- [Discord](https://discord.gg/XgGxMSkvUM)에 참여하여 질문하세요!

View file

@ -40,7 +40,7 @@
<span> | </span>
<a href="https://github.com/DioxusLabs/example-projects"> Exemplos </a>
<span> | </span>
<a href="https://dioxuslabs.com/learn/0.5"> Guia </a>
<a href="https://dioxuslabs.com/learn/0.6"> Guia </a>
<span> | </span>
<a href="https://github.com/DioxusLabs/dioxus/blob/main/translations/zh-cn/README.md"> 中文 </a>
<span> | </span>
@ -85,18 +85,18 @@ Se você conhece React, então você já conhece o Dioxus.
<table style="width:100%" align="center">
<tr>
<th><a href="https://dioxuslabs.com/learn/0.5">Tutorial</a></th>
<th><a href="https://dioxuslabs.com/learn/0.5/reference/web">Web</a></th>
<th><a href="https://dioxuslabs.com/learn/0.5/reference/desktop">Desktop</a></th>
<th><a href="https://dioxuslabs.com/learn/0.5/reference/ssr">SSR</a></th>
<th><a href="https://dioxuslabs.com/learn/0.5/reference/mobile">Móvel</a></th>
<th><a href="https://dioxuslabs.com/learn/0.6">Tutorial</a></th>
<th><a href="https://dioxuslabs.com/learn/0.6/reference/web">Web</a></th>
<th><a href="https://dioxuslabs.com/learn/0.6/reference/desktop">Desktop</a></th>
<th><a href="https://dioxuslabs.com/learn/0.6/reference/ssr">SSR</a></th>
<th><a href="https://dioxuslabs.com/learn/0.6/reference/mobile">Móvel</a></th>
<tr>
</table>
## Projetos de Exemplo:
| Navegador de Arquivos (Desktop) | WiFi Scanner (Desktop) | TodoMVC (Todas as Plataformas) | E-commerce com Tailwind (SSR/LiveView) |
| ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Navegador de Arquivos (Desktop) | WiFi Scanner (Desktop) | TodoMVC (Todas as Plataformas) | E-commerce com Tailwind (SSR/LiveView) |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [![Explorador de Arquivos](https://github.com/DioxusLabs/example-projects/blob/master/file-explorer/assets/image.png)](https://github.com/DioxusLabs/example-projects/blob/master/file-explorer) | [![Wifi Scanner Demo](https://github.com/DioxusLabs/example-projects/raw/master/wifi-scanner/demo_small.png)](https://github.com/DioxusLabs/example-projects/blob/master/wifi-scanner) | [![TodoMVC example](https://github.com/DioxusLabs/example-projects/raw/master/todomvc/example.png)](https://github.com/DioxusLabs/example-projects/blob/master/todomvc) | [![Exemplo de E-commerce](https://github.com/DioxusLabs/example-projects/raw/master/ecommerce-site/demo.png)](https://github.com/DioxusLabs/example-projects/blob/master/ecommerce-site) |
Veja a página [awesome-dioxus](https://github.com/DioxusLabs/awesome-dioxus) para uma lista curada do conteúdo dentro do ecossistema do Dioxus.
@ -161,7 +161,7 @@ Dioxus é único no ecossistema do Rust por suportar:
- SSR com `hydration` feito pelo Cliente
- Suporte à aplicação Desktop
Para mais informações sobre quais funções estão atualmente disponíveis e para o progresso futuro, veja [O Guia](https://dioxuslabs.com/learn/0.5).
Para mais informações sobre quais funções estão atualmente disponíveis e para o progresso futuro, veja [O Guia](https://dioxuslabs.com/learn/0.6).
## Projeto dentro do ecossistema Dioxus

View file

@ -45,7 +45,7 @@
<span> | </span>
<a href="https://github.com/DioxusLabs/example-projects"> Examples </a>
<span> | </span>
<a href="https://dioxuslabs.com/learn/0.5/guide"> Guide </a>
<a href="https://dioxuslabs.com/learn/0.6/guide"> Guide </a>
<span> | </span>
<a href="https://github.com/DioxusLabs/dioxus/blob/main/translations/zh-cn/README.md"> 中文 </a>
<span> | </span>
@ -81,7 +81,7 @@ fn app() -> Element {
- [Ergonomik durum yönetimi](https://dioxuslabs.com/blog/release-050) React, Solid ve Svelte'nin en iyi özelliklerini birleştirdik.
- Rust'ın en en hızlı wasm(WebAssembly)-framework'ü (yazılım geliştirmek için kullanılan kütüphanelerin bir araya gelmesi ile oluşan yapılar) ile yüksek performans [sledgehammer](https://dioxuslabs.com/blog/templates-diffing).
- Web, macOS, Linux ve Windows üzerinde deploy (yayınlamak) için entegre paketleyici (burada belirtilen `dx bundle` bizim için işleri hallediyor).
- Ve daha fazlası! Gözat -> [Dioxus turu](https://dioxuslabs.com/learn/0.5/).
- Ve daha fazlası! Gözat -> [Dioxus turu](https://dioxuslabs.com/learn/0.6/).
## Anında hot-reloading
@ -93,7 +93,7 @@ Tek bir `dx serve` komutu ile uygulamanı çalıştır. Markup ve styles(html ve
## Web ve Masaüstü için Paketleyici
Basitçe `dx bundle` komutunu çalıştır ve uygulaman maksimum optimizasyon ile derlenip paketlensin. Web üzerindeki [`.avif` oluşturma, `.wasm` sıkıştırma, küçültme](https://dioxuslabs.com/learn/0.5/reference/assets) ve daha fazlası ile avantajı yakala. [50kb'dan daha küçük](https://github.com/ealmloff/tiny-dioxus/) hafif web uygulamaları ve 15mb'dan daha az boyutlarda masaüstü/mobil uygulamalar üret.
Basitçe `dx bundle` komutunu çalıştır ve uygulaman maksimum optimizasyon ile derlenip paketlensin. Web üzerindeki [`.avif` oluşturma, `.wasm` sıkıştırma, küçültme](https://dioxuslabs.com/learn/0.6/reference/assets) ve daha fazlası ile avantajı yakala. [50kb'dan daha küçük](https://github.com/ealmloff/tiny-dioxus/) hafif web uygulamaları ve 15mb'dan daha az boyutlarda masaüstü/mobil uygulamalar üret.
<div align="center">
<img src="../../notes/bundle.gif">
@ -101,7 +101,7 @@ Basitçe `dx bundle` komutunu çalıştır ve uygulaman maksimum optimizasyon il
## Fantastik Dökümantasyon
Temiz, okunabilir ve kapsayıcı döküman için bir ton uğraştık. Bütün html elementleri ve listeners(takipçiler) MDN (geliştiriciler için dökümantasyon detay için [tıkla](https://developer.mozilla.org)) ile dökümente edildi, ve güncelliğinden emin olmak için docsite(dökümanlar) Dioxus'un kendisi ile sürekli entegrasyon halinde. Rehbeler, referanslar, tarifler, ve daha fazlası için göz at [Dioxus websitesi](https://dioxuslabs.com/learn/0.5/). İlginç gerçek: Dioxus'un sitesini yeni özelliklerimizi test etmek için deneme tahtası olarak kullanıyoruz -> [Göz at!](https://github.com/dioxusLabs/docsite)
Temiz, okunabilir ve kapsayıcı döküman için bir ton uğraştık. Bütün html elementleri ve listeners(takipçiler) MDN (geliştiriciler için dökümantasyon detay için [tıkla](https://developer.mozilla.org)) ile dökümente edildi, ve güncelliğinden emin olmak için docsite(dökümanlar) Dioxus'un kendisi ile sürekli entegrasyon halinde. Rehbeler, referanslar, tarifler, ve daha fazlası için göz at [Dioxus websitesi](https://dioxuslabs.com/learn/0.6/). İlginç gerçek: Dioxus'un sitesini yeni özelliklerimizi test etmek için deneme tahtası olarak kullanıyoruz -> [Göz at!](https://github.com/dioxusLabs/docsite)
<div align="center">
<img src="../../notes/docs.avif">
@ -109,7 +109,7 @@ Temiz, okunabilir ve kapsayıcı döküman için bir ton uğraştık. Bütün ht
## Geliştirici Deneyimini Önemse
Dioxus geliştirici deneyimini önceliklendirir, bu kapsamda end-to-end tooling (uçtan uca araç desteği) için tonla efor harcadık. [VSCode eklentisi](https://marketplace.visualstudio.com/items?itemName=DioxusLabs.dioxus) geliştirdik bu sayede RSX kodlarınızı otomatik formatlayabilir, HTML', RSX e çevirebilir ve daha fazlasını yapabilirsiniz. Aynı zamanda geliştirdiğimiz çok güçlü [CLI](https://dioxuslabs.com/learn/0.5/CLI) sayesinde yeni uygulamalar üretmenize yardım ediyor, onları serve (sunmanızı) ve çapraz platform çalışacak şekilde paketlemenizi sağlıyoruz. Yol haritamızda deployment da mevcut.
Dioxus geliştirici deneyimini önceliklendirir, bu kapsamda end-to-end tooling (uçtan uca araç desteği) için tonla efor harcadık. [VSCode eklentisi](https://marketplace.visualstudio.com/items?itemName=DioxusLabs.dioxus) geliştirdik bu sayede RSX kodlarınızı otomatik formatlayabilir, HTML', RSX e çevirebilir ve daha fazlasını yapabilirsiniz. Aynı zamanda geliştirdiğimiz çok güçlü [CLI](https://dioxuslabs.com/learn/0.6/CLI) sayesinde yeni uygulamalar üretmenize yardım ediyor, onları serve (sunmanızı) ve çapraz platform çalışacak şekilde paketlemenizi sağlıyoruz. Yol haritamızda deployment da mevcut.
<div align="center">
<img src="../../notes/autofmt.gif">
@ -391,7 +391,7 @@ Dioxus ve Electron benzer amaçlara sahip tamamıyla farklı iki projedir. Elect
## Katkı Sağlama
- [Katkı sağlamayla alakalı kısım](https://dioxuslabs.com/learn/0.5/contributing) için web sitemizi ziyaret edin.
- [Katkı sağlamayla alakalı kısım](https://dioxuslabs.com/learn/0.6/contributing) için web sitemizi ziyaret edin.
- [Issue tracker(sorun takipçisi)](https://github.com/dioxuslabs/dioxus/issues) üzerinden sorunlarınızı raporlayabilirsiniz.
- Discord'a [katıl](https://discord.gg/XgGxMSkvUM) ve sorularını sor!

View file

@ -45,7 +45,7 @@
<span> | </span>
<a href="https://github.com/DioxusLabs/example-projects"> 示例 </a>
<span> | </span>
<a href="https://dioxuslabs.com/learn/0.5/guide"> 指南 </a>
<a href="https://dioxuslabs.com/learn/0.6/guide"> 指南 </a>
<span> | </span>
<a href="https://github.com/DioxusLabs/dioxus/blob/main/README.md"> English </a>
<span> | </span>
@ -79,7 +79,7 @@ fn app() -> Element {
- [人体工程学的状态管理](https://dioxuslabs.com/blog/release-050),结合了 React、Solid 和 Svelte 的优点
- 非常高效,由 Rust 最快的 wasm 框架 [sledgehammer](https://dioxuslabs.com/blog/templates-diffing) 提供支持
- 集成的捆绑包,可部署到 Web、macOS、Linux 和 Windows
- 还有更多!阅读 [Dioxus 漫游之旅](https://dioxuslabs.com/learn/0.5/)。
- 还有更多!阅读 [Dioxus 漫游之旅](https://dioxuslabs.com/learn/0.6/)。
## 瞬时热重载
@ -91,7 +91,7 @@ fn app() -> Element {
## 用于 Web 和桌面部署的捆绑包
只需运行 `dx bundle`,您的应用程序将被构建和捆绑,并进行最大化的优化。在 Web 上,利用 [`.avif` 生成,`.wasm` 压缩,代码缩小](https://dioxuslabs.com/learn/0.5/reference/assets),等等。构建的 Web 应用程序大小 [不到 50kb](https://github.com/ealmloff/tiny-dioxus/),桌面/移动应用程序小于 15mb。
只需运行 `dx bundle`,您的应用程序将被构建和捆绑,并进行最大化的优化。在 Web 上,利用 [`.avif` 生成,`.wasm` 压缩,代码缩小](https://dioxuslabs.com/learn/0.6/reference/assets),等等。构建的 Web 应用程序大小 [不到 50kb](https://github.com/ealmloff/tiny-dioxus/),桌面/移动应用程序小于 15mb。
<div align="center">
<img src="../../notes/bundle.gif">
@ -99,7 +99,7 @@ fn app() -> Element {
## 出色的文档
我们花费了大量精力构建清晰、易读和全面的文档。所有 HTML 元素和监听器都使用 MDN 文档进行了记录,并且我们的文档站点通过 Dioxus 本身进行持续集成,以确保文档始终保持最新。查看 [Dioxus 网站](https://dioxuslabs.com/learn/0.5/) 获取指南、参考资料、示例和更多信息。有趣的事实:我们将 Dioxus 网站用作新特性的测试平台 - [来看看吧!](https://github.com/dioxusLabs/docsite)
我们花费了大量精力构建清晰、易读和全面的文档。所有 HTML 元素和监听器都使用 MDN 文档进行了记录,并且我们的文档站点通过 Dioxus 本身进行持续集成,以确保文档始终保持最新。查看 [Dioxus 网站](https://dioxuslabs.com/learn/0.6/) 获取指南、参考资料、示例和更多信息。有趣的事实:我们将 Dioxus 网站用作新特性的测试平台 - [来看看吧!](https://github.com/dioxusLabs/docsite)
<div align="center">
<img src="../../notes/docs.avif">
@ -107,7 +107,7 @@ fn app() -> Element {
## 开发者体验的重点
Dioxus 优先考虑开发者体验,我们为端到端工具链付出了大量努力。我们构建了一个 [VSCode 扩展](https://marketplace.visualstudio.com/items?itemName=DioxusLabs.dioxus),可以自动格式化您的 RSX 代码,将 HTML 转换为 RSX 等等。我们还建立了一个非常强大的 [CLI](https://dioxuslabs.com/learn/0.5/CLI),支持创建新应用程序、提供服务和跨平台捆绑,并且部署正在路上。
Dioxus 优先考虑开发者体验,我们为端到端工具链付出了大量努力。我们构建了一个 [VSCode 扩展](https://marketplace.visualstudio.com/items?itemName=DioxusLabs.dioxus),可以自动格式化您的 RSX 代码,将 HTML 转换为 RSX 等等。我们还建立了一个非常强大的 [CLI](https://dioxuslabs.com/learn/0.6/CLI),支持创建新应用程序、提供服务和跨平台捆绑,并且部署正在路上。
<div align="center">
<img src="./notes/autofmt.gif">
@ -342,7 +342,7 @@ Dioxus 和 Electron 是两个完全不同的项目目标相似。Electron 使
## 贡献
- 查看网站上有关[贡献的部分](https://dioxuslabs.com/learn/0.5/contributing)。
- 查看网站上有关[贡献的部分](https://dioxuslabs.com/learn/0.6/contributing)。
- 在我们的 [问题跟踪器](https://github.com/dioxuslabs/dioxus/issues) 上报告问题。
- [加入](https://discord.gg/XgGxMSkvUM) discord 并提出问题!