Files
notesnook/apps/mobile

Notesnook for Android & iOS

The Notesnook mobile app is developed with React Native, helping us to keep a shared codebase for iOS and Android apps and provide great feature parity on both platforms.

Releases

Android and iOS apps can be downloaded from their respective appstores.

Download on Google Play Download on App Store Get it on F-Droid

Alternatively on android releases are also available on Github Releases.

Architecture overview

The app codebase is distributed over two primary directories. native/ and app/.

  • native/: Includes android/ and ios/ folders and everything related to react native core functionality like bundling, development and packaging. Any react-native dependency that has native code i.e android & ios folders, is installed here.

  • app/: Includes all the app code other than the native part. All JS only dependencies are installed here.

    • components/: Each component serves a specific purpose in the app UI, for example the Paragraph component is used to render paragraphs in the app and a Header component is used to render a header on all screens.
    • common/: Features that have integral role in app functionality, for example, notesnook core is initialized here.
    • hooks/: Hooks for different app logic
    • navigation/: Includes app navigation specific code. Here the app navigation, editor & side menu are rendered side by side in fluid tabs.
    • screens: Navigator screens.
    • services: Parts of code that do a specific function, for example, the sync service is responsibe for running Sync from anywhere in the app.
    • stores: We use zustand for global state management in the app. There are multiple stores that provide the state for different parts of the app.
    • utils: General purpose stuff such as constant values, utility functions etc.

There are several other folders at the root:

  • share/: Code for the iOS Share Extension and Android widget.
  • e2e/: Detox End to end tests
  • patches/: Patches for various react native dependencies.

Setting up development environment

To run the app locally, you will first have to configure react native on your machine. Follow the guide here and select React Native CLI Quickstart. Expo is not supported.

Once you have completed the configuration, follow the steps below to run the app locally.

Install yarn 2 in the project.

npm install -g yarn

and then run:

yarn set version berry

Open .yarnrc.yml and add the following line at the top:

nodeLinker: node-modules

Install the dependencies

yarn install

Running the app on Android

Setup an android emulator from Android studio if you haven't already and run the following command from native/ folder.

cd native

and

yarn run-android

If you want to run the app on your phone, make sure to enable USB debugging.

Running the app on iOS

To run the app on iOS, simply run the following command from native/ folder.

cd native

and

yarn run-ios