Let's Parking!

(Dec 2022) Let's Parking!

About

최근 테커(Techeer)라는 개발자 그룹에 속한 친구 의빈, 동현과 함께 렛츠파킹 (Let's Parking!)이라는 주차 예약 프로젝트를 진행하게 되었습니다.

회사마다 주차 예약을 하는 시스템이 다르겠지만 이 프로젝트의 경우 Google Form을 이용해 주차 신청을 넣어야 하는 것이 주요 구현 포인트였습니다.

주차할 때마다 Google Form에 들어가는 내용은 매번 같으니 이 부분은 사용자를 식별하고 사용자마다 양식에 넣을 데이터를 저장해뒀다가 날짜마다 신청을 누를 때마다 주차 예약을 할 수 있도록 하였습니다.

이 과정에서 Google Form 입력을 자동화할 수 있도록 Selenium을 이용하도록 하고, 이 작업을 주기적으로 돌리기 위해 Spring Batch를 활용하기로 했습니다.

프로젝트 진행 기간은 2022-12-16 ~ 2022-12-26으로, 약 열 흘 가량입니다.

Splitting Up Tasks

같은 부분의 코드를 동시에 개발하고 변경하게 되면 아무래도 버전 관리 측면에서 매끄럽지 않게 진행될 거라 판단하여 팀원과 역할 분담을 하는 것도 중요했는데요. 사실 규모가 많이 큰(?) 프로젝트는 아니라서 3명이서 역할을 나누기엔 적합했다고 생각합니다.

각각 맡은 파트는 다음과 같습니다.

김의빈: Back End, Infrastructure
장동현: Front End
이승준(나): Back End

이 중에 저는 OAuth 구글 로그인 기능과 API 개발을 담당했습니다.

Project Architecture

상단의 다이어그램은 프로젝트 아키텍처입니다. (의빈이가 수고해주었어요.)

백엔드로 Spring MVC와 ORM인 Spring Data JPA를 사용했으며, 인증에는 Spring Security를, 주차 예약 및 배치 태스크 스케줄링에는 Spring Batch, Quartz와 Selenium을 이용했습니다.

Sequence Diagram

Sequence diagram을 통해 전반적인 앱의 흐름을 구조화해보도록 했습니다. (마찬가지로 의빈이가 수고해주었어요.)

로그인 후 주차 양식을 만들고, 만든 주차 양식을 이용해 주차 신청할 날짜를 고르면 배치 스케줄링이 되어 주차 예약이 되는 시스템입니다.

OAuth

Kakao, Naver 등 다른 소셜 로그인은 괜찮지만 무엇보다 Google 로그인을 지원해야 해서 Spring Security를 이용해 Google 로그인을 지원하기로 했습니다.

이전에도 프로젝트를 몇 번 진행하면서 Spring Security를 이용한 OAuth 인증을 구현하곤 했지만 구현할 때마다 항상 어떻게 했는지 까먹게 되곤 했습니다. 로그인/인증이 아무래도 한 번 구현해두면 그 뒤로는 다른 기능보다 많이 건드리지는 않게 되어서 그런 듯 합니다.

매번 구글링하면서 같은 내용을 찾을 바에는 차라리 여기에 문서를 남겨서 다음에 구현할 때도 참고하기 위해 Google OAuth Setup 페이지를 따로 분리하여 정리하였습니다.

Email Domain Filtering

또한, 사내에서만 사용하는 프로젝트이다보니 특정 이메일 도메인을 제외하고는 가입/인증을 금지해야 했습니다.

개발 단계에서 초안으로 넣은 부분이기도 하고 이해를 위해 코드를 바꿔서 지금과는 코드가 상이합니다. 코드의 질이 높지 않더라도 양해 바랍니다. 😅

public abstract class AuthorizedEmailDomains {

    abstract List<String> getAuthorizedDomains();

    public boolean isAuthorizedEmail(String email) {
        String domain = email.substring(email.indexOf("@") + 1);
        for (String authorizedDomain : getAuthorizedDomains()) {
            if (authorizedDomain.contains(domain)) {
                return true;
            }
        }
        return false;
    }
}

@Component
public class AuthorizedLitsynpEmailDomains extends AuthorizedEmailDomains {

    private final List<String> authorizedDomains = List.of(
            "litsynp.com"
    );

    @Override
    List<String> getAuthorizedDomains() {
        return authorizedDomains;
    }
}

AuthorizedEmailDomains 이라는 이메일로부터 도메인을 추출해 필터링할 수 있는 인터페이스를 만들고, AuthorizedLitsynpEmailDomains (예시)와 같은 컴포넌트를 구현하였습니다. 이제 이 구현체를 인증이 필요한 곳에서 DI를 통해 주입하여 이메일의 도메인이 @litsynp.com 일 때만 인증에 성공하도록 만들었습니다.

좀 더 확장성을 높이자면 STRATEGY PATTERN 등의 디자인패턴을 활용해 strict한 domain matching 방식이 아닌 다른 인증 알고리즘을 사용할 수 있도록 할 수도 있겠네요.

물론 DB나 OAuth 앱 쪽에서 관리하는 방법도 있겠지만 일단 가장 빠르게 구현할 수 있는 방법으로 소스 코드 쪽에서 막는 방식을 택했습니다.

Collaboration

프로젝트는 항상 처음에 구상 단계에서 떠올렸던 크기보다 항상 커지더라구요. 렛츠파킹도 마찬가지로 생각보다 볼륨이 커지게 되었습니다. 실 개발은 사실 일주일 남짓인데 PR도 32개가 머지가 되었네요.

Final Product

아직 1차 배포이긴 하지만 결과물은 다음과 같습니다. 예쁘게 프론트를 디자인해준 동현이에게 박수를... 👏

But there's still a room for an improvement...

위에서 언급했던 부분 외에도 조금 더 개선할 부분이 있곤 합니다. 아무래도 빠르게 MVP를 만드는 것이 목적이었기 때문에 리팩토링이나 API 에러핸들링에서 미흡한 부분이 있습니다.

이 부분은 실 사용자분들의 QA 진행 후 진행하는 게 좋을 것 같다고 생각합니다. 👍

My Thoughts

제 인생의 멘토이신 Palo Alto Networks의 Andrew 멘토님께서 말씀하시길, 인간 관계에서 'fit'이라는 것이 굉장히 중요하고, 사람마다 'fit'이 맞는 사람들이 모두 다르다고 합니다.

'fit'이 완벽히 맞는 사람을 만나는 것이 쉬운 세상은 아니라고 생각했습니다. 마음이 맞더라도 프로젝트 진행이 잘 되는 건 별개의 일이 되기도 하구요.

그런데 운좋게 이번에 마음도 잘 맞고 실력도 좋은 친구들과 함께 프로젝트 진행을 할 수 있어서 매우 즐거웠습니다.

다음에도 재밌는 프로젝트 많이 만들 수 있으면 좋겠어요!

REF

Teammates

PreviousProjects Next맛집몬스터 (JMT Monster)

Last updated 20 days ago