이틀에 걸쳐 전체적인 레이아웃에 대한 리팩토링과 반응형 적용을 위한 토대를 다졌다.
sm , md , lg 사이즈를 정의하고 배너와 게시물 레이아웃 컴포넌트들에 반응형 작업을 했다.
탭 네비게이션에 먼저 반응형으로 가로 길이를 감지해 좁은 모바일 사이즈에서 감춰지게 만든후
갤럭시폴드5 기준 접은 화면에서 정상출력되는 것을 확인.
게시물 컨테이너들이 가로기준 한칸씩 , 가로길이를 반응형으로 나오게 적용후
갤럭시폴드5 기준 펼친 화면에서 정상출력되는 것을 확인.
lg이상 사이즈 및 데스크탑 사이즈로 가로길이가 더 확보되어도
레이아웃 단위에서 max-width를 지정하고 오토마진을 잡아 가운데 정렬이 되어 깔끔하게 나오도록 처리했다.
사실 정리하면 되게 간소하게 적게되는데 굉장히 많은 시행착오와 자료검색을 거쳤다... 후
배포가 된 상태에서 보유한 디바이스로 체크를 하니까 상당한 편리함을 느낄 수 있었고,
해당 프로젝트가 실제로 사용될 서비스이다 보니 배포를 해놓고 기능 구현을 하면서 클라이언트분께
중간중간 설명을 드려야 해서 말이나 화면공유로 하는거 보다 직접 보여드리는 경우가 많아서
다양한 환경과 디바이스에서 정상적으로 보이는 것을 최우선 했다.
하지만 여전히 레이아웃의 마감이 많이 아쉽기 때문에 계속 중간중간 리스트업 해두고 처리해야겠다.
The pain is so persistent that it is like a snail, and the joy is so short that it is like a rabbit's tail running through the fields of autumn