전체보기

normalize와 modern-normalize 차이점normalize.css와 modern-normalize는 모두 브라우저 간의 기본 스타일 차이를 최소화하기 위한 CSS 파일입니다. 1. normalize.css목적 : 모든 브라우저에서 일관된 스타일을 보장하기 위해 브라우저의 기본 스타일을 재설정하는 것을 목표로 합니다.포함된 스타일 : 보다 포괄적으로 다양한 HTML 요소에 대한 기본 스타일을 재설정합니다. 폼 요소, 리스트, 테이블 등 다양한 요소에 대한 스타일이 포함됩니다.유지보수 : 프로젝트가 비교적 오래되었으며, 브라우저 호환성을 위해 자주 업데이트 되지 않지만 여전히 널리 사용됩니다. 2. modern-normalize목적: normalize.css의 최신 버전으로, 최신 브라우저와의..

Angular에서 React로 변경하면서 원본 페이지의 CSS가 새 페이지에 영향을 미치지 않도록 하기 위한 방법이 필요했습니다. CSS Reset (Normalize)CSS Reset은 브라우저마다 다르게 적용되는 기본 스타일을 초기화하여 일관된 스타일을 보장하는 기술입니다. 이를 통해 원본 페이지의 글로벌 스타일이 위젯에 영향을 미치지 않도록 할 수 있습니다. CSS Reset 라이브러리 사용: Normalize.css와 같은 라이브러리를 사용하여 스타일을 초기화합니다.위젯의 최상위 클래스에 CSS Reset 적용: 위젯의 최상위 클래스에 CSS Reset을 적용하여 원본 페이지의 스타일을 무효화합니다./* normalize.css 또는 reset.css 파일을 프로젝트에 추가 */.container..

useMemo와 useCallback은 React의 훅으로, 각각 계산된 값과 함수의 메모이제이션을 도와줍니다.둘 다 성능 최적화에 사용되지만, 그 목적과 사용 방법이 다릅니다. useMemo목적 : 계산된 값을 메모이제이션하여 불필요한 재계산을 방지합니다.사용법 : 계산이 필요한 값을 반환하는 함수를 인자로 받고, 그 값이 변경되지 않는 한 메모이제이션된 값을 반환합니다.const computedValue = useMemo(() => { return expensiveCalculation(someValue);}, [someValue]);여기서 expensiveCalculation은 someValue가 변경될 때만 다시 계산됩니다. useCallback목적 : 함수를 메모이제이션하여 함수가 새로 생성되는..

git commit 취소하기로컬에서 혼자 작업할 경우, reset을 이용해서 이전커밋으로 돌아갈 수 있습니다.reset 명령을 수행하면 커밋이 이전 상태로 돌아간 것이기 때문에 다시 원래 상태로 돌아가고 싶다면 pull을 사용해서 가져올 수도 있습니다. 원격 저장소에 push 하지 않은 경우 : reset 사용원격 저장소에 push 한 경우 : revert 사용 git reset 명령어git reset --hard  원격 저장소에 push 한 경우라도 reset 을 사용해서 commit 을 돌릴 수 있습니다.하지만 이 때는 원격의 commit 도 같이 삭제하는 작업이 필요하므로 git push 를 할 때 -f 으로 강제 push 를 해야합니다.git push -f origin 혼자서 작업할때는 괜찮지만 ..

useCallbackReact 컴포넌트가 리렌더링되면 해당 컴포넌트 함수들이 새로 만들어집니다.자바스크립트에서는 함수도 곧 객체이기 때문에 리렌더링이 되면 '내용이 동일한 새로운 함수 객체'가 생성됩니다.useCallback은 특정 함수를 새로 만들지 않고 재사용하고 싶을때 사용합니다. 두번째 매개변수인 deps가 업데이트되지 않는다면 함수 객체를 독립된 메모리에 캐싱해두고, 리렌더링 시 새로운 함수 객체를 생성하지 않기 때문에 해당 함수를 props로 가지는 자식 컴포넌트들은 함수가 바뀌었다고 생각하지 않게 됩니다.따라서, 자식 컴포넌트의 props로 전달해주는 함수들은 useCallback을 사용해주면 재실행이 일어나는 횟수가 줄어들기 때문에 더 효율적인 앱을 만들 수 있습니다.const onCrea..