당신의 친절한 이웃, 코딩맨

제목처럼 3년만에 다시 글을 쓴다는 이유는 어느덧 병아리 개발자가 된지 3년이 되었다는 이야기다. 그동안 글을 쓰지 않고, 정확히는 기록을 하지 않은 이유는 사실 모든 개발자가 다 똑같이 느끼는 이유일 것이라 생각한다. 1. 뭔가 세상에 도움이 되어야할 것 같은 거창하고 정확한 이야기를 써야하는데 나는 그런 지식이 없다 생각. 2. 시간이 없어서 3. 필요성을 못 느껴서 4. 세상에 너무 대단한 개발자가 많아서 내 지식, 정보 수준이 낮다고 느껴져서 and so on.. 사실 너무 많다. 이것들은 핑계이기도하고 내가 마주치기 싫은 현실 혹은 팩트들이 아닐까 생각이 든다. 이제는 마주해야할 현실이자 팩트이고 내가 회피했던 것들을 마주하고 싶어진 이유가 바로 3년만에 다시 글을 쓰기 시작한 이유이다. 나는 ..

CSS를 하다 보면 Background-image를 넣을 일이 종종 발생한다. 그럴 때 마다, // 예제 클래스명은 "box" .box { background-image: url(""); background-position: center; background-repeat: no-repeat; background-size: cover; } ※ 백그라운드 이미지를 이렇게 제일 많이 사용한다. 반응형처럼 보일 수 있기도 하고, 사용목적이 위와 같은 코드로 많이 상용되기도 하기 때문. 하지만 매번 이렇게 적는 방법은 손도 아플 뿐더러, Sass를 사용하고 있지 않다면 계속해서 이렇게 스타일링을 지정하는 것은 불편하기만 하다. 위와 똑같은 코드를 굉장히 압축 시킬 수 있는데, 아래와 같다 .box{ backgro..

Todo list를 구현하거나, 게시글을 구현하는 일들은 프로젝트를 만들면 비일비재하게 일어난다. 리스트, 상품 목록, 유저 목록, 등등.. 사실 Vue를 사용하면 spa를 손쉽게 다룰 수 있다는 장점 덕에 쓰는 것인데, 흔히 말하는 '자식' 컴포넌트가 메뉴고, '부모'컴포넌트에서 리스트들을 보여준다면, 크게 2가지 방법이 있다. VUEX로 관리하거나, emit과 props로 이벤트를 생성해서 전달하거나 보통 이렇게 둘 중에 생각하는데 내 수준에서는 정답은 없는 것 같다. 하지만!! 1. 컴포넌트들의 규모가 커서 두번씩, 세 번씩 이벤트를 생성해서 데이터를 전달해야 하거나, 2. 반복적으로 여러 곳에서 사용할 것같다 하면, vuex를 사용하는 것이 상대적으로 데이터들의 state들을 관리하기 용이했다. ..

Vue Cli 는 컴포넌트 단위로 웹을 구성하여 만드는 React다음으로 유명한 프레임워크다. 컴포넌트들로 웹을 만들면 여럿 장점이 있지만, 모달창, 스낵바 등을 재사용할 수 있다는 장점이 가장 주된 이유일 것이다. 하지만 CSS를 이용해서 스타일링을 하게되면, 나도 모르게, 혹은 팀원 공교롭게 나와 같은 클래스이름을 지은 다른 컴포넌트들의 스타일링도 바뀌는 것을 목격했다. 웹의 서비스가 점점 커지다보면, 계속해서 새로운 이름을 만드는 것이 생각보다(?) 어려운 일이 된다. 따라서 이를 해결하기 위해, 라는 "scoped"를 style태그를 사용하게 된다면, 해당 컴포넌트에서만 css를 사용할 수 있게 된다. 관련 소스는 vue-loader-v14.vuejs.org/kr/features/scoped-cs..