웹페이지를 만들 경우, 태블렛 노트북, 휴대폰 등 다양한 화면에서 내 페이지가 어떻게 보이는지 확인하고 싶을 때가 많다.
크롬 개발자도구에서 각 화면 크기별로 페이지 확인을 할 수는 있지만, 한번에 큰 그림을 그리기는 어려워서 번거롭다.
그런데 Responsively App 이라는 매우 유용한 앱을 알게 되었는데, 한 눈에 다양한 화면에서 내 웹페이지가 어떻게 유저한테 보이는지 확인할 수 있다.
최근에 리액트 기반으로 만들어본 웹페이지를 이용해서 테스트해 보았다.
(https://hanalia.github.io/react_rec_hosting/)
Material UI 및 Grid Container 기반으로 컴포넌트를 구성하였기 때문에 화면 크기에 따라서 그래프와 표가 나란히 보일수도, 위 아래로 보일 수 있다.
이 앱을 사용하니 각 화면에서 어떻게 보이는지 한 눈에 확인가능하다.