Tailwind CSS 란 ❓ Tailwind CSS는 Utility-First 컨셉을 가진 CSS 프레임워크 입니다. 부트스트랩과 비슷하게 m-1, flex와 같이 미리 세팅된 유틸리티 클래스를 활용하는 방식으로 HTML 코드 내에서 스타일링을 할 수 있습니다. 공식...
PostCSS ❓ POST CSS 는 JS 플러그인을 사용하여 CSS를 변환시키는 툴 입니다. ➡️ POST CSS 는 언어가 아니라 자동으로 신기술 CSS 를 호환가능하도록 변환시켜주는 플러그인 입니다. ➡️ CSS에 문제가없는지 미리 확인해서 에러로그를...
스타일 컴포넌트는 스타일링이 된 컴포넌트란 의미로 CSS-in-JS 입니다. CSS-in-JS ❓ 자바스크립트 파일(코드) 안에서 css 문법을 사용 할 수 있는 라이브러리 입니다. styled-components 를 살펴보면 공식 사이트 :...
기존 CSS 는 프로젝트가 커질 수록 모든 html 요소에 클래스명을 만들어야하고 스타일을 변경할 때 마다 선택자를 하나씩 다 찾아서 변경해야하기 때문에 힘듭니다. 또한 JS 파일과 분리되어있어 컴포넌트의 상태값 변화를 공유하여 동적 스타일링 하기가 어렵습니다. CSS...
자.. 역시 정리용 포스팅. 하지만 모달 같은 컴포넌트는 어느 프로젝트에서나 필요한 요소일 수 있기 때문에 한번 정리해두고 두고두고 참고해서 사용하자 중요한 포인트는 Redux 를 활용해서 언제든지 꺼내서 쓸 수 있을 것 Modal 에 text, 함수를 전달하여...
최근에 Next.js 13버전을 사용하여 사이드 프로젝트를 하고 있는데 전역 모달을 Redux로 만들기 위해 Provider 설정을 해야 했다. 하지만 app directory 에는 index.js 등 최상위 파일이라고 해야하나 비슷한건 있지만 대놓고는 없다는거.....
