Project 1. Marketkurly clone | 프로젝트 후기

Project overview

지난 한 달동안 배운 내용을 토대로 진짜 웹사이트를 클론해보는 첫 번째 프로젝트. 마켓컬리는 데이터가 많긴 하지만 레이아웃이나 내용이 지금까지 배운 내용을 적용해서 연습해볼 수 있는 웹사이트인 것 같았다. 그래서 프로젝트에서 하고 싶다고 발표 했었는데 원하는 웹사이트 클론을 할 수 있게되어 다행이었다.
처음으로 진행하는 프로젝트라 설레는 마음 반, 아직 한참 부족한데 팀원들한테 괜히 피해를 주는건 아닐까 두려운 마음 반으로 시작했지만 정말 좋은 팀원들을 만나 2주 동안 너무 즐거운 시간을 보냈고 잘 마무리 할 수 있었던 프로젝트였다.

💻️ 프로젝트 소개

식자재 온라인 쇼핑몰 마켓컬리(Market Kurly) 클론 프로젝트.
백엔드 3명, 프론트엔드 4명, 총 7명이 한팀이 되어 진행되었다.
마켓불리 백엔드 GitHub

🍆️ 프로젝트 기간

2020. 12. 14 ~ 2020. 12. 24 (총 11일)

🍆️ 기술스택

👨‍👨‍👧‍👦️ Front-End

• HTML/CSS/JavaScript
• React(CRA)
• Sass

👨‍👨‍👧️ Back-End

• Python
• Django
• CORS Header
• Bcrypt
• PyJWT
• MySQL
• AqueryTool (데이터베이스 모델링)

협업도구

• Git/GitHub
• slack (비대면 소통)
• Trello (일정관리 및 작업현황 공유)
• Notion (팀 내 개발 자료 공유, 규칙, 안건 등 기록)

🙋‍♀️️ 내가 구현한 기능

🍆️ 회원가입 엔드포인트

westagram 프로젝트 시 이미 회원가입 및 로그인 기능 구현을 한번 해봤었기 때문에 이번 프로젝트에서 회원가입을 다시 하게 됐을 때 사실 조금 만만하게 봤다. 하지만 이메일, 비밀번호만 있었던 westagram과는 달리 마켓컬리는 사용자에게 요구하는 정보가 많았고, 중복확인, 주소지와 연동 등 추가적으로 구현해야 하는 사항이 있어 어렵게 느껴졌다. 특히 아이디, 비밀번호 조건이 까다롭고 이메일, 휴대폰번호까지 정규표현식을 이용해 구현을 해서 이 부분에서 시간을 제일 많이 잡아먹었다.

기억하고 싶은 코드

User, Address 두 개의 객체를 동시에 생성하기 위해 User 객체를 user_model 변수에 담고 Address 객체와 연동. 오류 발생 시 User 정보 저장 방지를 위해 transaction 기능 이용
상세 내용은 회원가입 엔드포인트 구현 포스트 참조

with transaction.atomic():   
	user_model = User(
    		account             = data['account'],
            	password            = hashed_pw,
                name                = data['name'],
                email               = data['email'],
                phone_number        = data['phone_number'],
                gender_id           = data['gender_id'],
                birth_date          = birth_date,
                recommender         = recommender,
                event_name          = event_name,
                grade_id            = 1,
                terms_and_condition = TermsAndCondition(id=1),
                mileage             = 0
                )

         user_model.save()

         Address(
                name      = data['address'],
                user_id   = user_model.id,
                is_active = True
                ).save()
              
         return JsonResponse({"message":"SUCCESS"}, status=201)

🍆️ 로그인 엔드포인트 및 로그인 인증(토큰) 데코레이터

로그인 코드는 비교적 간단하기 때문에 금방 구현했다. westagram 로그인 구현 시 토큰 발행은 했지만 데코레이터는 만들지 않았었다. 그래서 데코레이터 구현을 위해 중첩함수에 대해서 좀 더 심도있게 공부하고 토큰에 대해서 한번 더 이해할 수 있는 시간을 가져 좀 더 업그레이드가 된 느낌

기억하고 싶은 코드

로그인(JWT) 데코레이터.
상세 내용은 로그인 엔드포인트 & JWT 데코레이터 포스트 참조

