본문 바로가기

반응형

웹개발팁

(2)
Vue3 Carousel에서 화면 줄어들 때 이전 슬라이드가 겹쳐 보이는 문제 해결하기 프로젝트에서 Vue3 Carousel을 사용하다 보면, 해상도가 작아지거나 브라우저 창 크기를 줄였을 때 이전/다음 슬라이드가 화면에 겹쳐서 보이는 문제가 발생할 수 있습니다.처음에는 캐러셀 자체 버그인가 싶었는데, 원인은 뷰포트 영역이 슬라이드 밖 컨텐츠를 잘라내지 못한 것이었습니다.문제 상황아래와 같은 상황이 자주 발생합니다.데스크톱 풀스크린에서는 정상적으로 보임하지만 모바일이나 작은 화면에서는 이전/다음 슬라이드의 일부가 비쳐 보임특히 Motion 애니메이션(x: '50%') 같이 좌우로 이동하는 요소가 있으면 더 심해짐해결 방법해답은 의외로 간단했습니다.뷰포트 영역에 overflow:hidden을 강제로 주는 것만으로 문제를 해결할 수 있었어요..carousel__viewport { overfl..
🚫 Nginx 413 Request Entity Too Large 오류 해결 방법 웹 서버에서 파일 업로드 또는 대용량 데이터를 전송하려 할 때, 아래와 같은 오류를 마주한 적 있으신가요?413 Request Entity Too Large이는 클라이언트가 서버로 보낸 요청 본문(request body)의 크기가 Nginx가 허용하는 최대 크기를 초과했을 때 발생하는 오류입니다. 기본적으로 Nginx는 1MB까지만 허용합니다.📌 에러 상황 예시저는 /api/parse 라는 경로로 Flask 앱에 요청을 보내는 환경에서 이 문제를 겪었습니다. POST 요청으로 PDF나 이미지 같은 데이터를 전송할 때 발생했죠.location /api/parse { proxy_pass http://localhost:8088/parse; ...}🔧 해결 방법: client_max_body_si..

반응형