styped-components:
Css-in-Js라이브러리로, JavaScript 파일 내에서 CSS를 작성할 수 있게 해준다.
접근 방식: 스타일을 컴포넌트에 직접 연결하여, 각 컴포넌트의 스타일을 독립적으로 관리할 수 있다.
이를 통해 css의 범위를 제한하고, 동적 스타일링이 가능하다.
Tailwind Css:
미리 정의된 클래스 이름을 사용하여 스타일을 적용한다.
접근 방식: 클래스 이름을 HTML요소에 직접 추가하여 스타일을 적용
이를 통해, 빠르고 일관된 스타일링이 가능
차이점:styled-components는 컴포넌트 기반 스타일링이며, 각 컴포넌트의 스타일이 독립적이다.
Tailwind Css는 미리 정의된 클래스를 사용하므로 성능이 뛰어나며, CSS파일 크기가 줄어든다.
유틸리티 클래스 중심으로 작성되기 때문에 코드가 길어질 수 있지만 유지 관리가 용이하다.
자바스크립트에서 객체는 참조에 의해 복사된다는 것은 객체를 변수에 할당하거나, 함수에 인자로 전달할 때, 객체의 복사본이 아니라 객체의 메모리 주소를 참조한다는 의미이다.
이로 인해 발생할 수 있는 오류와 해당 오류를 피하는 방법은
얕은복사: sprad Operator 스프레드 연산자를 사용하여 객체를 복사할 수 있다.
깊은 복사: JSON.strigify()와 JSON.parse()를 사용하는 방법 두 가지가 있다.
함수 선언문은 전체가 호이스팅되지만 함수 표현식은 변수만 호이스팅되고 함수는 정의되지 않은 상태로 남는다.
이러한 개념을 이해하면, 자바스크립트 코드의 실행 흐름을 더 잘 이해할 수 있으며, 개발 시 의도치 않은 오류를 예방하는데 도움이 된다.