From 0ada6e46f683b79d627c6bb32d9cbd0008f7cabf Mon Sep 17 00:00:00 2001
From: Batr Kanzitelli <kanzitdinov@gmail.com>
Date: Thu, 28 Oct 2021 22:15:27 +0200
Subject: [PATCH] Update README.md

---
 README.md | 93 +++++++++++++++++++++++++++++++++++++++++++------------
 1 file changed, 73 insertions(+), 20 deletions(-)

diff --git a/README.md b/README.md
index 7572bbf..c83f55b 100644
--- a/README.md
+++ b/README.md
@@ -2,34 +2,87 @@
   <img src="https://xxx-files.ggc.team/oss/rnn-screens/rnn-screens-logo.png" width="80%" title="Logo">
 </p>
 
-### Install it
+Purpose of [RNN Screens](https://github.com/kanzitelli/rnn-screens) is to simplify and accelerate the process of React Native App development with [React Native Navigation](https://github.com/wix/react-native-navigation). It is not a replacement for RNN but a good addition!
+
+### Quick start
+
+Make sure you have [react-native-navigation](https://github.com/wix/react-native-navigation) installed in your project.
 
 ```
-yarn add @kanzitelli/if-component
+yarn add rnn-screens
+```
+
+### Usage
+
+#### 1. Describe app's screens
+
+```tsx
+import {generateRNNScreens, Root, Stack, Component, BottomTabs} from 'rnn-screens';
+
+export const screens = generateRNNScreens<'Main' | 'Settings'>({
+  Main: {
+    component: Main,
+    options: {
+      topBar: {
+        title: {
+          text: 'Home',
+        },
+      },
+    },
+  },
+  Settings: {
+    component: Settings,
+    options: {
+      topBar: {
+        title: {
+          text: 'Settings',
+        },
+      },
+    },
+  },
+});
 ```
 
-### Use it
+#### 2. Set app's navigation root
 
 ```tsx
-import {If} from '@kanzitelli/if-component';
-
-class OrdersScreen = () => {
-  return (
-    <>
-      <If _={loading}
-      _then={<LoadingIndicator />}
-      _else={<SomethingElse />} />
-    </>
-  )
-}
+// One screen app
+screens.N.setRoot(Root(Stack(Component(screens.get('Main')))));
+
+// Tab based app
+screens.N.setRoot(
+  Root(
+    BottomTabs([
+      Stack(Component(screens.get('Main'))),
+      Stack(Component(screens.get('Settings'))),
+    ]),
+  ),
+);
 ```
 
-### TS lib starter
+#### 3. Navigate with predictability
+
+```tsx
+// push screen
+screens.push(componentId, 'Example');
+
+// show modal
+screens.show('Example');
 
-```bash
-> git clone https://github.com/kanzitelli/if-component rn-lib
-> cd rn-lib && rm -rf .git
-> yarn
+// push screen with passProps
+screens.push<ExampleScreenProps>(
+  componentId,
+  'Example',
+  { value: randomNum() },
+)
 ```
 
-Don't forget to change your lib's name in `package.json` and check other scripts.
+An integration example could be found at [kanzitelli/rnn-starter](https://github.com/kanzitelli/rnn-starter).
+
+### Credits
+
+Thanks to the team @ Wix behind [React Native Navigation](https://github.com/wix/react-native-navigation)!
+
+### License
+
+This project is [MIT licensed](https://github.com/kanzitelli/rnn-screens/blob/master/LICENSE.md)
\ No newline at end of file