Add example

README.md

@@ -6,9 +6,9 @@
 A tiny URL router for [Nano Stores](https://github.com/nanostores/nanostores)
 state manager.
 
-* **Small.** 684 bytes (minified and brotlied). Zero dependencies.
-* Good **TypeScript** support.
-* Framework agnostic. Can be used with **React**, **Preact**, **Vue**,
+- **Small.** 684 bytes (minified and brotlied). Zero dependencies.
+- Good **TypeScript** support.
+- Framework agnostic. Can be used with **React**, **Preact**, **Vue**,
   **Svelte**, **Angular**, **Solid.js**, and vanilla JS.
 
 Since Nano Stores promote moving logic to store, the router is a store,
@@ -51,24 +51,21 @@ export const Layout = () => {
 
 ---
 
-<img src="https://cdn.evilmartians.com/badges/logo-no-label.svg" alt="" width="22" height="16" />  Made in <b><a href="https://evilmartians.com/devtools?utm_source=nanostores-router&utm_campaign=devtools-button&utm_medium=github">Evil Martians</a></b>, product consulting for <b>developer tools</b>.
+<img src="https://cdn.evilmartians.com/badges/logo-no-label.svg" alt="" width="22" height="16" /> Made in <b><a href="https://evilmartians.com/devtools?utm_source=nanostores-router&utm_campaign=devtools-button&utm_medium=github">Evil Martians</a></b>, product consulting for <b>developer tools</b>.
 
 ---
 
-
 ## Install
 
 ```sh
 npm install nanostores @nanostores/router
 ```
 
-
 ## Usage
 
 See [Nano Stores docs](https://github.com/nanostores/nanostores#guide)
 about using the store and subscribing to store’s changes in UI frameworks.
 
-
 ### Routes
 
 Routes is an object of route’s name to route pattern:
@@ -111,10 +108,9 @@ createRouter({
  */
 ```
 
-
 ### Search Query Routing
 
-Router value contains parsed url search params:
+Router value contains parsed URL search params (like `?sort=name`):
 
 ```js
 createRouter({ home: '/posts/:category' })
@@ -131,17 +127,19 @@ router.get() //=> {
 To use search query like `?a=1&b=2` in routes you need to set `search` option:
 
 ```js
-createRouter({
-  home: '/p/?page=home'
-}, {
-  search: true
-})
+createRouter(
+  {
+    home: '/p/?page=home'
+  },
+  {
+    search: true
+  }
+)
 ```
 
 Router will work with `?search` part as a string. Parameters order will
 be critical.
 
-
 ### Clicks Tracking
 
 By default, router and `?search` params store will add `click` event listener
@@ -171,7 +169,6 @@ export const Link = (props) => {
 }
 ```
 
-
 ### URL Generation
 
 Using `getPagePath()` avoids hard coding URL in templates. It is better
@@ -190,7 +187,7 @@ or `redirectPage`:
 ```ts
 import { openPage, redirectPage } from '@nanostores/router'
 
-function requireLogin () {
+function requireLogin() {
   openPage($router, 'login')
 }
 
@@ -207,7 +204,6 @@ getPagePath($router, 'list', { category: 'guides' }, { sort: 'name' })
 //=> '/posts/guides?sort=name'
 ```
 
-
 ### Server-Side Rendering
 
 Router can be used in Node environment without `window` and `location`.