LearnRun
[KT AIVLE 3기] 17주차 후기 - 7차 미니 프로젝트, AIVLE DAY 본문
◈ Contents
본 게시글은 AIVLE 기자단 활동의 일환으로 작성되었습니다.
7차 미니 프로젝트 (WEB)
이전 미니프로젝트보다 조금 더 개발 시간이 모자랍니다.
하루짜리 캐글보다는 웹 서비스의 개발이 좀 더 볼륨이 크리라.. 생각합니다.
그리고 기간 대부분이 시연 및 강의, 실습이어서, 실 개발 시간은 더욱 짧았습니다.
개요
주제 : chatgpt를 통한 웹 서비스 제작
목표 : 일반 입력 및 수어 이미지를 활용한 메시지 입력을 통해 ChatGPT의 응답을 받는 서비스
프로젝트 목표
- 수어 이미지를 받아 mlflow를 통해 해당 수어가 뜻하는 알파벳을 예측, ChatGPT의 입력으로 사용
- 일반 텍스트 입력을 받아, ChatGPT의 입력으로 사용
- ChatGPT를 사용하기 위한 API 통신 구현
추가 구현 목표
- ChatGPT와의 대화 내역을 DB로 저장하고, 출력하여 디스플레이
- 스크롤 독립적인 사이드바 구현
- 이미지 업로드 폼의 동적 생성
- 이미지 업로드 이후, 이미지의 썸네일 출력을 통해 유저의 확인을 유도
- 메시지 입력 이후, 내가 입력한 메시지와 GPT의 반환 메시지를 Chat 형식으로 표현
- 이미지로써 입력된 메시지의 경우, 채팅 내역에서 어떤 이미지를 업로드했는지 확인 할 수 있도록 함.
- 메시지 입력 이후 출력된 Chat에 대해 애니메이션 스크롤을 구현, 채팅이 생겨남을 직관적으로 표현
- 메시지가 너무 많이 쌓일 것을 우려해, 날짜별 구분 서브페이지 마련
- 날짜별 메시지 카운팅
- 이미지 파일 업로드 폼 리스트뷰에서의 클릭 응답에서 재귀 문제의 해결
- 스크롤 바 삭제 (동작은 유지)
- 동적 요청에 따른 메시지 카운팅 갱신
- 저장 이미지 파일의 크롤링 방지를 위한 파일명 암호화
- 빈 폼 등 예외처리(alert)
ERD 설계
개발기간은 2일 이하..이므로,
프론트 경험이 없는 팀원이 많아 구현 목표가 생각보다 빡빡할 것 같다는 생각에 상당히 간단하게 짰습니다.
채팅 히스토리를 일별로 취합할 수 있도록 하되, 해당 히스토리별로 업로드 이미지를 묶어넣을 수 있도록 하였습니다.
각 이미지에는 수어를 예측한 결과값이 들어갈 수 있도록 하였습니다.
이미지를 직접 DB에 저장하는 것은 부하가 커서, 이미지 경로를 저장할 수 있도록 하였습니다.
팀 역할 분담
Django 백엔드야 나름 자신이 있다고 생각해서, 프론트엔드로 모든 팀원 다 보냈습니다.
프엔을 해왔던 팀원은 없었기 때문에, 팀원들에게도 개발 미션을 넘기고.. 팀과 별도로 제가 전체를 개발했습니다.
팀원들이 다 만들지 못한다면 제 코드를 쓰면 될테니, 안전하겠다는 생각이었습니다.
그러한 즉슨, 제가 맡은 것은 다음과 같습니다.
- AI 모델 제작 및 MLflow 연동
- Django 백엔드 전체
- 프론트엔드 전체
- AWS 배포
- 프론트엔드단 - 백엔드단 통신
대표적 구현
파트 : 채팅 내역
- 이미지를 통한 입력에 대한 말풍선 좌측의 픽토그램 출력
- 채팅의 질문과 응답 내역의 동적 생성
- 애니메이션 스크롤 처리를 통한 생성의 직관적 생성 (즉시 이동하면 생성 유무를 파악하기 어려우므로)
- 이미지 파트 클릭 시 예측 수어 이미지의 반환이 가능하게 했습니다.
(수어의 경우, 검출률이 높은 반면 숙련도가 떨어지기 때문에 입력했는지 볼 필요가 있다고 생각했습니다.)
- 해당 이미지 경로명/파일명을 Hash 처리하여, 정적 파일에 대한 크롤링 방지를 추가 구현하였습니다.
파트 : 사이드바
- 사이드바는 이미지 입력 파트와 기존 내역 탐색의 두 파트로 나뉩니다.
- 내역 탐색 파트는 너무 많은 메시지가 몰려 부하가 생길 것을 대비해, 날짜별로 조회할 수 있도록 나눈 기능입니다.
- 채팅 입력에 따라, 사이드바에 표시된 날짜별 카운팅도 갱신됩니다.
- 이미지 입력 파트에서는 파일 폼을 동적으로 추가할 수 있고, 업로드 된 파일의 썸네일을 생성합니다.
- 더불어, 파일명을 표시하여 내가 올린 파일이 정상적인지도 볼 수 있도록 하였습니다.
- 파일 추가 폼은 상단으로 옮겨, 연속적인 생성에도 버튼이 이동하지 않도록 개선했습니다.
결과
전체 지역 프로젝트 42팀 중에서는 4등을 차지했습니다.
상위 30% 진입에 성공해, 만점을 받았습니다..!!
부랴부랴 개발한 것 치고는 너무나 만족스러운 결과입니다.
DB로 채팅 내역을 저장한 것이 반응이 좋았고, 나름의 행운이 작용해서 달성했다는 생각입니다.
발표의 경우, 결국 제가 만들었다보니 다들 조심스러워하기에 제가 맡아 진행했습니다.
절대 발표 안할거라고 공언했지만, 생각보다 빨리 깨졌습니다. (발표.. 무섭습니다.)
평가
"이전 조가 이정돈데, 이 조에서 한번 소수점이 달라집니다. 또 벽이 있습니다."
"이 조는 XXX강사님께서 우승후보로 찍으셨던 조인데, 발표를 들으니 이해가 됩니다."
"개발하면서 고민했던 부분들이 거의 현업에서 고민할만한 부분입니다."
"경력 몇년차입니까. 그런걸 알고 고민하는 것 자체가 짬바가 있습니다."
"양민 괴롭히러 오신 것 같습니다."
"개인적으로 제가 개발자다 보니까, 디자인은 차치하고 개발은 이 조가 무조건 1등이라고 생각합니다."
"신입인데 이정도면.. 거의.. 뭐.. 일을 시키죠. 코드도 까봤는데 XXX도 있고, 잘 하셨습니다."
"하나의 채팅창에서 모든 기능이 구현되는 것이 인상적입니다. 혹시 직원 아니신지."
"그 조는 개발을 매우 잘하는 것이 맞다. 그 분은 개발을 진짜 좀 하시는 분이고. 제가 느끼기에." (이후 조 발표에서)
코딩마스터스처럼, 경쟁 속에서 피어나는 자기증명이 제겐 큰 동력이 아닌가. 생각합니다.
아이 기쁘다.
피드백
채팅을 쐈을 때, 내 응답을 우선해서 보여주고 로딩 바나 스피너를 활용하면 좋겠다. 유저의 대기에 대해 고민해볼만하다.
본 기능 또한 구현하려고 계획했지만, sqlite를 쓰는 본 서비스의 특성 상 일부 입력이 무시당하는 문제가 발생할 소지가 있다 판단해 배제했습니다. DB 적재가 없으니 GPT의 응답을 출력하지도 못하고 로딩 스피너를 영원히 돌겠구나..하고요.
만약 mariadb 등의 다중 접속을 허용하는 DB를 사용했다면, 또 멀티프로세서를 도입했다면, 또 시간이 더 있었더라면 문제 없이 구현하지 않았을까.. 생각합니다.
별도로 스스로 피드백하자면,
Lazy Loading 등을 도입하거나, 정적 이미지들을 webp로 컨버팅하여 서버 부하의 감소를 목표로 할 수도 있었겠다는 생각입니다.
그리고 전체 내역의 채팅을 불러오지 않고, 일정 수만 불러온 후 스크롤의 이동에 따라 더 이전의 내역을 로드하면 부하를 줄일 수 있겠습니다.
회고
반성 또 반성.
팀원의 학습 기회를 뺏진 않을까 노심초사.. 고민이 많았습니다.
7차 팀원이 빅 프로젝트로 그대로 이어지는 만큼, 팀원분들과 으쌰으쌰 협업 준비를 하고 싶었습니다.
그러나, 시간이 너무 촉박하고, 또 다들 처음이라 진척도가 부진해서 부득이하게 혼자 진행했습니다.
미안해요! 우리팀!
빅 프로젝트에서는 제가 별도로 만들거나 개입하지 않고.. 믿고 꼭 맡겨놓으리라 다짐했습니다.
별도로 제게 말하지 않는 이상은 요구하지 않고 간섭없이, 믿음 꽉 채워서 가보려고 합니다.
Aivle Day (2차)
에이블데이 행사는 항상 즐거워요.
수업을 안하고 다른 짓을 해서 그런지, 마음을 새로고쳐먹기에도 좋고.. 쉬는 맛 납니다.
치킨쿠폰도 나눠주는데, 일단 여기서 만족 5000배..!
자소서 컨설팅
자기소개서/이력서를 설득력 있게 작성하는 방법에 대해 배웠습니다.
이후 외부 컨설턴트 매칭도 있어서, 첨삭 받기에 매우 좋은 환경이라고 생각합니다. 미리 써두시면 좋겠어요.
자세한 강의 내용은 비공개라 더 서면을 할당하기 어려운 점이 아쉽네요. 그래도 일단 만족 대 만족입니다.
선배와의 대화
선배와의 대화.. 가 문제가 아니에요. 스펙이 너무 넘사라서 제가 너무 작아집니다. ㅠㅠ
하지만 궁금한 부분도 다소 해소되어서, 답답함이 풀렸습니다. 더 노력해야겠습니다.
미니게임
그림 그리기, 라이어게임 등 이것저것 하면서 즐겼습니다.
제가 그림 그린답시고 익명으로 알고 보드에 낙서질 잔뜩 하다가 누군지 걸렸네요..
발뺌했지만 결국 걸려서, 눈물이 찔끔 났습니다.
마치며...
이제 진짜 끝이 코 앞으로 다가왔습니다.
대망의 빅 프로젝트가 남았어요.
최선의 결과를 얻기 위해.. 달릴 일만 남았습니다.
사실 결과보다는,
모든걸 쏟아부었던 경험 자체가 매우 소중하지요.
아무튼
유종의 미를 제대로 거두러..