프론트엔드

이번에 프로젝트를 하며 알게 된 중요한 사실은, package.json과 package-lock.json 파일을 반드시 함께 커밋해야 한다는 점이다.이 두 파일은 프로젝트의 의존성 관리에 중요한 역할을 하며, 이를 제대로 관리하지 않으면 예상치 못한 문제가 발생할 수 있다.   package.json만 커밋할 경우만약 package.json만 커밋하고 package-lock.json은 커밋하지 않으면, 다른 사람이 npm install을 실행해야 한다!. 실행할 때 의존성 버전이 달라질 수 있어서 주의가 필요하다. package-lock.json은 코드가 너무 길어서 그런지, 커밋해야 하는지 안 해야 하는지 계속 헷갈린다.ㅎㅎㅎㅎ  package.json과 package-lock.json 둘 다 커밋할 ..

웹 페이지에서 모달 창을 만들 때, 긴 내용이 들어가거나 화면 크기에 따라 콘텐츠가 자동으로 스크롤되도록 max-height와 overflow-y: auto 속성을 사용하는 경우가 많다.하지만 이렇게 설정하면 모달 창 내부의 요소들이 의도치 않게 크기가 줄어드는 경우가 발생할 수 있다.이 글에서는 이런 현상을 해결하는 방법과 CSS flex-shrink 속성을 사용해 버튼 크기를 안정적으로 유지하는 방법을 소개하려고 한다!    모달 창을 디자인하면서 아래와 같은 스타일을 적용했다: .modal { display: none; position: fixed; z-index: 1001; left: 0; top: 0; width: 100%; height: 100%; o..