Repository files navigation

React Native BlueStack Demo is a project to showcase all the functionalities that BlueStack React Native SDK provides for both iOS and Android platform.

• Use React Native 0.70 or higher
• Android
  • Target Android API level 19 or higher
• iOS
  • iOS 12.2 or higher

To work with this project, you'll need to set up your development environment with the necessary tools and dependencies. Here’s a comprehensive list of the prerequisites:

• Node.js: JavaScript runtime built on Chrome's V8 JavaScript engine.
• npm: Node package manager, which comes with Node.js.
• Yarn (optional): Alternative package manager.

You can download and install Node.js fromnodejs.org.

To verify the installation:

node -vnpm -v

To install Yarn (optional):

npm install -g yarn

Watchman is a tool by Facebook for watching changes in the filesystem. It's highly recommended on macOS to improve performance.

brew install watchman

React Native CLI is the command-line interface for React Native. Install it globally using npm or Yarn:

npm install -g react-native-cli

or

yarn global add react-native-cli

For Android development, you'll need the Java Development Kit (JDK). Install the latest version of the JDK fromOracle orAdoptOpenJDK.

To verify the installation:

javac -version

Android Studio provides the Android SDK and other necessary tools for Android development.

1. Download and installAndroid Studio.

2. During installation, ensure you install the following components:

   • Android SDK
   • Android SDK Platform
   • Android Virtual Device (AVD)

3. Configure the environment variables:

export ANDROID_HOME=$HOME/Library/Android/sdkexport PATH=$PATH:$ANDROID_HOME/emulatorexport PATH=$PATH:$ANDROID_HOME/toolsexport PATH=$PATH:$ANDROID_HOME/tools/binexport PATH=$PATH:$ANDROID_HOME/platform-tools

For iOS development, you need Xcode.

1. Download and installXcode from the Mac App Store.
2. Install Xcode Command Line Tools:

xcode-select --install

3. Open Xcode and install any additional required components.

CocoaPods is a dependency manager for Swift and Objective-C Cocoa projects. It's used in React Native for handling native iOS dependencies.

Install CocoaPods using Ruby gem:

sudo gem install cocoapods

Once you have all the prerequisites installed, you can set up the Bluestack module in the demo project:

npm install @azerion/bluestack-sdk-react-native

To get started locally the following steps are required:

git clone https://gitlab.azerdev.com/bluestack/sdk/react-native/bluestack-sdk-react-native.gitcd bluestack-sdk-react-native

npm install

If you get any error likenpm ERR! Invalid tag name "+" of package "react@+", Try following cmd:

npm install --legacy-peer-deps

You can manually add the path in the package.json

"dependencies": {...."@azerion/bluestack-sdk-react-native":"/path/to/bluestack-sdk-react-native"....  },

Or run following command

npm add /path/to/bluestack-sdk-react-native

cd /path/to/bluestack-demo-react-nativenpm install @azerion/bluestack-sdk-react-native

For React Native 0.60 and above, the linking is done automatically. For older versions, you might need to link the native dependencies manually:

cd /path/to/bluestack-sdk-react-nativenpm linkcd /path/to/bluestack-demo-react-nativenpm link @azerion/bluestack-sdk-react-native

// Absolute path to your packageconstpackagePath="/path/to/bluestack-sdk-react-native";module.exports={resolver:{nodeModulesPaths:[packagePath],// rest of metro resolver options...},watchFolders:[packagePath],// rest of metro options...};

warning: Watchman`watch-project` returned a warning

If you get above warning while working with local setup, To clear the warning, run:

watchman watch-del /path/to/bluestack-demo-react-nativewatchman watch-project /path/to/bluestack-demo-react-native

1. Start the Android emulator or connect an Android device via USB.
2. Ensure the Android device is in developer mode and USB debugging is enabled.
3. Start the React Native packager:

npm start

4. In another terminal, build and run the Android app:

npm run android

1. Start the React Native packager:

npm start

2. Navigate to theios directory:

cd ios

3. Install pod dependencies:

pod install

4. Open the iOS project in Xcode:

open ios/BlueStackReactNativeDemo.xcworkspace

5. Select a simulator or a connected device and press the Run button, or run the following command:

npm run ios