[Chore/#7] 환경별 웹 주소 주입 방식 정리 - #8
Conversation
.env.example 기본값이 특정 개발 PC의 LAN IP(192.168.0.2)였다. 클론한 사람이 그대로 복사하면 닿지 않는 주소가 기본값이 되는데, 값이 채워져 있어서 설정 문제로 보이지 않는다. localhost로 바꾸고 배포된 dev 주소를 선택지로 안내한다. EXPO_PUBLIC_*는 빌드 시점에 번들에 박히고 .env.local은 git에 없어서 EAS 클라우드 빌드에 주소를 넘길 방법이 없었다. eas.json을 추가해 프로필별로 주입한다. development는 로컬 metro가 .env.local을 읽으므로 주입하지 않고, preview는 dev 배포 주소를 쓴다. production은 운영 주소가 정해지지 않아 비워 뒀다. 값 없이 빌드하면 앱이 안내 화면을 띄우므로 잘못된 주소로 조용히 나가지 않는다.
|
Navigate logical layers of code changes, visualize relationships, and explore their blast radius. No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Advanced Run ID: 📒 Files selected for processing (4)
Included review availability: Your plan provides up to 10 included reviews per hour; 7 remain after this review. 📝 WalkthroughWalkthroughThe PR adds EAS build profiles and documents web URL configuration. Local development defaults to ChangesEAS URL configuration
Priority: ➖ Normal Estimated code review effort: 2 (Simple) | ~10 minutes Change: Other · Severity of issue fixed: Medium Merge Risk: ⚪ Minimal · up to The EAS configuration is valid, and no actionable merge risk remains in the reviewed URL configuration and documentation changes. 🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
Full details: Out of Scope Changes checkExplanation
✨ Finishing Touches🧪 Generate unit tests (beta)
Comment |
2 participants
#️⃣연관된 이슈
🎯 해결하려는 문제가 무엇인가요?
1.
.env.example에 특정 개발 PC의 LAN IP가 박혀 있었다.클론한 사람이
cp .env.example .env.local하면 자기 환경에서는 닿지 않는 주소가 기본값이 된다. 앱은 "페이지를 불러오지 못했습니다"를 띄우는데, 값이 채워져 있으니 설정 문제로 보이지 않아 네트워크나 웹 서버부터 의심하게 된다.2. 배포 빌드에 주소를 넘길 방법이 없었다.
EXPO_PUBLIC_*는 런타임이 아니라 빌드 시점에 번들에 문자열로 박힌다..env.local은 gitignore 대상이라 EAS 클라우드 빌드에는 존재하지 않는다. 저장소에eas.json이 없어서 빌드 프로필별로 주소를 나눌 수단 자체가 없었다.❓ 왜 해결해야 하나요?
웹 dev 환경이 이미 배포됐다 — https://dev.stream.billilge.site (stream-client-web#52의 Coolify 자동 배포). 이제 웹을 로컬에 띄우지 않고도 앱을 볼 수 있는데, 그러려면 그 주소를 어디에 어떻게 넣는지가 정해져 있어야 한다.
그리고 배포 빌드를 처음 돌리는 시점에
eas.json이 없으면, 급한 김에.env.local을 커밋하거나 주소를 소스에 박는 식으로 흘러가기 쉽다.⭐ 어떻게 해결했나요?
.env.example— 기본값을http://localhost:5173으로 바꿨다. 특정 PC에 묶이지 않고, iOS 시뮬레이터에서는 그대로 동작한다. 배포된 dev 주소를 선택지로 안내하는 줄을 추가했다.eas.json— 프로필별로EXPO_PUBLIC_WEB_URL을 주입한다.EXPO_PUBLIC_WEB_URLdevelopment.env.local을 읽는다previewhttps://dev.stream.billilge.siteproductionproduction을 비운 건 의도적이다. 값 없이 빌드하면 앱이WEB_URL이 빈 문자열인 걸 보고 "웹 주소가 설정되지 않았습니다" 안내 화면을 띄운다. dev 주소를 넣어두면 그게 그대로 운영으로 나갈 수 있어서, 눈에 띄게 실패하는 쪽을 택했다.문서 —
eas.json은 JSON이라 주석을 못 단다.production을 왜 비웠는지, 왜.env.local이 배포에 안 쓰이는지를 README에 적고docs/local-development.md에서 링크했다.🧩 이 PR의 한계 & 트레이드오프
eas build를 실제로 돌려보지 못했다. EAS 계정이 붙어 있지 않고,app.json에extra.eas.projectId가 없다. 그건eas init이 채우는 값이라 이 PR 범위 밖으로 뒀다. 즉 이eas.json은 스키마상 유효한 초안이고, 첫 빌드 때 조정이 필요할 수 있다production프로필이 미완성인 채로 들어간다. 운영 주소가 정해지면 한 줄 채우면 된다. 비워 두는 것과 프로필 자체를 빼는 것 중 전자를 택했다 — 프로필이 있어야 어디를 채워야 하는지 보인다cli.appVersionSource: "remote"는 EAS 권장 기본값을 따랐다. 로컬에서 버전을 관리하고 싶으면"local"로 바꿔야 한다.env.example기본값을 iOS 시뮬레이터 기준으로 잡았다. 안드로이드 에뮬레이터 사용자는 여전히10.0.2.2로 고쳐야 한다. 한쪽은 고쳐야 하는데, 주석에 표로 안내돼 있고localhost가 "고쳐야 할 수도 있는 값"으로 더 잘 읽힌다고 봤다⛓️ 기존 기능에 미치는 영향
앱 코드는 건드리지 않았다.
.env.example(템플릿)·eas.json(신규)·문서 2개뿐이다.이미
.env.local을 만들어 쓰는 사람에게는 영향이 없다..env.example은 복사 원본일 뿐이라 기존.env.local을 덮지 않는다.eas.json이 새로 생기지만eas build를 돌리기 전까지는 아무 동작도 하지 않는다.pnpm start/ios/android는 그대로다.🔀 Edge Case & 실패 시나리오
https://dev.stream.billilge.site가 200으로 응답하고 실제 STREAM 웹을 서빙하는 것을 브라우저로 확인했다(타이틀stream-client, 홈 화면과 Bottom Nav 렌더)eas.json유효성 — JSON 파싱과 프로필별 env 주입 여부를 확인했다.development=(주입 안 함) | preview=https://dev.stream.billilge.site | production=(주입 안 함)production을 비운 채 빌드 —WEB_URL이 빈 문자열이 되고WebViewScreen의 첫 분기가 안내 화면을 띄운다. 흰 화면이나 오류로 끝나지 않는다isSameOrigin이 정규식으로 origin만 뽑으므로https://dev.stream.billilge.site와.../둘 다 같게 본다. 외부 링크 분기가 깨지지 않는다grep -rn "192.168"결과 없음pnpm check통과📋 검토한 대안과 선택 이유
production에 dev 주소를 넣어두기 — 빌드는 바로 되지만 운영에 dev 웹이 나갈 수 있다. 조용한 사고보다 눈에 띄는 실패가 낫다eas.json에는 안 적기 — 웹 주소는 비밀이 아니고, 저장소만 봐도 어느 빌드가 어딜 가리키는지 보이는 편이 낫다. 비밀값이 생기면 그때는 시크릿을 써야 한다.env.example을 빈 값으로 두기 — 무조건 채우게 되지만 iOS 시뮬레이터 사용자도 한 번 더 찾아봐야 한다.localhost면 가장 흔한 경우가 바로 동작한다app.config.ts로 바꿔서 주소를 코드로 분기 — 지금app.json으로 충분하고, 빌드 프로필과 주소를 한곳에서 보는 게 단순하다💬 리뷰 포인트
[r]production프로필을 비워 두는 게 맞는지 — 운영 주소가 이미 정해져 있다면 알려주면 채우겠다[c].env.example기본값을localhost로 한 것 — 안드로이드 위주로 개발한다면 빈 값이 나을 수도 있다[c]cli.appVersionSource: "remote"— EAS가 버전을 관리하는 설정이다. 로컬 관리가 편하면 바꾸는 게 낫다[a]배포 관련 설명을 README에 뒀다. 길어지면docs/deployment.md로 빼는 게 나을 수 있다Summary by CodeRabbit
New Features
Documentation