less than 1 minute read

오늘 배운 것


1. 구현이랑 컴포넌트의 분리

Header에서 NavBar를 그리게 해야 할까, 아니면 NavBar 및 NavItem을 그리게 해야 할까? 아니면 아예 Header에서 HeaderNav를 그리게 하고, HeaderNav에서 NavBar와 NavItem을 그리게? 이쪽이 맞는 것 같다.

bitimulate를 보면, NavBar라는 건 따로 없고, FlexBox와 NavItem을 써서 HeaderNav를 이룬다. 그리고 Header와 HeaderNav 모두 비즈니스 로직을 가지고 있고, FlexBox와 NavItem은 atom으로 비즈니스 로직이 없는 컴포넌트이다. 즉 atom들은 상태 없이 재사용성이 높은 컴포넌트들이고, 상위 molcules나 organisms는 비즈니스 로직을 포함하는 것으로 보인다.

약간 애매하게 느껴지는 부분은 HeaderNav가 있을 때 NavBar가 필요할까? 하는 점이다. 또 어떻게 보면 Header역시 컴포넌트의 이름이라 볼 수 있으므로 view/Header, viewModel/Header 이렇게 만들어서 viewModel의 Header가 view/Header를 그리되, 모든 속성이나 등등 로직을 매개변수로 전달하는 식으로 하는게 분리되었다고 볼 수 있겠지만, 문제는 뭐 하나 바꿀 때마다 같이 바꿔야 한다. 그리고 state 등등 실제로 어떻게 적용가능할지도..

dep

ref


Comments