React Native에서 process.env 환경변수 사용은 몇 가지 중요한 제한사항과 주의점이 있습니다:

주요 문제점들

1. 브라우저와 다른 동작

• React Native는 Node.js 환경이 아니므로 process.env가 기본적으로 제공되지 않음
• 일부 bundler가 빌드 타임에 환경변수를 주입하지만, 런타임에 동적으로 변경할 수 없음

2. 보안 취약점

• 클라이언트 사이드 코드에 환경변수가 그대로 노출됨
• API 키나 비밀키 등 민감한 정보가 앱 번들에 포함되어 누구나 확인 가능

3. 플랫폼별 차이

• iOS와 Android에서 환경변수 처리 방식이 다를 수 있음
• Metro bundler의 설정에 따라 동작이 달라질 수 있음

권장 해결방안

1. react-native-config 사용

npm install react-native-config

2. Expo Config 활용 (Expo 환경)

import Constants from 'expo-constants';
const apiUrl = Constants.expoConfig?.extra?.apiUrl;

3. 안전한 환경변수 관리

• 민감한 정보는 서버에서 관리
• 앱에는 공개되어도 괜찮은 설정값만 포함
• 개발/운영 환경 분리를 위한 설정값 정도로만 활용

따라서 process.env를 직접 사용하기보다는 React Native에 특화된 환경변수 관리 도구를 사용하는 것이 안전하고 효율적입니다.

=============================================================================

react-native-config 설치 방법

1. 패키지 설치

yarn add react-native-config
# 또는
npm install react-native-config

2. 자동 링킹 (React Native 0.60+)

React Native 0.75는 자동 링킹을 지원하므로 별도의 링킹 작업이 필요하지 않습니다.

3. Android 설정

android/app/build.gradle 파일 상단에 추가:

// 2번째 줄에 추가
apply from: project(':react-native-config').projectDir.getPath() + "/dotenv.gradle"

만약 applicationIdSuffix나 applicationId가 AndroidManifest.xml의 패키지명과 다르다면:

android {
    defaultConfig {
        // ...
        resValue "string", "build_config_package", "YOUR_PACKAGE_NAME_IN_ANDROIDMANIFEST_XML"
    }
}

4. iOS 설정 (CocoaPods)

cd ios && pod install

5. 환경변수 파일 생성

프로젝트 루트에 .env 파일 생성:

API_URL=https://myapi.com
GOOGLE_MAPS_API_KEY=abcdefgh
APP_NAME=MyApp

6. 사용법

import Config from 'react-native-config';

console.log(Config.API_URL); // 'https://myapi.com'
console.log(Config.GOOGLE_MAPS_API_KEY); // 'abcdefgh'

7. TypeScript 지원 (선택사항)

react-native-config.d.ts 파일 생성:

declare module 'react-native-config' {
  export interface NativeConfig {
    API_URL?: string;
    GOOGLE_MAPS_API_KEY?: string;
    APP_NAME?: string;
  }
  export const Config: NativeConfig;
  export default Config;
}

8. ProGuard 설정 (Android Release)

android/app/proguard-rules.pro에 추가:

-keep class com.yourpackage.BuildConfig { *; }

주의사항

• .env 파일은 앱 번들에 포함되므로 민감한 정보는 저장하지 마세요
• 빌드 타임에 환경변수가 주입되므로 런타임에 변경할 수 없습니다
• 다른 환경별 설정을 위해서는 .env.staging, .env.production 등의 파일을 만들어 ENVFILE 환경변수로 지정할 수 있습니다