Flutter
모바일에서만 레이아웃이 깨질 때 확인 순서
운영 서버에서만 모바일 레이아웃이 깨진다면, 화면 크기뿐 아니라 로그와 응답도 함께 확인해야 한다.
서버에서만 모바일 레이아웃이 깨진다면, 화면 하나만 보지 말고 로그와 응답을 같이 봐야 한다.
핵심은 문제의 원인이 프론트엔드인지, 백엔드인지, 아니면 환경 차이인지 구분하는 것이다. 재현 가능한 단서부터 모아야 한다.
상황 요약하기
먼저 언제 어디서 깨지는지 정확히 정의한다. 모든 모바일 기기에서 깨지나, 특정 기기에서만 깨지나. 로컬에서는 괜찮은가.
이렇게 상황을 정리하면 원인 후보가 자연스럽게 줄어든다.
포트와 권한 확인
서버 상태를 먼저 확인한다.
sudo ss -lntp
df -h
sudo journalctl -n 80
포트는 열려있나, 디스크는 충분한가, 최근 로그에 에러는 없나.
로그 읽기
운영 환경 로그는 가장 정직한 증거다. 모바일에서 요청을 했을 때 서버가 뭘 응답했는지 로그에 남는다.
같은 조건에서 다시 접속하고, 로그에서 달라진 부분을 정확히 설명할 수 있나 확인한다.
가장 작은 실험
환경 차이가 의심된다면, 가장 작은 변화부터 시도한다. 한 번에 여러 설정을 바꾸면 뭐가 효과가 있었는지 알 수 없다.
- 먼저 볼 것: 로그와 응답
- 비교할 것: 정상일 때의 상태
- 기록할 것: 명령어, 로그 변화, 수정한 설정
권한 확인
모바일 요청이 제대로 처리되나 확인한다. 권한 문제로 인해 응답이 달라질 수 있다.
검증
- 실제로 같은 조건에서 레이아웃이 깨지나 다시 확인한다.
- 로그에서 뭐가 달라졌는지 정확히 설명한다.
- 모바일과 데스크톱을 번갈아 확인해본다.
레이아웃 문제는 대부분 환경 차이나 권한 문제다. 어떤 값이 달라졌는지 설명할 수 있으면 다음 확인이 훨씬 빨라진다.