Devlog
평소 공부할때는 필요하지 않았지만 프로젝트에서는 꼭!! 필수로!!! 해야하는 세팅이 있다. 바로바로..... 상대경로를 alias path를 활용하여 절대경로로 바꾸기! 오늘은 그 과정에 대한 포스팅이다. 😇 프로젝트가 간단하다면 import를 할 컴포넌트의 depth가 그렇게 깊숙히 있지는 않다. 컴포넌트를 또 새로운 컴포넌트로 쪼개야 하고, 어느정도 규모가 되는 프로젝트에서는 위와 같이 import를 하는데에만 어지러워질 것이다. 이를 간결하고 직관적으로 처리하기 위해 우리는 config에서 alias path를 통해 절대경로를 세팅해주어야 한다. 이번 프로젝트는 TypeScript+React 프로젝트이므로 CRA(최근 업데이트가 없어 곧 안쓰게될...RIP..)로 우선 개발 환경을 세팅해준다. 개발..
계약직으로 잠깐 프로젝트에 참여했을 때, data-* 속성을 잘 활용하는 팀원이 있었다. 한번 들어는 봤지만, 역시 자주 사용하는 속성이 아니어서 "이거다!" 라고 스스로에게 설명을 할 수 없었다. 그래서 한번 개념을 짚고 넘어가고자 정리해보려고 한다. 🥹 html 태그에는 표준으로 정의된 속성들이 존재한다. 하지만 개발을 하다 보면 표준 속성이 아닌 개발자가 속성을 마음대로 정의해서 사용해야 할 때가 있다. 이를 위해 사용자 정의 속성들을 표준화하여 data-* 형식의 속성으로 정의한 것이 데이터 속성이다. 데이터 속성을 통해 전달된 정보들은 DOM의 dataset 객체 내부에 저장되어 쉽게 접근이 가능하다. 각 속성은 문자열이며, 읽거나 쓸 수 있다. 데이터 속성의 장점은 다양하지만 대표적으로 3가지..
리액트를 공부하다 VanillaJS를 다시 학습하기 위해 돌아온 날이었다. IDE의 단축키 기능으로 매번 html 파일을 세팅했었는데, 갑자기 눈에 들어온 ... 문서 타입이 html이라고 지정해주는것 같긴 한데..🤔 DOCTYPE에 대한 궁금증을 해소를 위해 이번 포스팅을 작성하려고 한다. DOCTYPE은 모든 문서의 최상단에서 찾을 수 있으며, 이는 필수로 들어가야하는 서문이다. 브라우저가 문서를 랜더링 할 때 html 문서가 어떤 모드로 작성되었는지 브라우저에게 알려주는 역할을 한다. Why? 그리고 모드는 뭐지? 그렇다면 이렇게 선언하는 이유는 무엇일까? 오래된 웹 사이트들은 너무 오래되어서 현재의 웹 표준(W3C)에 부합하지 않다. 그러다 보니 렌더링 하는데 의도대로 출력되지 않는 등의 치명적..
