Styled Components

1차 프로젝트에서 nesting이 특징이었던 sass를 사용한 것과 달리, 2차 프로젝트에서는 styled component를 사용하여 react code를 구성한다.

Styled component의 가장 큰 특징은 css 속성 값에 props를 넘겨서 javascript처럼 props에 따라 다른 css 속성을 부여할 수 있는 점이다.
두 번째로 큰 특징은 styled component의 변수명으로 태그 이름을 지정할 수 있는데, 이 때 해당 태그에 부여되는 클래스명이 hash value로 자동 생성되기 때문에 클래스명 오염을 방지하는 점이다.

나의 경우, css와 sass로 스타일을 적용시킬 때는 조금 비효율적으로 코드를 구성하는 것 같다는 생각이 있어 조금 괴로운 마음이 있었다.
이제는 styled component를 사용하고 나니 적은 양의 코드로 적재적소에 다양한 스타일을 입힐 수 있어서 화면에 스타일을 입히는 작업이 전보다 재미있게 다가온다.

사람이 괴로움을 느낌으로 인해 기술이 날로 발전한다고 믿는 사람으로서, 내가 괴로움을 느낀다는 점은 긍정적으로 다가온다.
이 괴로운 부분을 잘 기억해두고 내 실력이 조금 더 향상되었을 때 다른 이들을 위해 기술을 발전시킬 수 있는 사람이 되도록 오늘도 열심히 달려야겠다.