React 로 iOS / AOS 앱 디버깅 하기 0

React로 웹/앱이 모두 동시에 되는 하이브리드 웹/앱을 구현하고 있습니다.

React Native로는 앱을 모바일 디바이스로 디버깅 해보았지만,

React로 만든 앱을 모바일 디바이스로 디버깅 해본 경험이 없었습니다.

아직 React Native로 덮어 쓰지 않은 React로 앱에서 디버깅 할 수 있는 방법은 무엇이 있을까요?

 

연결은 어떻게 하나요?

정답은 생각보다 간단합니다.

우리가 React를 실행할 때 사용하는 명령어

// yarn
yarn start

// npm
npm start

 

 

위의 명령어로 React를 실행하면 Localhost 3000번 포트에서 사용해볼 수 있습니다.

우리는 이 LocalHost로 접속하면 됩니다.

너무나도 당연히 pc에서 처럼 모바일 디바이스에 localhost:3000 접근할 수는 없습니다.

 

하지만 같은 인터넷을 쓰고 있다면

내가 React를 실행 한 컴퓨터의 ip로 접속이 가능해집니다.

 

나의 ip 보는법

환경설정 > wi-fi > 세부사항

 

이렇게 해서 IP 주소를 알았다면

 

모바일 디바이스로 http://[ip주소]:3000 으로 접속하면 

React 프로젝트를 실행한 곳으로 접근이 가능해집니다.

 

마무리

여기까지는 간단히 연결만 해보았지만, 우리에게 필요한건 디버깅이죠!

다음 시간에는 디버깅을 설정하는 방법을 알아봅시다.