Skip to content

GGCTeam/rabbit-app

Repository files navigation

Links


from expo-rnn-starter


Table of contents

Motivation

  1. I love React Native 💚
  2. I love Expo 💙
  3. I love React Native Navigation ❤️

So why not put them all together? 😏

Big love and gratitude to all people who are working on React Native, Expo and React Native Navigation!

Getting Started

  1. Clone the repo
git clone https://github.com/kanzitelli/expo-rnn-starter.git new-project
  1. Install packages
cd new-project && yarn && yarn ios:pods
  1. Run it!
yarn ios
yarn android

👁‍🗨 If you are planning to use Expo modules, such as preconfigured expo-updates and others, or add new ones, what I strongly recommend, then proceed to Expo Configuration and follow the steps carefully.

If you would like to rename the app, you can use react-native-rename. Don't forget to run yarn ios:pods after the process is finished. Also keep in mind that bundle identifier must be valid for both platforms or change it manually.

What's inside

  • Expo SDK - universal set of amazing libraries (such as expo-updates) which are needed for building sustainable apps
  • React Native Navigation - truly native navigation experience for iOS and Android
  • Reanimated 2 - React Native's Animated library reimplemented
  • MobX - simple, scalable state management, with mobx-persist for persisting your stores

Extra helpful libraries

Small useful libraries/hooks from me

  • useStyles() - a hook that takes care of dark mode in your app. Supports toggling modes while you are in app. No dependencies (needs only react-native, so could be reusable). It is not a theme provider but could be used as one. It only has two themes light or dark

Enhancements

There are still some things I would like to add to the starter:

Feel free to open an issue for suggestions.

Known issues (warnings)

  • Expo splash screen. There is some weird behavior using expo-splash-screen with react-native-navigation. That is why this module has been excluded: ios & android.
  • Dark Mode in Android. React Native Navigation doesn't toggle navigation and tab bars' background color to dark when dark mode is toggled on. However it does so on iOS. As a workaround, we can subscribe to toggle events and then using Navigation.mergeOptions & Navigation.setDefaultOptions to change stylings for navigations and tab bars. Anyways, it needs some time to dive into it and come up with better solution.

Feel free to open an issue for any other warning or problems.

License

This project is MIT licensed