wip: docs

docs/src/hello_world.md

@@ -4,6 +4,8 @@ Let's put together a simple "hello world" to get acquainted with Dioxus. The Dio
 
 This demo will build a simple desktop app. Check out the platform-specific setup guides on how to port your app to different targets.
 
+### A new project with Cargo
+
 First, let's start a new project. Rust has the concept of executables and libraries. Executables have a `main.rs` and libraries have `lib.rs`. A project may have both. Our `hello world` will be an executable - we expect our app to launch when we run it! Cargo provides this for us:
 
 ```shell
@@ -65,6 +67,8 @@ edition = "2018"
 
 ```
 
+### Adding Dioxus as a dependency
+
 To use the Dioxus library, we'll want to add the most recent version of `Dioxus` to our crate. If you have `cargo edit` installed, simply call:
 
 ```shell
@@ -75,24 +79,30 @@ It's very important to add `dioxus` with the `desktop` feature for this example.
 
 If you plan to develop extensions for the `Dioxus` ecosystem, please use the `dioxus` crate with the `core` feature to limit the amount of dependencies your project brings in.
 
+### Our first app
+
 Now, let's edit our `main.rs` file:
 
 ```rust
-use diouxs::prelude::*;
+use dioxus::prelude::*;
 
 
 fn main() {
     dioxus::desktop::start(App, |c| c);
 }
 
-static App: FC<()> = |(cx, props)| {
+fn App(cx: Component<()>) -> Element {
     cx.render(rsx! (
         div { "Hello, world!" }
     ))
-};
+}
 ```
 
-Let's dissect our example a bit.
+At this point, you could call `cargo run` and be greeted with a simple `Hello, World!` screen:
+
+![hello world](images/helloworld.png)
+
+### Dissecting our example
 
 This bit of code imports everything from the the `prelude` module. This brings into scope the right traits, types, and macros needed for working with Dioxus.
 
@@ -111,45 +121,29 @@ fn main() {
 Finally, our app. Every component in Dioxus is a function that takes in `Context` and `Props` and returns an `Option<VNode>`.
 
 ```rust
-static App: FC<()> = |(cx, props)| {
+fn App(cx: Component<()>) -> DomTree {
     cx.render(rsx! {
         div { "Hello, world!" }
-    })
-};
+    })    
+}
 ```
 
 The closure `FC<()>` syntax is identical to the function syntax, but with lifetimes managed for you. In cases where props need to borrow from their parent, you will need to specify lifetimes using the function syntax:
 
 ```rust
-fn App<'a>(cx: Context<'a>, props: &'a ()) -> DomTree<'a> {
+fn App<'a>(cx: Component<'a, ()>) -> DomTree<'a> {
     cx.render(rsx! {
         div { "Hello, world!" }
     })    
 }
 ```
 
+### The `Context` object
 
 In React, you'll save data between renders with hooks. However, hooks rely on global variables which make them difficult to integrate in multi-tenant systems like server-rendering. In Dioxus, you are given an explicit `Context` object to control how the component renders and stores data.
 
+### The `rsx!` macro
+
 Next, we're greeted with the `rsx!` macro. This lets us add a custom DSL for declaratively building the structure of our app. The semantics of this macro are similar to that of JSX and HTML, though with a familiar Rust-y interface. The `html!` macro is also available for writing components with a JSX/HTML syntax.
 
 The `rsx!` macro is lazy: it does not immediately produce elements or allocates, but rather builds a closure which can be rendered with `cx.render`.
-
-Now, let's launch our app:
-
-```shell
-$ cargo run
-```
-
-Huzzah! We have a simple app.
-
-![Hello world](images/01-setup-helloworld.png)
-
-If we wanted to golf a bit, we can shrink our hello-world even smaller:
-
-```rust
-fn main() {
-    static App: FC<()> = |(cx, props)| rsx!(cx, div {"hello world!"});
-    dioxus::web::start(App, |c| c);
-}
-```

examples/hello_world.rs

@@ -0,0 +1,11 @@
+use dioxus::prelude::*;
+
+fn main() {
+    dioxus::desktop::launch(App, |c| c);
+}
+
+fn App((cx, props): Component<()>) -> DomTree {
+    cx.render(rsx! (
+        div { "Hello, world!" }
+    ))
+}

packages/desktop/src/cfg.rs

@@ -22,9 +22,10 @@ impl<'a> DesktopConfig<'a> {
     /// Initializes a new `WindowBuilder` with default values.
     #[inline]
     pub fn new() -> Self {
+        let mut window = WindowBuilder::new().with_title("Dioxus app");
         Self {
             event_handler: None,
-            window: Default::default(),
+            window,
             pre_rendered: None,
             manual_edits: None,
         }
@@ -43,7 +44,7 @@ impl<'a> DesktopConfig<'a> {
     pub fn with_window(&mut self, f: impl FnOnce(WindowBuilder) -> WindowBuilder) -> &mut Self {
         // gots to do a swap because the window builder only takes itself as muy self
         // I wish more people knew about returning &mut Self
-        let mut builder = WindowBuilder::default();
+        let mut builder = WindowBuilder::default().with_title("Dioxus App");
         std::mem::swap(&mut self.window, &mut builder);
         builder = f(builder);
         std::mem::swap(&mut self.window, &mut builder);

packages/desktop/src/lib.rs

@@ -130,6 +130,7 @@ pub fn run<T: 'static + Send + Sync>(
 
                 let window = WindowBuilder::new()
                     .with_menu(menu_bar_menu)
+                    .with_title("Dioxus App")
                     .build(event_loop)
                     .unwrap();
                 let window_id = window.id();