Ticket Booking app - UiLover Android 클론코딩 회고

https://www.youtube.com/watch?v=9aoUe0gPljY

Ticket Booking app을 클론 코딩해 보았습니다.

 

사용 기술스택

구분	원본	리펙토링
UI	xml	xml
디자인패턴	MVC	MVVM
아키텍처 패턴	패키징	클린아키텍처
DI	없음	Hilt
통신	Firebase RealtimeDatabase	Firebase RealtimeDatabase
이미지 로딩	glide	glide
오픈소스 라이브러리	chip-navigation-bar(ismaeldivita),BlurView(Dimezis)	chip-navigation-bar(ismaeldivita),BlurView(Dimezis)

 

과정

해당 프로젝트는 유튜버분이 단순 화면만 구현하기 위해서 그런지 유지보수를 도와주는 컨벤션이라든가 deprecated 된 함수를 쓴다든가 Activity에 모든 코드가 몰려있는 MVC구조의 앱이었습니다.  

유튜브에서의 구조

컨벤션이 지켜지 않음 , 프로퍼티는 variable로 되있음

adapter에서 context를 저장

함수이름의 첫글자가 대문자...

 

그래서 저는 해당코드를 리펙토링을 하여 멀티모듈 클린아키텍처구조와 MVVM 디자인페턴을 적용하면 좋겠다고 생각하였습니다. 이런 과정으로 클린아키텍처나 리펙토링에 관련된 이해가 늘어나고 UI구현관련해서도 deprecated 되어서 함수를 최신지원하는 함수로 변형하면서 왜 deprecated 되었는지를 확인하며 개발자로의 성장을 기대하였습니다.

 

처음에는 앱을 클론코딩한 후 해당앱의 구조를 각레이어 모듈로 나누어 개발하였습니다.

커스텀

 

 

결과물

https://github.com/PotatoMeme/Android-UI-Test/tree/dev/screen/ticket-booking-app

Android-UI-Test/screen/ticket-booking-app at dev · PotatoMeme/Android-UI-Test

 

 

느낀 점

 

해당프로젝트는 저번의 플랜핏과는 다른 게 원본소스를 볼 수 있는 상태에서 개발을 하였습니다. 이번 리팩토링 과정에서 가장 크게 느낀 점은 코드 컨벤션의 중요성이었습니다. 원본 소스는 컨벤션이 제대로 지켜지지 않아 코드의 가독성과 유지보수성이 떨어졌습니다. 특히, 변수 선언이나 함수 네이밍에서도 일관성이 없었고, deprecated 된 함수들이 많아 이를 최신 함수로 변환하는 과정에서 왜 이러한 함수들이 더 이상 사용되지 않는지에 대해 깊이 있게 학습할 수 있었습니다.

리팩토링을 통해 클린아키텍처로 전환하면서, 코드를 좀 더 구조화하고 역할을 명확히 분리하는 작업을 진행했습니다. 멀티모듈 클린 아키텍처를 적용하면서 레이어 간의 의존성을 줄여, 유지보수가 용이한 구조를 만들 수 있었습니다.

 또한, ViewModel을 도입하여 adapter에 있던 데이터들을 ViewModel로 가져와 데이터를 관리하였고 해당과정에서 ListAdapter의 장점뿐만아니라 RecyclerView.Adapter를 이용하여 소규모의 변화를 빠르게 관리하고 통제하여 더 좋은  ux를 제공할수 있었습니다.