This README describes the steps needed to run the WellCheck mobile app

• Node.js
• NPM
• watchman
• Java JRE and JDK
• react-native-cli
• React Native Debugger
• Android Studio

The standard way to install this project is to clone the repository and setup the environment

• MacOS environment
• Linux environment
• Windows environment

1. Run the following commands in terminal:

cd well-check-mobile

# 1. Install NPM dependencies
$ npm install

# 2. Link react-native dependencies
$ react-native link
$ react-native link react-native-vector-icons
$ react-native link react-native-fs

# 3. Start Android Studio emulator (https://github.com/digitalequation/well-check-mobile)
example: $ /Users/janedoe/Library/Android/sdk/emulator/emulator -avd Nexus_5X_API_23

# 4. Start react native Metro server
$ react-native start --reset-cache

# 5. Compile the assets and install the app on the emulator
### Open another terminal tab and run:
$ react-native run-android
or
$ react-native run-ios

2. Start React Native Debugger

3. Access the 'Metro' server terminal tab and press: 'd'. A dialog will open in the emulator and select 'Debug'. This will connect the app to the React Native Debbuger

• Compiled code - android and ios

• Javascript - src

  • Add new React Native Screens/ Pages in src/screens
  • Add new React Native Common Components in components/common
  • Add new API endpoints in src/services
  • Modify axios interceptors in src/Http.js
  • Add new Utils/ reusable common functions in src/Utils.js
  • Add new navigation route in src/navigation using react-navigation
  • Modify react redux in src/redux-store

• Scaled Sheet Styles - src/assets/styles/

• Fonts - src/assets/fonts/

• Images - src/assets/images/

• Theme - native-base-theme

• react-navigation - react native screens navigation
• ree-validate - input validation library
• react-redux - react redux for cross-component/ global communication
• react-native-secure-storage - for storing and encrypting sensitive info
• react-native-voice - voice dictation (to be replaced with @react-native-community/voice)
• react-native-render-html - HTML rendering
• react-native-photo-upload - photo upload (from phone or taking picture); requires manual permissions request in 'android/app/gradle' and in 'ios'
• react-native-image-resizer - image resizing
• react-native-gesture-handler - gesture listener
• react-native-device-info
• react-native-safe-area-context - safe area view for IOS (to handle notches)
• react-native-webview - web page rendering
• react-native-netinfo - internet connection listener
• react-native-qrcode-scanner - camera app for QR code scanning
  • react-native-permissions - dependency of QR code scanning library
  • react-native-camera - dependency of QR code scanning library

• NativeBase - main UI library
• react-native-vector-icons - Library for icons (we use Ionicons)
• react-native-material-textfield - TextField library
• react-native-size-matters - styles with scaling
• react-native-step-indicator - for survey page
• react-native-chart-kit
• react-native-chip-view - chip components
• react-native-collapsible-header-views) - for on-scroll collapsing headers
• react-native-search-header - search input inside header
• react-native-snackbar - snackbar component
• react-native-snap-carousel - photo gallery
• react-native-star-rating - star rating (up to 5 stars)
• react-native-off-canvas-menu - menu drawer with animation
• react-native-floating-action - floating action button and floating action menu
• react-native-indicators - for loading bars
• react-native-modals - modals/ dialogs for mobile

• Q: Icons not rendering properly

• A: Run: react-native link react-native-vector-icons and restart the environment and the emulator

• Q: Fonts error on ios

• A: Open XCode and access: Build Phases/Copy Bundle Resources and remove all font (tff) files

• Q: App not running

• A: Run:

  watchman watch-del-all && rm -rf node_modules/ && npm cache verify && npm install
  react-native link
  react-native link react-native-vector-icons
  react-native link react-native-fs
  react-native start --reset-cache
  react-native run-android / react-native run-ios
  sudo pkill -9 node (when xcode build is stuck)
  

• Q: Multi Dex error on Android

• A: Add to android/app/build.gradle in the defaultConfig object: multiDexEnabled true

• Q: Cannot choose between the following variants of project :react-native-camera:

• A: Add to android/app/build.gradle in the defaultConfig object: missingDimensionStrategy 'react-native-camera', 'general'