ZungTa Blog

퍼블리싱 작업 중 배경 이미지를 넣어야 할 경우 반응형으로 맞춰야 하기 때문에 곤란한 경우가 있다. 어느 해상도에서나 특정 모양을 맞춰줘야 한다. 예를들어 아래 이미지를 해상도가 바뀌어도 일정하게 꽃모양을 비춰줘야 한다던지 하는 문제가 있다. 일단 repeat은 no-repeat으로 설정해주는게 당연하고, 화면에 다 보여줘야 하니까 background-size는 contain을 해준다. 그렇게 되면 여백이 생기거나 이미지가 잘리는 문제가 있다. 그래서 한가지 노하우를 공유하고자 한다. 위의 사진의 경우 꽃모양을 일정하게 보여주고 싶을 경우 사진의 하단쪽을 계속 보여줘야한다. 그럼 background-size: cover; 를 주고 중요한 것은 background-position을 주는 것이다.

npm을 이용해서 모듈 설치할 때 가끔 (특히 윈도우 환경에서) Can't find Python executable 에러가 뜰 경우가 있다. 해결방법 (안되는 경우도 있음) npm --add-python-to-path='true' --debug install --global windows-build-tools위 명령어를 치면 시간이 좀 오래 걸린다. 설치가 끝난 후 해당 프로젝트에서 package-lock.josn이 있으면 제거 후 npm i 를 해본다.

예전에 React로 만들었던 토이프로젝트를 이번에 Hooks 스타일로 변경하는 작업을 시작했다. 순조롭게 변경 중이었는데 문제점이 생겼다. Class형에서 사용하던 componentDidUpdate를 Hooks에서는 useEffect를 사용한다고 공식문서에 나와있어서 진행을 하였는데 내가 예상했던 것과는 useEffect가 호출되는 부분이 달랐다. componentDidUpdate - Mount될 때에는 호출되지 않고 props나 state가 변경되어 컴포넌트가 업데이트 될 때에 호출됨. useEffect에서 useEffect(() => { // 작업 }, [value]); 이렇게 사용하면 Mount될 때에도 호출, 컴포넌트 업데이트될 때에도 호출됨. 내가 원하는 방식은 말 그대로 컴포넌트가 업데이트 되..