An open API service indexing awesome lists of open source software.

https://github.com/tpucci/react-nonav

Experimental React Native declarative navigation
https://github.com/tpucci/react-nonav

declarative navigation react-native reactive rxjs

Last synced: 5 months ago
JSON representation

Experimental React Native declarative navigation

Awesome Lists containing this project

README

          

React Nonav

React Native declarative and reactive navigation.


Build Status
Coverage Status
NPM Downloads
Commitizen friendly
semantic-release


## Philosophy

This repo focuses on grouping screens by business conversion tunnels called **canals**. Why did I call it `react-nonav`? Just because I though of this package when I was visiting Venice... and I kind of hope that using this package will feel like navigating in Venice 📸

**When you use React Nonav**, you define several screens and you have the possibility to control their visibility with YOUR state machine. You define the rules of WHEN some screens should appear; `react-nonav` takes care of the rest.

## 👍 TLDR; Use this package if:

- you want to group screens by **business** conversion tunnels rather than transition.
- you want to control your navigation state with YOUR **state machine**.
- you want your navigation to **react** to YOUR store changes.

## 👎 Do not use this repo if:

- you want to navigate imperatively.
- you need to use Native navigation (react-nonav's navigation is powered by JS code only).

## Docs [![Netlify Status](https://api.netlify.com/api/v1/badges/a0a567d1-8c40-4c59-831c-0b137a3b176c/deploy-status)](https://app.netlify.com/sites/react-nonav/deploys)

The docs are here: https://react-nonav.netlify.com/
Powered by the incredible [docz](https://www.docz.site/).

## Contribute

- Clone this repository.
- Run `yarn` in the root directory.
- Run `yarn` in the `example` directory.
- Add your code and its test in the `/src` directory.
- Add your example code and its test in the `/example` directory.
- Open a pull request !

## Run the example project

- Clone this repository.
- Run `yarn` in the root directory.
- Run `yarn` in the `example` directory.
- In the `example` directory, run either `react-native run-ios` or `react-native run-android`.

## Compare

- [React Navigation](https://reactnavigation.org/)
- [React Native Navigation](https://github.com/wix/react-native-navigation)