바이브 코딩으로 앱을 만들다 문서화가 필요하다고 느낀 이유

이 글은 바이브 코딩 방식으로 앱을 개발하면서 문서화의 필요성을 느끼게 된 경험을 정리한 기록이다.
특히 앱 구조 문서와 디자인 시스템을 정리하면서 개발 과정이 어떻게 개선되었는지를 중심으로, 초보 개발자의 시선에서  글을 작성했다.

1. 이야기에 들어가며: 바이브 코딩으로 앱 개발을 시작하며, 문서화 없이 개발했을 때 겪은 문제

바이브코딩을 막 시작했을 때, 아이디어가 머릿속에 오래전부터 있었기 때문에 별도로 문서를 만들 필요가 없다고 생각했다. 
AI의 도움으로 필요한 기능을 바로 구현하고 문제를 해결했기 때문에 제대로 구현된 결과만이 중요하다고 생각했기 때문이다.
그러다 앱에서 구현해야 할 화면이 많아지고 그에 따라 오류도 많아지면서, 오류를 전반적으로 확인하고 개선하는 과정을 파악하기가 어려웠다. 앱 개발의 전반적인 상황을 파악하지 못하고 눈앞에 뜨는 작은 문제만 고쳐나가는데 같은 자리를 맴도는 느낌이 강했고, 시간이 많이 걸리기 시작했다.

 

2. 문서화의 필요성을 느끼게 된 계기

그러던 중 유튜버와 스레드에서, 앱을 개발할 때 전반적인 플랜을 구축하고 문서화하면 기존 계획과 개발 과정 사이의 차이를 확인하고 평가를 수시로 하며 개선할 수 있다는 글을 보았다. 마치 글을 쓸 때 개요를 잡는 과정과 매우 비슷하다고 느꼈다.
디자인 관련된 부분도 요소의 목적과 적용방법에 따라 문서화한다면, 앱에 들어간 색상들은 어떤 것들이며 어디에서 쓰이고 있는지 등, 디자인 요소도 체계적으로 관리하고 한눈에 볼 수 있다.

 

3. 앱 구조 문서화와 디자인 시스템 정리

제대로 한 건지는 모르겠지만, 처음으로 해본 문서작업. 물론 AI에게 요청해서 만들었음.

실제로 문서화를 하면서 다음과 같은 내용을 정리했다.

•  프로젝트 구조 문서
  - 디렉터리 구조를 보여주면서 전체적으로 구조를 파악할 수 있게 한 뒤
  - 각각의 상세구조를 역할
  - assets,
  - 아키텍처 및 설계 패턴
  - 적용 및 지원 방법
  
  
•  디자인 시스템 문서
  - 테마나 상태에 따라 색상코드를 알려주는 컬러시스템
  - 폰트 크기와 스타일을 서술한 타이포그래피
  - 컴포넌트 시스템
  - 애니메이션
  - 반응형 디자인 
•  그 외: 여러번의 테스트를 하며 앱을 수정했던 부분 등

 

4. 바이브 코딩 초보자로서의 느낀점

나는 이제야 막 첫 앱을 개발한 단계이고, 공부해야 할 것도 많고 파악해야 할 것도 많은 초보자다. 
모든 개발 과정을 매번 기록으로 남기는 것이 어려울 수도 있고, git에 commit을 하는 것 만으로 충분한 경우도 있다.
하지만 구조와 디자인에 대한 문서화는 앞으로의 업데이트와 유지보수를 훨씬 수월하게 만들어줄 것이라고 확신한다.