Dev Standards
  • Untitled
  • project-standards
    • project-success
      • index
      • production.s
    • taking-over-project
      • index
      • migrate-to-new-ios-certificates.mo
    • technical-agility
      • react-native-test.s
      • code-vocabulary-identical-business-vocabulary.s
      • under-15-minutes-project-installation.s
      • index
      • up-to-date-dependencies.s
  • react-native
    • react
      • get-element-size-or-position-with-onLayout.mo
      • binding-functions-in-react-component.s
      • enable-overflow-android.mo
    • setup
      • setup-code-push.mo
      • setup-facebook-login.mo
      • setup-and-deploy-new-project-to-staging.mo
      • add-cocoapods.mo
      • deploy-script.mo
      • setup-and-deploy-new-project-to-staging-with-hockeyapp.mo
      • add-native-module.mo
      • setup_firebase_multiple_envs.mo
      • remove-unnecessary-android-permissions.mo
      • deploy-to-production-android.mo
      • deploy-project-to-production
      • overriding-existing-app.s
      • patch-react-native-android.mo
      • setup-stripe-dev-standard.mo
    • features
      • icomoon.mo
      • lock-device-orientation.mo
      • clean-logout.s
      • deep-linking
      • offline-redux.mo
      • asyncstorage.mo
      • offline-mobx.mo
    • debugging
      • analyse-bug.mo
      • debug-network-calls.mo
      • debug-javascript-ios-device.mo
      • get-ios-logs.mo
      • debug-javascript.mo
      • handle-gradle-dependencies-clash.mo
      • debug-native-ios.mo
      • debug-two-ios-apps-simultaneously.mo
      • debug-native-android.mo
      • debug-webviews.mo
    • firebase
      • debug-events.mo
    • architecture
      • project-architecture.s
      • default-stack.s
      • file-naming.s
    • update
      • upgrade-react-native.mo
    • tests
      • setup-detox-jest.mo
    • use_http_links_in_react_native.mo
    • react-navigation
      • unmount-compoenent-on-page-change.mo
    • package-dependencies
      • handle-dependencies-with-yarn-override.mo
    • animations
      • react-native-animations.s
  • successful-sprint
    • coding
      • plan-your-ticket-to-improve-efficency.s
  • code-quality
    • components-state-testing.mo
    • mock-with-jest.mo
    • pull-request-template.s
    • pull_request_template
    • test-files-indentation.s
  • security
    • import_certificates_match.mo
    • 2FA.mo
  • contributing
    • contributing.mo
    • mo.s
    • standard.s
  • backend
    • graphql-js
      • getting-started-with-apollo-server-dataloader-knex.mo
    • node-js
      • handle-errors-and-exceptions-in-javascript.s
      • add-multiple-environments-configuration-on-loopback.s
    • django
      • deploy-to-aws.mo
      • create-user-model.mo
      • getting-started.mo
      • create-model-and-api.mo
  • performance
    • backend
      • cache-routes-using-varnish.mo
      • serve-images-as-static-files.mo
      • minimize-number-sql-queries.mo
      • python-investigation-tools.mo
      • how-to-investigate-performance.mo
      • output-sql-alchemy-orm-query.mo
    • front
      • how-to-investigate-performance.mo
      • table-and-chart-with-good-performance.mo
      • react-native-performance.s
      • simulate-network-iphone.mo
    • performance-decision-flow.s
  • git
    • merge-or-rebase-a-branch
  • editors
    • vscode
      • setup-vscode.mo
  • ops
    • docker
      • deploy-with-https.mo
  • templates
    • mo
  • react
    • redux
      • custom-redux-form-field.mo
      • pass-props-to-container.mo
    • component.s
    • lifecycle
      • trigger-action-on-props-update.mo
  • flowtype
    • flowtype.s
  • LICENCE
  • README
  • scrum
    • timebox.s
  • SUMMARY
Powered by GitBook
On this page
  • Owner: Florian Rival
  • Why
  • I need a navigation solution to start my app
  • I need to display icons
  • I want to store the state of the app
  • I want to handle forms
  • I want to handle animations
  • I need to add testing to my app
  • I want static type checking
  • I want to ensure the quality of my codebase
  • I want to be able to push on-the-fly updates to my app
  • I need to have crash/bugs reporting
  • I need to add analytics/tracking to my app
  • I need to have automated deployment
  • I need a continuous integration service for launching tests
  1. react-native
  2. architecture

default-stack.s

Owner: Florian Rival

Why

Having a set of common tools/libraries allow us to quickly move from one project to another, be more efficient and get a deep knowledege of each tool, including the advantages and drawbacks of these tools.

I need a navigation solution to start my app

Library/tool

What

Why

react-navigation

Navigation library for React Native

react-native-navigation

Navigation implemented using native navigation components

If you need to use the native navigation components so that your navigation is 100% equivalent to a native app.

I need to display icons

Library/tool

What

Why

react-native-vector-icons

Customizable Icons for React Native

Most comprehensive library of icons

I want to store the state of the app

Library/tool

What

Why

redux

State container

Widely used in the React community, lots of dev tooling

redux-persist

Persistence of the data of the app

Simple to integrate with Redux and flexible

redux-saga

Handling of asynchronous processes in the app

Simple to integrate with Redux, testable, make complex business flow easy to read

I want to handle forms

Library/tool

What

Why

formik

Forms handling library

date-fns, moment

Date handling library

Widely used libraries.

I want to handle animations

Library/tool

What

Why

Lottie (react-native-lottie)

Animation library

Good looking, performant animations. Easy to integrate in React Native.

I need to add testing to my app

Library/tool

What

Why

jest

Testing framework

Already integrated with React Native by default, allow to do snapshot testing

redux-saga-test-plan

Testing utilities for redux-saga

Allow to test redux-saga

Detox

End to end testing

Alternatives (Calabash) are not reliable enough and slow

I want static type checking

Library/tool

What

Why

Flowtype

Static typing

Improve developer experience, help to avoid errors when dealing with complex objects

Typescript

Static typing

More stable and mature than Flowtype. Never used on a React Native project at BAM yet

I want to ensure the quality of my codebase

Library/tool

What

Why

Prettier

Automatic formattting of source code

Avoid all discussions/loss of time on styling Integration/plugin for editors

eslint with eslint-config-universe

Linter

I want to be able to push on-the-fly updates to my app

Library/tool

What

Why

AppCenter Code Push

Deploy mobile app updates without a full release

Speed up the deployment during development, allow for bug fixes and new features releases on the fly

I need to have crash/bugs reporting

Library/tool

What

Why

Sentry

Native crashes and JS exceptions reports

Easy integration and good React Native support with react-native-sentry

I need to add analytics/tracking to my app

Library/tool

What

Why

Firebase Analytics

Analytics for mobile applications

I need to have automated deployment

Library/tool

What

Why

fastlane

Automation of deployment tasks

Most widely used deployment tool for iOS/Android + existing actions for HockeyApp/App Center/App Store/Play Store

match

Automation of certificate/provisioning profile generation

Avoid dealing with certificates, one place storage for all certificates

I need a continuous integration service for launching tests

Library/tool

What

Why

Bitrise

Automation of applications builds

Ensure reproducible builds, avoid spending time building apps on developer computers

Travis CI

Automation of unit tests

Previousproject-architecture.sNextfile-naming.s

Last updated 7 years ago

Recommended solution on , very customizable and with performant good enough for +90% of apps

The recommended solution by Google for applications, with a good quality native module for React Native ()

React Native documentation
react-native-firebase