소프트웨어 설계에 대해 ⭐ / 1️⃣ - 설계의 중요성과 디자인 패턴 (feat. patterns)

소프트웨어에 개발 설계도가 필요한가요?

 

정말정말 개발자 생활을 하면 할수록 느끼고 또 느끼는 것 중 하나가 개발하는 데에 보다 설계하는 데에 시간을 더 많이 들어야된다는 점입니다. DDD 관련 게시글 들에서도 항상 얘기했던 점이고, 설계의 중요성을 더 말하기에는 이제 입이 아플정도입니다. 😂 (그러니 바로 생략)

 

 

우리가 만들 소프트웨어는 복잡하다 (인간의 관점에서)!

 

그렇다면 왜 설계가 필요한 걸까요? 가장 근본적인 원인 자체는 '소프트웨어는 복잡하다' 라는 점입니다. 숨을 쉬는 방식에 대해 우리는 설계를 하지는 않죠. 너무 당연한거니까요. 하지만 우리 현실세계에서 쉽게 풀리지 않는 것들, 사람의 힘만으로는 해결되지 않는 것들은 매우 많습니다. 그런 것들을 해결하고 자동화시키기 위해 소프트웨어가 만들어진 것이죠? 그렇기 일반적으로 소프트웨어가 일반적으로 복잡한 것은 어찌보면 당연한 것입니다. 복잡하지 않은 문제를 해결하는 소프트웨어는 가치가 없겠죠.. 1+1 같은 계산기 프로그램을 만드려고 코딩하는 사람이 어딨겠습니까 ㅎㅎ

 

설계의 필요성은 당연하다고 생각해도, 왜 설계에 더 많은 시간을 쏟아야하고, 안정적인 설계가 필요한거지에 대해서의문이 생길 수 있죠. 고객들에 니즈에 맞게 기민하게 금방금방 만들어내는 것이 좋게 보이기도 하고, 처음 애플리케이션을 만들어내는 과정에서 설계가 많은 시간을 잡아먹으니까요..

 

하지만 좋은 설계를 하는 데에 시간을 투자하는 것은 장기적으로 봤을 때 반드시 어마어마한 리소스와 시간의 단축을 이끌어낼 것입니다. 좋은 설계의 필요성을 아래와 같이 세 가지로 정리해보았습니다.

 

1. 요구사항을 가장 효율적으로 만족시켜야한다.

- 설계라는 것은 무궁무진한 상황과 변수들 속에서 그에 걸맞는 디자인을 선정하는 것입니다. 모든 시스템에 걸맞는 설계는 없고, 두 시스템에 구획된 설계가 완전히 동일할 수는 없습니다. 잘 짜여진 설계는 바로 비즈니스 로직(요구사항)을 가장 적은 리소스를 사용하면서 해결할 수 있게 되는 설계이죠.

 

2. 유지보수 측면에서 압도적으로 편해진다.

- 기능을 추가하고, 변경할 때 수월함의 차이가 매우 크죠. 설계가 엉망이거나 설계없이 만든 소프트웨어는 결국 추가하고 변경할 때마다 새로운 설계를 해야 합니다.

 

3. 협업에서의 이점을 가진다.

- 설계와 틀이 온전하게 갖춰져있지 않은 곳에 개발한다고 상상해봅시다. 방대해진 패키지와 중구난방인 코드들은 작성하는 순간부터 레거시가 되는 불상사가 일어납니다..

 

 

디자인 패턴이란?

 

앞서서 설계의 필요성, 그리고 그걸 넘어서 '좋은' 설계의 필요성을 말해보았습니다. 저는 디자인 패턴이 이 '좋은 설계' 를 하기 위해 나온 것이라고 생각합니다. 모든 사람이 각자의 비즈니스에 딱 맞는 좋은 설계를 할 수 있으면 좋겠죠. 하지만 그것은 쉬운 일이 아닙니다. 처음 맞는 문제들도 있을 것이고, 요구사항이 다양하기 때문에 막막한게 일반적입니다.

 

디자인 패턴은 이런 문제들을 어떻게 보편적으로 잘 해결할 수 있을지들을 담고 있습니다. 쉽게 말해 이미 여러 사람들로부터 효율성이 보증된 패턴들이기 때문에, 설계하는 사람의 입장에서는 믿고 쓸 수 있는 것이죠. 각자 해결해야 하는 문제점들, 요구사항들, 비즈니스들을 고려해서 적합한 디자인 패턴들을 골라서 사용하면 되는 것이니까요. (필요에 따라서 변형한다거나 응용할 수도 있겠죠?)

 

디자인 패턴을 미리 숙지해뒀고 이를 잘 활용한다면 그만큼 설계에 문제점 중의 하나인 '시간이 많이 소요된다' 는 점을 명확하게 줄여줄 수 있게 되는 것입니다.

주어진 상황에 걸맞는 디자인 패턴을 아는 것과 모르고 개발하는 것은 난이도 차이가 어마어마 할 것입니다.. 그만큼 평소에 관심을 가지고 이런저런 디자인 패턴을 익혀두는 것이 도움이 될 것 같아요.

 

 

Patterns

주구장창 얘기만 했으니 이제 괜찮은 사이트를 소개하고자 할까 합니다.

 

https://www.patterns.dev/posts/

Patterns

 

이 사이트는 제 팀원분께서 최근에 알려주신 사이트인데요, 자바스크립트 로 개발을 함에 있어서 사용되는 디자인 패턴들을 깔끔하게 정리해둔 사이트입니다. 설계를 하는 데에 사용되는 디자인 패턴 뿐만 아니라, 성능이나 렌더링에 관련해서 자바스크립트가 사용하는 패턴들, Next JS 나 React 처럼 자바스크립트를 기반으로 하는 프레임워크들의 패턴들도 정리가 되어 있어 자바스크립트 공부에 많이 도움이 될 것 같네요.

patterns 포스트 캡쳐

 

코드블럭이라던가, 줄 간격이라던가 정말 가독성이 최~~고 입니다. (제 블로그랑 비교가 되네요.. ) 위의 캡쳐처럼 필요에 따라 gif로 표현도 해주고, 디자인이 뭔가 잘 읽히는 디자인이죠? 심지어 코드블럭 스타일도 제가 쓰는 dracula 테마여서 더 마음에 드네요 ㅎㅎ 언젠간 한 번쯤은 제 블로그도 대대적으로 CSS를 손봐야 할 것 같습니다..

 

아무튼 원래 디자인 패턴같이 추상적인 것들은 읽어도 읽어도 눈에 안들어와서 금방 집중력이 흩어지는게 문제인데, UI가 너무 깔끔하고 웬만한 것들은 전부 flow chart나 코드 예시로 설명해주다보니 너무 좋은 것 같습니다.

 

 

마치며

patterns 사이트가 가독성이 좋은 이유 중 가장 큰 점은 무엇일까요?

저는 Flow chart , 즉 그림으로 먼저 예시를 들어가며 설명하고 있기 때문이라고 생각합니다. 요즘 시대에 굴림체 폰트 크기 10으로 빽빽하게 꽉차있는 줄글들을 누가 읽고 싶어하겠어요 ㅠㅠ

 

그런 의미에서 다음 포스팅은 이 Flow chart, 설계도 작성에 대해 다뤄보려고 합니다. 어떤 방식으로 해야할 지, 좋은 툴은 무엇이 있을지 들을 다뤄보려고 해요. 저도 물론 아직 쥬니어고, 알아갈게 많기 때문에 공부한다고 생각하며 작성할 생각입니다!

 

긴 글 읽어주셔서 감사합니다~ 🙇‍♂️