React Native Secure Boilerplate 2024: Ignite with freeRASP

Boilerplate addressing vulnerabilities that standard setups often overlook.

https://github.com/talsec/react-native-boilerplate

Think Security: Our Take on a Leading React Native Boilerplate

In today’s digital landscape, mobile apps are not just about functionality—they’re also attractive targets for fraud and data theft. Security has become a fundamental part of app development, especially for apps handling sensitive user information. This article introduces a powerful option for app developers concerned with security: combining Ignite by Infinite Red, a leading React Native boilerplate, with freeRASP from Talsec—a free RASP solution—alongside other solutions to build secure and scalable apps.

React Native Secure Boilerplate: https://github.com/talsec/react-native-boilerplate

Ignite by Infinite Red

Ignite by Infinite Red is a robust React Native boilerplate featuring a CLI, component generators, and more. With over 12.2K GitHub stars, Ignite supports both Expo and bare React Native projects. It’s TypeScript-ready, utilizes MobX for state management, React Navigation for routing, Apisauce for REST APIs, and Jest for testing.

React Native's core features, such as Flipper, Reactotron, and Expo support, are enhanced by Ignite, which streamlines their use by providing pre-configured setups and simplifying integration. It also eases state management with MobX and ensures smooth state restoration by incorporating AsyncStorage with MST.

Ignite’s CLI can be accessed using npx for an always-updated version. You can create a new project with: For vanilla React Native: npx ignite-cli new newApp For Expo-powered projects: npx ignite-cli newApp –expo

Why Another Boilerplate?

Unlike other boilerplates that focus mainly on speed or provide a basic setup, this one is built for developers creating apps in high-risk industries like finance, healthcare, and e-commerce, where security is critical. The Ignite + freeRASP solution provides real-time protection against threats such as code tampering and unauthorized access, addressing vulnerabilities that standard setups often overlook. It’s designed to safeguard sensitive data and offer enhanced security for fraud-prone apps.

Disclaimer: Other solutions, such as paid options or even DIY approaches, may be suitable depending on your needs.

freeRASP: Adding Security to the Boilerplate

freeRASP is a lightweight Runtime Application Self-Protection (RASP) solution that provides real-time protection against a variety of threats. It’s built for easy integration and allows your app to react to detected risks automatically, like jailbreaking, tampering, or reverse engineering. Whether your app handles sensitive data or operates in an environment prone to fraud, freeRASP offers security features for post-launch protection and doesn't require external infrastructure, making it an accessible choice among several RASP options.

Key Advantages of freeRASP

• Real-time Threat Reaction: Through a comprehensive API, freeRASP can immediately respond to detected attacks and security threats, providing dynamic protection for your app.

• Ease of Integration: The solution features a simple download and installation process, complemented by clear source code snippets, ensuring a smooth integration experience.

• Minimal Performance Impact: freeRASP is designed to be lightweight, which means it provides robust security without compromising the app’s performance or user experience.

• Weekly Security Reports: freeRASP sends out regular email reports that detail the security status of your devices and the integrity of your app, helping you stay informed about potential vulnerabilities.

• Compliance with OWASP MASVS V8: It meets the OWASP MASVS V8 standards for resiliency against reverse engineering, ensuring your app is protected against common reverse engineering threats.

How RASP Works

RASP is designed to detect and respond to threats in real-time. Here's a breakdown of how RASP solutions like freeRASP typically work:

• Runtime Monitoring: Constantly checks for anomalies such as debugging attempts, code injections, or use of hooking frameworks like Frida or Xposed.

• Periodic Scans: In addition to real time monitoring, freeRasp schedules periodic scans that run deeper into the app to check for irregularities and tampering.

• Real-Time Responses: This enables Rasp to immediately take action against security breaches. Using predefined callbacks the app can be programmed to perform specific actions, such as alerting the user, restricting access to sensitive functionality, or even shutting down the app entirely.

• Reporting and Alerts: freeRASP also compiles detailed weekly reports that summarize the security status of the app. These reports provide insights into any detected vulnerabilities, unauthorized access attempts, or security breaches. Developers can use this data to track trends in threats and take proactive steps to address vulnerabilities before they become serious problems.

freeRASP Features

• Rooted or Jailbroken Devices: Protects against unauthorized access from tools like su, Magisk, unc0ver, check1rain, and Dopamine.

• Reverse Engineering: Prevents attempts to analyze or manipulate your app’s code.

• Hooking Frameworks: Detects and blocks frameworks like Frida, Xposed, and Shadow.

• Tampering and Repackaging: Identifies and responds to unauthorized modifications or repackaging.

• Untrusted Installations: Prevents installations from unofficial sources or app stores.