def signin_decorator(func):
    def wrapper(self, request, *args, **kwargs): 

        access_token    = request.headers.get("Authorization", None)  

        if "Authorization" ==  None:
            return JsonResponse({"message":"INVALID_LOGIN"}, status=401)
        
        try:
            token_payload   = jwt.decode(access_token, SECRET_KEY, ALGORITHM)
            user            = User.objects.get(account=token_payload['id']) 
            request.user    = user

            return func(self, request, *args, **kwargs)

        except jwt.ExpiredSignatureError:
            return JsonResponse({"message":"EXPIRED_TOKEN"}, status=401) 

        except jwt.DecodeError: 
            return JsonResponse({"message":"INVALID_TOKEN"}, status=401) 

        except User.DoesNotExist:
            return JsonResponse({"message":"INVALID_USER"}, status=401) 
       
        except jwt.InvalidTokenError:
            return JsonResponse({"message":"NEED_LOGIN"}, status=401)

    return wrapper

👫️ 팀워크

위코드에 들어와서 처음하는 팀 프로젝트, 각 팀은 5-7명으로 구성되었는데 우리 팀은 인원수가 가장 많은 7명이었다. 누군가는 인원이 많아 걱정이라고 했지만 걱정이 무색하게 너무나도 이상적이고 완벽한 팀이었고 위코드 온 이후로 제일 즐거운 하루하루를 보냈던 것 같다.

🍆️ 소통을 위한 노력

• 저녁은 다 같이 먹기. 프론트엔드와 백엔드 간 소통과 친목도모를 위해 저녁은 무조건 같이 먹자는 규칙을 정했다. 덕분에 프로젝트 2-3일차 쯤? 삼겹살에 소주 한 잔 하면서 어색했던 프론트엔드 인원들과 급 친해질 수 있었다😆️
• 매일 아침 9시 반 스탠드업 미팅. 공식적인 스탠드업 미팅은 11시반이었지만 우리 팀은 다들 일찍 출근했기 때문에 9시반에 미팅을 진행했다. 이 시간에 프론트엔드와 백엔드 간 서로의 진행상황과 이슈를 공유해서 소통을 원활히 할 수 있었다.
• Trello. Trello를 활용하여 개인별 상세 진행 상황을 공유했다. 각자의 역할, 진행중인 작업, 마친 작업 등을 Trello를 이용하여 파악할 수 있었다.

소통이 잘 되고 팀원 간 합이 잘 맞다 보니 온전히 개발에만 집중할 수 있는 환경이 자연스럽게 만들어졌다. 팀원 간 사소한 갈등이라도 있었다면 개발에만 집중하기도 벅찬 그 시간 동안 불필요한 감정소모와 시간낭비를 할 수도 있었을텐데 감사하게도 우린 온전히 개발에만 집중할 수 있었다. 마음맞는 팀원들을 만나 트러블 한 번 없이 프로젝트를 무사히 마칠 수 있어 정말 감사하고 또 감사하다.

🍆️ 함께한 팀원들 이야기

PM으로서 키를 잡고 마켓불리라는 팀의 방향성을 잘 잡아준 원희님, 실력뿐만 아니라 리더십도 최고였다고 말할 수 있다.
밤 늦게까지 불코딩하며 매일 같이 노래부르고 프로젝트 기간 내내 즐겁게 보내는데 일조한 폭곰 주형님,
맡은 역할 제대로 해내겠다며 프로젝트 시작 전까지 밤새 React 공부하고 묵묵히 제 역할을 해내려고 고군분투한 우리 민아님,
팀 내 막내 역할을 톡톡히 수행하고 우리 팀 분위기를 담당한 채훈님, 2차 프로젝트도 잘 부탁합니다 (날 비록 PTSD의 그녀라고 기억했지만.... 당신은 나에게서 벗어날 수 없다😏️😏️)
채훈님과 톰과 제리처럼 매일 투닥 거렸지만 코딩 실력과 설명해주는 능력만큼은 프론트엔드 누구도 따라갈 수 없었던 기가장현님,
그리고 피자파티에서 위코드 등록 썰로 모두를 즐겁게 했던 찬영님까지,

🍆️ 마무리

평일, 주말을 막론하고 아침 일찍부터 새벽까지 서로 의지하면서 열심히 했던 팀원들이 하나 둘씩 떠나고 난 뒤 괜히 주형님한테 디엠을 보내 아쉬운 마음을 토로했다. 채훈님 옆에서 최고의 티키타카를 보여주었던 장현님까지 자리를 정리하고 새로운 보금자리로 떠난 오늘, 마음이 헛헛하고 눈물도 날 것 같고 아쉬운 마음이 가득하다.
하지만 운이 좋게 PM이었던 원희님과 채훈님과 2차 프로젝트도 함께 하게 되었다. 새로운 팀원들과 2차 프로젝트도 함께 즐거운 시간이 되길, 함께 성장하고 발전하는 프로젝트로 만들어 가길 기대한다💕️