아토믹 디자인이 더 이상 유행하지 않는 이유를 생각해보았습니다
메리톡톡을 리팩토링하면서, 예전에 많이 썼던 아토믹 디자인 패턴이 떠올랐습니다. 한때는 React 컴포넌트를 atom, molecule, organism으로 나누는 것이 무척 체계적으로 느껴졌는데, 지금은 이 패턴에 대해 더 이상 이야기하는 사람을 만나기 어렵습니다. 왜 그럴까 하는 생각이 들어, 이번 기회에 정리해보기로 했습니다.
유행하던 시절
아토믹 디자인은 UI를 가장 작은 단위(atom)로 쪼개고, 이를 조합해 molecule, organism, template, page 순으로 구성하는 방법론입니다. 재사용성을 높이고, 디자인 시스템과 개발 컴포넌트를 일치시키는 데 강점이 있었습니다. 한동안 React 생태계에서 널리 참고되었고, 저도 몇몇 프로젝트에 적용해보면서 그 장점을 체감했습니다.
실무에서 부딪힌 한계들
하지만 프로젝트를 거듭할수록 몇 가지 어려움이 눈에 띄었습니다. 첫째, 컴포넌트를 너무 작게 나누다 보면 상태 관리가 오히려 복잡해집니다. atom 하나가 여러 organism에서 사용되면서 props 전달 체인이 길어지고, 어디서 상태를 관리해야 할지 모호해집니다. 둘째, atom, molecule, organism의 경계가 모호해지는 순간이 자주 발생했습니다. 팀원마다 분류 기준이 달라서 일관성을 유지하기 어려웠습니다. 셋째, 최신 React는 hooks와 context API, 각종 상태 관리 라이브러리를 통해 더 간단하게 추상화할 수 있는 방법을 제공합니다. 굳이 아토믹 디자인이라는 틀을 강제할 필요가 없어진 셈입니다.
지금의 내 관점
아토믹 디자인이 완전히 쓸모없다고 생각하지는 않습니다. 다만 지금의 제 상황에서는, 이 패턴을 무조건 따라야 한다는 압박보다는 프로젝트의 맥락에 맞게 필요한 만큼만 나누는 것이 더 실용적이라고 느꼈습니다. 지나치게 정형화된 패턴에 집착하기보다, 팀과 프로젝트의 규모에 따라 유연하게 적용하는 것이 낫다는 생각이 들었습니다.
배운 점
이 경험을 통해, 한때 유행했던 기술이나 패턴이라도 시간이 지나면 다른 방식으로 대체될 수 있다는 점을 다시 한번 확인했습니다. 중요한 것은 '왜 그 패턴을 썼는가'에 대한 나름의 기준을 갖는 일이라고 생각합니다. 아토믹 디자인이 사라진 이유는 패턴 자체의 문제라기보다, 더 나은 도구와 환경이 등장했기 때문일 수도 있겠다는 생각도 듭니다.
마무리
아직 완전한 답을 찾은 것은 아니지만, 이렇게 정리해보니 과거의 유행을 비판적으로 돌아보는 것 자체가 의미 있는 기록이 되었습니다. 다음에는 또 어떤 패턴이 등장하고 사라질지 지켜보는 재미가 있습니다. 그 과정을 천천히 기록해두는 것이 결국 제게는 가장 자연스러운 공부 방법인 것 같습니다.