본 포스팅은 패스트캠퍼스 환급 챌린지 참여를 위해 작성하였습니다
패스트캠퍼스 환급챌린지란?
(~6/20) 50일의 기적 AI 환급반💫 | 패스트캠퍼스
초간단 미션! 하루 20분 공부하고 수강료 전액 환급에 AI 스킬 장착까지!
fastcampus.co.kr
https://fastcampus.info/4n8ztzq
매복사랑니에 있던게 단순하게 실밥인걸 알고 재미있게 강의를 들을 수 있게 해주는 환급챌린지 최공!
29일차 공부 시작!
오늘의 강의 주제는 '로그인-앱 설계'이다.
(오늘도 마찬가지로 모자이크 처리..)
오늘의 학습 내용
- 로그인 앱 설계와 네트워크 연동 구조 -
* 네트워크 연동: 동시에 여러 API 호출하기
사용자가 아이디와 비밀번호를 입력해 로그인하면 데모 서버로 로그인 정보가 전송된다. 이때 단순 로그인 절차로 끝나는 것이 아니라, 서버로부터 사용자 정보를 받아온 후 추가적으로 프로필 정보와 작성 게시글 목록 등 여러 API를 연속해서 동시에 호출한다. 이런 구조에서는 네트워크 상태에 따라 서버가 응답을 랜덤하게 성공 또는 실패로 반환할 수 있다. 따라서 각 API의 결과를 효율적으로 취합하고 실패 케이스를 잘 처리하는 코드 구조가 중요하다.
여러 API를 병렬로 호출할 때는 비동기 네트워크 요청과 응답 처리에 대한 패턴을 이해해야 한다. 예를 들어 Promise.all이나 async/await 같은 비동기 처리구문을 사용해 동일 사용자 인터랙션에서 여러 요청을 한 번에 처리하고, 실패 상황을 gracefully 다루는 구조가 필요하다. 각각의 API 응답에 따라 다음 플로우로 전환하는 시점과, 오류 발생 시 사용자에게 안내하는 UI 처리도 신경 써야 한다.
* UI 처리의 구조적 개선
회원가입 폼 예제에서와 같이 여러 UI 컴포넌트가 공통적으로 가지는 기능(유효성 검사, 렌더링, 템플릿 처리 등)이 있다. UI 클래스가 많아질수록 이런 공통 기능이 중복되기 쉬운데, 이 부분을 구조적으로 개선하는 것이 중요하다.
중복되는 UI 처리기는 별도의 부모 클래스로 분리하거나, 공통 유틸리티로 만들어 재사용할 수 있도록 한다. 예를 들어 입력값 유효성 검증과 같은 함수는 한 곳에서 관리돼야 추후 유지보수가 용이하다. 또한 각 UI 컴포넌트가 Template Method 패턴 같은 디자인 패턴을 채택하면, 기본 동작을 정의하고 개별 특성은 하위 클래스에서 오버라이드할 수 있어 구조가 한결 깔끔해진다.
* 개발 관점에서의 확장성
네트워크 부분에서는 RESTful API 확장, 추후 인증 방식 변화, 그리고 스케일러블한 에러 핸들링 구조 설계도 고려해야 한다. UI 처리 부분은 UI 컴포넌트가 점차 늘어나더라도 중복 없이 관리할 수 있도록 컴포넌트화와 코드 모듈화를 신경 써야 한다.
또한 실제 서비스에 API 호출이 추가될 때마다 중복된 코드가 생기지 않도록 구조를 단단히 잡아두는 것이 중요하다. 이 때 SOLID 원칙 중 중복 제거, 책임 분리 원칙을 염두에 두면 유지보수성이 크게 향상된다.
마치며
오늘도 환급 챌린지 31강 공부 완료!!
이번 강의에서는 로그인 앱에서 여러 개의 API를 연동하고 관리하는 구조를 설계하는 것을 다뤘다.
이후에 실제 회원 인증보다 시뮬레이션 및 구조 이해에 초점을 두고 여러 API를 효과적으로 다루는 방법을 실습한다고 한다. 실제 로그인 처리를 하면서 동시에 호출하는 API들이 많은데 도움이 될 것 같다.