들어가기
프로젝트의 마지막 회고인 오늘은 그 동안 진행했던 KPT 회고가 아닌 후기 느낌의 회고를 진행해볼까한다. 살짝 스포를 해보자면, 프로젝트는 기간내에 완성할 수 있었다! 정확히는 마감날 완성됐다. 아무튼 마감시간 전에만 완성하면 되는게 아닐까?
Timepicker
내가 맡은 부분중에 가장 구현하기 어려워던 기능이 아닐까 생각된다. 같은 Picker 항목 중 Datepicker의 경우에는 비교적 쉽게 완성했다. 기능도 디자인도 생각한만큼 잘 나왔다. 하지만 악질 Timepicker의 경우 외부라이브러리의 도움없이는 불가능할 것 같다는 판단에 swiper 라이브러리를 도입하여 완성할 수 있다. 도대체 어떤 디자인과 기능이었길래 그랬데~ 라는 질문에 답을 위해 비슷한 이미지를 첨부해본다.
위와 같이 android style의 timepicker 였다. 기획상의 세부 기능에 대한 명시는 없었으나, 기본적으로 스크롤을 이용하여 시와 분을 움직이는 기능이 꼭 들어가야 할거 같았고, 클릭을 사용해서도 변경이 가능해야 할 거 같았다. 또한 23 -> 00 -> 1 같이 무한으로 시가 표출됐으면 했다. (분도 마찬가지)
처음에는 혼자 만들어 봤지만, 마감이 2일 남은 시점이었다. 물리적인 시간적 여유가 없는 점. 또한 시간이 충분했어도 이걸 만들 수 있을까? 라는 생각이 겹쳐 결국 외부라이브러리를 도입하여 완성하게 되었다. 회고를 하고 있는 지금도 시간을 충분히 줄테니 만들어봐. 라고 말하는 클라이언트에게 네! 라고 자신감있게 대답할 수 있을지 모르겠다.
아무튼 결과적으로는 원하는 기능을 모두 포함해서 만들게 되었으니 좋지 아니한가~
README와 데모 사이트
README
그래도 NPM 배포를 목표로 만든 DesignSystem 인데 README는 아름답게, 남부럽지 않게 작성해야하지 않을까하는 생각이 들어 팀원들에게 생각을 말하니 고맙게도 모두 동의해주었다. 이 자리를 빌어 다시 한번 표한느 감사. 아무튼 제안을 한것은 나니까 README에 대한 예시를 작성해 깃허브에 업로드하였다. 각자 맡은 부분을 작성해 주었다. 모두 작성하고 보니 나름 멋진 README가 된거 같다.
하지만 왜 그런말이 있지 않은가? "인간의 욕심은 끝이 이하 중략..."
데모사이트
다 만들고 보니 여러 DisignSystem에는 데모사이트가 있는것이 아니겠는가? 우리도 질 수 없다! 바로 데모사이트 개발에 착수했고, 모든 기능을 담지는 못했으나, 최선을 다해 만들수 있는 부분까지는 만들었다. (추후 완성하지 않을까..?) 급하게 만든것 치고는 봐줄만하다고 생각한다.
NPM 배포
npm을 사용하여 패키지를 다운로드는 받아봤지, 업로드를 해본다는 생각은 안해봤다. 인터넷을 뒤져가며, 배포하는 방법을 찾아봤다. 세상에는 좋으신 분들이 정말많았다. 그분들의 글을 참고해가며 배포를 진행했고, 오류없이 마무리되었답니다! 라는 결말이면 이 얼마나 아름다웠을까. 하지만 인생을 호락호락하지 않고 코딩이라는 세계는 큰 벽과 같았다.
우리에게 발생한 문제는 첫번째 문제는 일단 컴파일이 정상적으로 진행되지 않는 다는 점이었다. 당시에 오류를 기록한줄 알았는데, 스크린샷을 아무리 찾아봐도 없다...ㅠ 문제는 tsconfig의 설정이 부족했다는 점이었다. 우리가 원하는 경로는 ./dist 였는데 아무리 해봐도 dist 폴더가 만들어지지 않았고, 컴파일 또한 진행되지 않는 것이다. 이것저것 자료를 뒤져보니, outDir이라는 옵션을 tsconfig에 추가해 주면 된다는 것이다. 사실 저거 한줄 외에도 여러줄 추가했는데 뭐가 정답인지는 기록을 안해놨다. 난 바보인가보다. 다음부터는 꼬박꼬박 기록해두자. 아무튼 빌드도 원하는대로 진행됐고 package.json을 수정하여 테스트 배포를 진행했다. 일단 배포는 성공했는데 우리가 추가한 font, img 등 파일들이 정상적으로 추가 되지않았다. 알고 봤더니 빌드는 타입스크립트 파일만 컴파일해주고 우리가 추가한 static 파일들은 다른 명령어들을 사용해서 추가해줘야 하는 것이었다. 우리팀은 copy-files 라이브러리를 사용해 dist파일 내부로 static 파일들을 옮겨주는 방법을 선택했다. 정상적으로 모든 기능이 동작하는 것을 확인하고 대망의 0.1.0 마이너 버전을 업데이트했다.
처음해보는 배포에 많은 어려움도 있었고, 내 실력이 이거밖에 안되나 하는 절망도 느껴졌으나, 끝내 성공하고 맞이한 성취감은 그간의 부정적인 감정들을 모두 지워주었다. 이후 마이너버전의 버그들과 수정사항을 수정하고 1.0.0 정식버전을 npm에 업로드할 수 있었다.
마치며.
우리팀이 이번 프로젝트를 선택한 이유는 하나였다. 남들이 경험해보지 못한 것을 경험해보자. 그 취지를 생각한다면 우리 프로젝트는 성공했다. 남들은 겪어보지 못한 색다른 경험인 NPM배포를 해봤으니까. 이 경험은 작정하고 해봐야지! 라고 생각하지 않는 이상 경험해보지 못할 특이한 경험이었다고 생각한다.
프로젝트의 끝까지 포기하지 않고 같이해준 팀원에게 감사하며 글을 마무리하겠다. 우리 팀원들과 이 글을 보고있는 모두 원하는 일이 잘 되었으면한다.
