회사 실무에서 클린 코드가 의미 있는 이유가 무엇일까? 회사에서 한번 쯤 들어볼 말이 있다.
그 코드는 안건드리시는 게 좋을 거에요. 일단 제가 만질게요.^^;;
이 말의 의미는
- 흐름 파악이 어렵고
- 도메인 맥락 표현이 안 되어
- 동료에게 물어봐야 알 수 있는 코드
를 말합니다.
이런 코드는 개발할 때 병목이 되고, 유지보수할 때 시간이 오래 걸리며 심하면 기능 추가가 불가능한 상태가 됩니다. 이러한 경우 성능도 안 좋은 경우가 많아서 유저 입장에서도 쾌적하지 못합니다.
실무에서 클린코드의 의의는 유지보수 시간의 단축입니다. 동료, 혹은 과거 내가 짠 코드를 빠르게 이해할 수 있다면 유지보수 할 때 드는 개발 시간이 짧아집니다. 읽기 좋은 깔끔한 코드는 코드리뷰의 시간도 버그가 났을 때 디버깅 시간도 단축시킵니다. 시간은 자원이며, 자원은 곧 돈입니다. 고치는데 하루 걸리는 코드와 삼일 걸리는 코드가 있다면 후자는 개발자가 3배로 필요할 것입니다.
사실 코드를 처음 설계하고 새로운 파일에서 짤 땐 깨끗합니다. 하지만 기존 코드에 기능을 추가하는 상황이라면 조금 달라집니다. 긴장의 끝을 놓치면 코드가 들쑥날쑥해집니다. 사실 회사에서 우리 일의 90%가 기존 코드에 기능을 추가하는 일이죠. 남이 짠 코드, 혹은 내가 지난주에 짠 코드에 기능을 붙이니까요.
코드를 안일하게 추가한다면 어떤 함정에 빠질 수 있을까요?
- 하나의 목적인 코드가 흩뿌려져 있다.
하나의 목적인 코드가 흩뿌려져 있어 나중에 기능을 추가할 때 스크롤을 위아래로 이동하며 미로찾기를 해야 합니다. -> 하나의 목적인 코드는 모아두기
- 하나의 함수가 여러가지 일을 하고 있다.
세부 구현을 모두 읽어야 함수의 역할을 알 수 있게 된다. -> 함수 세부 구현 단계를 통일한다, 함수가 한 가지 일만 하도록 쪼갠다.
이렇게 하면 코드가 첫 번째 버전보다 길어진다. 왜냐면 클린코드는 짧은 코드가 아니고, 원하는 로직을 빠르게 찾을 수 있는 코드이기 때문입니다.
- 응집도(하나의 목적을 가진 코드가 흩뿌려져 있으면 안된다)
- 단일책임(하나의 함수가 여러가지 일을 하고 있으면 안된다)
- 추상화(함수의 세부구현 단계가 제각각이면 안된다. 필요한 만큼만 노출시킨다)
코드를 잘못 뭉치면 문제가 발생한다. 코드 길이가 길어지는 것을 방지해서 관련 기능끼리 뭉쳐서 빼두었더니 오히려 추상화된 코드가 무슨 일을 하게 되는지 모르게 되었다.
무엇을 뭉쳐야 하는가?
당장 몰라도 되는 디테일을 뭉친다. 이를 숨겨둔다면 짧은 코드만 보고도 빠르게 코드의 목적을 파악하는 게 쉬워집니다. 반대로 뭉치면 안되는 경우는 코드 파악에 필수적인 핵심 정보입니다. 이를 분리해 놓으면 여러 모듈을 넘나들며 흐름을 따라가야 하는 대참사가 일어나게 된다. 따라서 핵심 데이터는 밖에서 전달하고 나머지는 뭉칠 수 있도록 해야한다. 이러한 개념을 선언적 프로그래밍 이라고 합니다. 특징은 '무엇'을 하는 함수인지 빠르게 이해가 가능하다는 것, 세부 구현은 안쪽에서 뭉쳐두어서 신경 쓸 필요가 없다는 것, 그리고 '무엇'만 바꿔서 쉽게 재사용할 수 있다는 장점이 있습니다.
무엇을 해야할지만 알려줘! 세부 구현은 미리 해놨거든.
- 하나의 일을 하는 뚜렷한 이름의 함수를 만들자
- 조건이 많아지면 한글 이름도 유용하다
로직에서 핵심 개념을 뽑아내는 것을 말한다. 추상화를 무조건 한다고 해서 좋은 것이 아니다. 상황에 맞게 추상화를 해야할때도 추상화를 깨야할때고 있다. 추상화를 할 때 주의해야할 점은 추상화 수준이 섞여 있으면 코드 파악이 어렵다는 것입니다.
- 담대하게 기존 코드를 수정하기
두려워하지 말고 기존 코드를 씹고 뜯고 맛보고 즐기자
- 큰 그림 보는 연습하기
그 때는 맞고 지금은 틀리다. 기존에 깨끗하던 코드에 내가 기능을 추가하게 되면서 망쳐놓을 수 있습니다. 또한 기능 추가 자체는 클린해도 전체적으로는 어지러울 수 있다.
- 팀과 함께 공감대 형성하기
코드에 정답은 없습니다. 명시적으로 이야기 하는 시간이 필요합니다.
- 문서로 적어보기
글로 적어야 명확합니다. 이 코드가 어떤 점에서 향후 위험할 수 있는지, 어떻게 개선할 수 있을지 나만의 원칙을 적어보세요.
FROM. 토스ㅣSLASH 21 - 실무에서 바로 쓰는 Frontend Clean Code