컴포넌트 쪼개기

오늘 진행한 css 작업

컴포넌트에 코드가 너무 많다

오늘 css 작업을 하면서 한가지 불편함을 느꼈다.
컴포넌트 하나에 너무 많은 것들이 들어있어서 styled 컴포넌트 이름짓기도 힘들고 css작업을 하려면 긴 스크롤을 내렸다 올렸다 해야했기 때문이다.

그래도 당장 바꿀 시간이 없어보여서 있는 그대로 했는데 장바구니 css 작업을 시작하려니 이전 컴포넌트보다 압도적인 양의 코드때문에 의욕이 조금 없어졌다.

그러다가 석태님이 어제 장바구니는 자신의 디자인을 참고하라고 하신게 생각나서 석태님의 코드를 살펴봤다.

css가 되어 있는데도 컴포넌트가 잘쪼개져있어서 코드 양이 그렇게 많지 않은걸 볼 수 있었다.

게다가 컴포넌트를 쪼개기 전에는 생각도 못했던 방식의 아이디어도 얻을 수 있었다.

예를들면 장바구니가 비었을때, 다른 컴포넌트를 재활용하고 비어있는 정바구니를 따로 만드는 것이다.

전에 이 부분에 대해서 어떻게해야하나 고민을 많이 했었는데 덕분에 해결할 수 있었다.

쪼개서 작업하자

오늘 작업을 하면서 느낀점은 많은 양의 코드때문에 네이밍 고민을 더 하고 이리저리 왔다갔다 할 시간에 컴포넌트를 더 나누고 작업을 하는게 더효율적이지 않을까 싶다는 것이다.

실제로 해봐야 알겠지만 나중을 위해라도 컴포넌트를 나누면서 작업을 해야할 것 같다.

내일은 장바구니, 주문페이지 css 작업을 하면서 컴포넌트를 나눠보자