• System VPN control: VPNs can obscure the user’s actual IP address and route data through servers potentially under external control, which might interfere with geographical restrictions and bypass network security settings.

• Developer Mode control: Allows deeper system access and debugging capabilities that can bypass app security measures.

For more detailed information on these checks and their significance, visit the freeRASP docs.

freeRASP + Ignite: Combining Speed with Security

Integrating freeRASP with Ignite is straightforward and ensures your app is fortified against real-world security threats. Ignite accelerates development, while freeRASP delivers critical security features that safeguard your app. Integrating freeRASP with Ignite involves a few straightforward steps. For detailed instructions, check out our GitHub repository and Medium article.

1. Install the freeRASP Package: Add the package to your project using yarn with yarn add freerasp-react-native. For iOS, run Pod install.

2. Configure freeRASP: Set up the necessary fields (e.g., package name, certificate hashes) in your configuration file.

3. Set Up Threat Reactions: Define how your app should respond to detected threats by creating an object mapping threat types to response functions.

4. Initialize freeRASP: Use the provided custom hook to start threat detection with your configurations and reactions.

If you are interested in knowing additional details you can refer to the freeRASP documentation.

Build Your "Hello World" Project

With a brief outlook on how to configure freeRASP you might want to get a project up and running. Let’s look at how you might write code for a small “Hello World” project.

1. Begin with creating a react native project using Ignite. Use the following commands to start your app:

Init Ignite project via CLI:
$ npm install -g ignite-cli
$ ignite new HelloWorldApp

1. Install and configure freeRASP: First, create a configuration file named ‘freerasp.config.js’, where you will define your app's security and threat response settings. After that, use the useFreeRasp custom hook to initialize freeRASP. Here’s an example:

import { useFreeRasp } from 'freerasp-react-native'

1. Combine all the elements:

import React, { useEffect } from 'react';  
import { Text, View, Alert } from 'react-native';  
import { useFreeRasp } from 'freerasp-react-native';  
import freeRaspConfig from './freerasp.config';  

const App = () => {  
  useFreeRasp(freeRaspConfig, threatResponses); 

  return (  
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>  
      <Text>Hello, World! Welcome to Ignite + freeRASP!</Text>  
    </View>  
  );  
};  

export default App;  

const threatResponses = {  
  privilegedAccess: () => Alert.alert('Threat detected', 'Privileged access detected!'),
  debug: () => Alert.alert('Threat detected', 'Debugger detected!'),
  simulator: () => Alert.alert('Threat detected', 'Simulator detected!'),
  appIntegrity: () => Alert.alert('Threat detected', 'App integrity issue detected!')  
};  

There you have it, you've now successfully built your first Ignite + freeRASP project with just a few simple steps. More importantly, with just a few lines of code, you've fortified your app against major security threats. This is a significant achievement because it allows you to implement strong security measures without needing to dive into the complexities of cybersecurity. With freeRASP, you can integrate a strong protection layer into your app, providing a safer experience for users. For those looking for even more extensive coverage, paid RASP solutions are also available.

Best Practices

You might have secured your app with RASP but now it’s your turn to play a part. As a developer it is essential to follow best practices when building web or mobile applications to ensure your app is completely secure, here are a few tips:

1. Secure Data Transmission

Always use HTTPS for secure communication between your app and server. Implement SSL pinning to prevent man-in-the-middle attacks.

2. Code Obfuscation

Ensure you always build for production so that Metro Bundler automatically minifies your JavaScript code, making it harder for attackers to reverse-engineer. Additionally, for Android, enable code obfuscation at the native level by setting the ‘minifyEnabled’ and ‘shrinkResources’ flags in your build.gradle file. This process further protects your code from being easily understood or modified.

3. Authentication

Ensure that strong authentication mechanisms, such as OAuth or JWT (JSON Web Tokens), are used to verify user identities.

4. Secure Storage

Never store sensitive data directly on the device. Use encrypted storage and secure system features like Keychain (iOS) and Keystore (Android).

5. Third-Party Libraries

Always vet third-party libraries for security risks. Make sure they are actively maintained and regularly updated.

Summary

In 2024, mobile app security is not optional—it’s essential. By combining Ignite for rapid development with freeRASP for runtime security, you can build a secure and scalable React Native mobile app with minimal effort. Developers can take advantage of freeRASP’s real-time threat detection and regular security reports to keep their apps safe without worrying about complex security implementations.

With a focus on fraud-prone industries and apps handling sensitive user data, this boilerplate provides everything you need to get started quickly while ensuring your app is protected against real-world threats.

Why wait? Explore freeRASP and other RASP options to secure your app today!