4 minute read

5주간의 나만의 무기 준비하기가 끝났다

둘째주.

주제와 프레임워크가 모두 정해졌다. 2일 정도 flutter 를 공부하는 시간을 가지기로 했다. 평소 자주 봤던 유튜버인 애플코딩의 강의를 들었는데 멀리서 봤을떄는 자바스크립트랑 비슷하다고 착각했는데 자세히 보니 Java랑 비슷했다.

crud 기본 예제를 진행했다. 그렇게 어렵진 않았다. 필요한 화면 위주로 만들다가, 필요에 따라서 더 폴더링 하면 된다는 내용이 있긴 했지만 다만 폴더 구조 관련해서 강의에서 많이 다루지 않았다.

기존에 토이프로젝트를 했을 때 폴더 구조를 처음에 잡지않고 중간에 분류해서 고생을 많이했다. 그래서 이번에는 프로젝트 초반에 잡고 가고 싶었다. 깔끔하게 폴더링만 잘 되어도 코드가 어느정도 정리될것이라 생각했다.

이 내용 관련해서 팀원들과 이야기 하다가 NVVM 패턴을 적용하기로 했다. 우리 프로젝트의 멘토님께서 추천해주시기도 했다.

nvvm 패턴을 사용하려면 model, view, viewmodel 3가지 요소로 나눠서 코드를 작성해야 한다. model 에서는 데이터와 비지니스 로직을 처리했다. 클래스 객체를 선언하고 어떤 타입의 무슨 요소가 들어갈것인가, 어떤것이 필수값인가. json으로 변환할때 사용되는 함수 등,

view에서는 사용자에게 보여지는 위젯이 그려지는 부분이었다.

viewmodel 에서는 model 과 view 를 연결시키는 역할을 한다. 우리는 여기서 api 를 받아오는 부분을 구현했다. ChangeNotifier 클래스를 상속받아 구현했는데, ChangeNotifier 는 viewmodel 에서 데이터가 변경되었을떄 view 에게 알려주는 역할을 한다.

이렇게 크게 3가지로 분류해서 폴더링을 하기로 했고 각 화면별 ex) myroom, groupTodo, myPage 등으로 세부 폴더링을 해서 나누기로 했다.

일단 역할에 따라서 코드를 나누게 되서… 그거는 좋았다. 관심사 분리 측면에서 코드 가독성도 올라갔다. 그리고 어플리케이션 특성상 상태가 자주 업데이트 되고, 그 업데이트 된 상태를 바로바로 화면에 보여줘야 했는데 이부분에서 효율적이라고 느꼈다. 하지만 일부 단점도 겪었는데 일단 코드량이 늘어난것이다. 일단 api 한번 받아오는데 여러 단계를 거쳐야 하다보니 조금 복잡하게 느껴질때도 있었다.

mvvm 패턴을 적용하지 않았더라면 한두 단계에서 끝났을텐데…ㅠㅠ flutter 를 팀원 모두가 처음 학습하는 단계였고 팀원모두가 개발속도가 나지 않은 상태였다. 일단 나는 react 로 개발하던 속도만큼 flutter 개발이 안되니까 초반에 답답했다. 사실 당연한것이었지만… 개발기간이 4주밖에 안되는데 일단 아이디어 결정도 다른팀보다 몇일 늦었을 뿐더러 ( rewind 를 포기하기 위한 시간.. ), 다른팀은 이미 프레임워크 주차에 배웠던 react 로 개발해서 우리처럼 flutter 를 추가로 공부할 필요가 없기 떄문에 좀더 조바심이 낫다.

게다가 flutter 언어인 dart는 type 에 굉장히 엄격한 언어여서 코드 한줄한줄 칠때마다 여러 에러로 날 괴롭혔다. 화면이 너무 붉은색으로 바뀌어서 마치 피바다를 연상시켰다😱 마치 타입스크립트를 처음 적용했을때의 당혹감. 그리고 camel case 를 쓰지않아서 등 약간은 낯선 이유로 lint error 까지 발생해서 노란줄 에러로 날 괴롭게 만들었다…ㅎ

거기에 플러스 mvvm 패턴…까지… api 하나 받아오는데 두 세시간씩 코드를 치고 있자니 그냥 잘 알고있던 react 로 했었어야 했나, 라는 생각이 한번씩 들었다. 하지만 이제와서 언어를 바꿀 수는 없었다. 돌아가기엔 너무 늦었다. 나도 잘 알고 있었기에 그냥 앞만 보고 가는 수밖에 없었다.

이미지

Updated:

Leave a comment