Expo 구성 파일: app.json vs app.config.js

들어가며

Expo 프로젝트를 개발하면서 app.json과 app.config.js 두 가지 구성 파일을 마주치게 됩니다.
이 두 파일의 차이점과 각각의 사용 케이스를 알아보겠습니다.

app.json vs app.config.js

app.json

• 정적 구성: 변경되지 않는 고정된 설정값
• 단순성: JSON 형식으로 간단한 구성
• 투명성: 설정값이 바로 보임
• 제한적: 환경변수나 동적 값 사용 불가

{
  "expo": {
    "name": "oversleep",
    "android": {
      "package": "com.oversleep.pickup"
    }
  }
}

app.config.js

• 동적 구성: JavaScript 코드로 동적 값 생성 가능
• 유연성: 환경변수, 조건문, 함수 사용 가능
• 프로그래매틱: 코드로 설정 제어 가능
• 보안: 민감한 정보를 환경변수로 관리

import "dotenv/config";

module.exports = {
  expo: {
    name: "oversleep",
    extra: {
      GOOGLE_CLIENT_ID: process.env.GOOGLE_CLIENT_ID
    }
  }
};

언제 어떤 파일을 사용해야 할까?

app.json 사용 시나리오

1. 간단한 프로젝트
2. 환경변수가 필요 없는 경우
3. 기본적인 앱 설정만 필요할 때
4. 설정이 자주 변경되지 않을 때

app.config.js 사용 시나리오

1. 환경변수 사용이 필요한 경우
2. 소셜 로그인 등 API 키 관리가 필요할 때
3. 개발/프로덕션 환경별 다른 설정이 필요할 때
4. 동적으로 설정을 변경해야 할 때

주의사항

1. 우선순위

   • app.config.js가 있다면 app.json보다 우선
   • 두 파일이 있는 경우 app.config.js 설정이 적용

2. 환경변수

   • 반드시 app.config.js에서 관리
   • .env 파일과 함께 사용

3. 보안

   • API 키나 비밀값은 환경변수로 관리
   • app.json에 직접 입력하지 않기

4. 유지보수

   • 한 프로젝트에서는 가능한 한 파일만 사용
   • 환경변수 사용 시 app.config.js 권장

결론

환경변수나 동적 설정이 필요한 현대적인 앱 개발에서는 app.config.js를 사용하는 것이 더 적절합니다.
특히 소셜 로그인처럼 API 키를 관리해야 하는 경우에는 app.config.js가 필수적입니다.
app.config.js 사용시 app.json은 삭제해도 됩니다.
단, 설정이 복잡해질 수 있으므로 중복을 피하고 깔끔하게 구조화하는 것이 중요합니다.