Rework Guide (#486)

* Move getting started to Guide

* Clean up summary and getting started

* Shorten intro by moving stuff to individual platform docs

* Make intro even shorter, summarize features

* Further cleanup; move development-related docs to separate section

* Make `guide` a crate. Turn code samples into examples so that we can check if they compile

* Rewrite "Describing the UI":

* Focus on RSX syntax (interactivity covered in later chapters); make sure samples are tested; concise language

* Move some "special attribute" samples to the `examples` directory

* Simplify introduction to components

* Simplify introduction to component props

* Document Prop features; add code samples

* Simplify component children docs

* Interactivity: better introduction to events

* Hooks: better introduction

* Remove outdated doc

* Introducs use_ref

* Simplify User Input chapter

* Document event handler props

* Meme editor example

* Meme editor walkthrough

* Add dark mode example

* Guide for context; dark mode example

* Guide: custom hooks

* Guide: conditional rendering

* Guide: rendering lists

* Guide: rendering lists + keys

* Move remaining infor from Reference to guide

* Delete reference book

docs/guide/examples/conditional_rendering.rs

@@ -0,0 +1,60 @@
+#![allow(non_snake_case)]
+use dioxus::prelude::*;
+
+fn main() {
+    dioxus::desktop::launch(App);
+}
+
+pub fn App(cx: Scope) -> Element {
+    let is_logged_in = use_state(&cx, || false);
+
+    cx.render(rsx!(LogIn {
+        is_logged_in: **is_logged_in,
+        on_log_in: |_| is_logged_in.set(true),
+        on_log_out: |_| is_logged_in.set(false),
+    }))
+}
+
+#[inline_props]
+fn LogIn<'a>(
+    cx: Scope<'a>,
+    is_logged_in: bool,
+    on_log_in: EventHandler<'a>,
+    on_log_out: EventHandler<'a>,
+) -> Element<'a> {
+    // ANCHOR: if_else
+    if *is_logged_in {
+        cx.render(rsx! {
+            div {
+                "Welcome!",
+                button {
+                    onclick: move |_| on_log_out.call(()),
+                    "Log Out",
+                }
+            }
+        })
+    } else {
+        cx.render(rsx! {
+            button {
+                onclick: move |_| on_log_in.call(()),
+                "Log In",
+            }
+        })
+    }
+    // ANCHOR_END: if_else
+}
+
+#[inline_props]
+fn LogInWarning(cx: Scope, is_logged_in: bool) -> Element {
+    // ANCHOR: conditional_none
+    if *is_logged_in {
+        return None;
+    }
+
+    cx.render(rsx! {
+        a {
+            "You must be logged in to comment"
+        }
+    })
+    // ANCHOR_END: conditional_none
+}