반응형 mobile2 [CSS] mobile address bar 포함하여 100vh 적용하기 + React, SCSS [ 문제점 ] 일반적으로 css 에서 100vh를 사용하면 데스크탑에서는 문제가 되지 않는다. 그냥 창 전체 크기로 알아서 맞추어 주지만, 모바일에서는 url 주소창이 있기 때문에 문제가 생긴다. 주소창의 형태와 크기는 safari, chrome 에 따라 다르고, 버전에 따라서도 다르기 때문에 각각의 경우를 나누어서 계산하기는 힘들다. [ 해결 방법 ] 찾아보니 CSS에서 height: -webkit-fill-available; height: fill-acaiable; 이런저런 속성들이 있다고 했다. 그래서 적용시켜보니 safari에서는 돌아가는데 chrome에서는 또 적용이 안되는 오류가 있었다. 그래서 chrome에서는 또 따로 분기를 나누어서 처리하고 하려고 하다가 다음과 같은 방법을 발견하고 해결.. 2022. 9. 5. [Flutter] Flutter로 개발하면서 느낀 점 개발 이야기는 인스타 easy_develop에도 올라옵니다. 플러터 프로젝트가 진행 중이라는 점 유의 플러터의 시작 처음 flutter 프로젝트를 만들고 기본 템플릿으로 실행시켰을 때의 느꼈던 감정을 잊지 못한다. “와…. 이 정도로 개발자 도구가 잘돼있다고?”라는 감탄이 나왔다. 중단된 프로젝트지만 React Native로 앱 개발을 해보았을 때는 디버깅하기 너무 힘들었다. 똑같은 React지만 웹에서 요소를 클릭하면 각종 정보를 볼 수 있는 개발자 창도 없어서 화면구성 하기 힘들었고, 웹 콘솔 창도 없다 보니 JSON 같은 데이터를 출력하면 검은 콘솔 창에 쭉 나왔다. 그러다가 React Native Dev Tool을 찾았지만, 실행시키면 앱의 속도가 10배 정도 느려졌다. 이렇게 정말 힘들게 개발하.. 2022. 6. 11. 이전 1 다음 반응형
