isharadilshan / checklistpro

Sample Expense Tracking App built with React Native

Prerequisites

• Node.js > 12 and npm (Recommended: Use nvm)
• Xcode 12
• Cocoapods 1.10.1
• JDK > 11
• Android Studio and Android SDK

Base dependencies

• axios rest client.
• native-base as component library.
• react-navigation navigation library.
• redux for state management.
• redux-persist as persistance layer.
• redux-thunk to dispatch asynchronous actions.
• redux-thunk log redux actions in dev mode.
• @react-native-async-storage/async-storage as key value storage system.
• @react-native-community/netinfo as network info api
• react-native-exception-handler as global error handler
• react-native-vector-icons as icon library
• react-native-splash-screen to support native splash screen
• react-native-calendars as calendar library

Folder structure

This project follows a very simple folder structure:

• src: This folder is the main container of all the code inside your application.
  • components: Folder to store any common components.
    • atoms: contain all basic ui components.
    • organism: contain all combined ui elements.
    • wrappers: contain all common component wrappers.
  • redux: contain all redux specific code
    • actions: contain all actions, and expose the combined result using its index.ts
    • reducers: contain all reducers, and expose the combined result using its index.ts
    • store: state container which holds the application's state
  • routes: contain all the routes.
  • screens: contain all application screens.
    • Screen: screen specific folder.
      • index.tsx
  • services: contain all service calls.
  • utils: contain helper functions and constants.
  • App.tsx: Main component that starts whole app.
• index.js: Entry point of application as per React-Native standards.

Running this app

Before running the app, make sure you run:

git clone https://github.com/isharadilshan/checklistpro.git

cd checklist

npm install --legacy-peer-deps or yarn install

some packages might not updated its peer react dependency. so use legacy command when installing packages with npm

Running on iOS

Mac OS and Xcode are required.

cd ./checklistpro/ios && pod install

• Open checklistpro/ios/checklist.xcworkspace in Xcode
• Hit the Run button

Running on Android

You'll need to have all the prerequisites (SDK, NDK) for Building React Native installed.

cd ./checklistpro
npm run android

Open the checklist app in your emulator.