본문 바로가기
# Activities/멋쟁이사자처럼

[멋쟁이사자처럼 at SCH 9th] 두 번째 자체 해커톤 - 무쓸모톤[ㅁㅆㅁㅌ]

by Jiy0ung 2021. 8. 3.

👩🏻‍💻[ㅁㅆㅁㅌ] 프로젝트👩🏻‍💻


이번에 두 번째 자체 해커톤이자 제1회 무쓸모톤 프로젝트를 진행했다ㅎㅎ

사실 나는 아직까지 백엔드 & 프론트엔드 둘다 좋고, 어떤 파트가 나에게 잘 맞는지 모르겠다ㅠㅠ

그래서 다양한 파트를 도전해보기 위해 이번에는 백엔드 파트에 지원했었다! 하지만....

지원자가 너무많아서 사다리타기 했는데 프론트엔드로 결정됐다!!!😥🥰(좋은데 슬프다...)

어떤 파트에서도 열심히 해서 내 역량을 높이고싶다!!! 화이팅...ㅎㅎ

 

그래서 이번 프로젝트 주제는!!!!

"세상 쓸모없는 서비스 만들기" 

그리고... 이번에도 팀장이 되었다!!

 

👨‍👨‍👧‍👧프로젝트 진행과 배포👨‍👨‍👧‍👧


2021.07.16~2021.07.30 (14일)의 기간동안 코로나가 심해졌기 때문에 비대면으로 진행하였다!

우리팀은 노션과 단톡방&디스코드를 통해 의견과 자료를 주고받고 깃을 이용해 협업을 하였다.

 

제일 먼저 서로의 서비스 아이디어를 발표하고난 후 한 사람당 3표씩 투표하여 결정하게 되었다!

사람마다 너무 좋고, 개성있는 아이디어가 많이 나왔다 ㅎㅎㅎ

 

 

 

이렇게 투표로 '우리집 쓸모없는 물건 자랑' 아이디어가 선정되었다!!!

서비스명은 TV프로그램 중 "진품명품"이라는 프로그램 명과 비슷하게 [찐품명품] 이라고 결정하였다ㅎㅎ

 

개발 진행 전, 우리는 필요한 기능에 대한 회의와 공통적으로 확인하기 쉽고 보기 좋게 커밋&PR형식을 통일 시켰고 서로의 진행상태를 확인 할 수 있도록 노션에 진행리스트를 추가하였다.

 

이후, 백엔드를 맡은 예빈이와 현오빠는 UML을 작성하였고, 프론트엔드를 맡은 나와 연희가 로고, 웹 UI, 무드보드를 작성하고 나서 개발에 시작하였다.

 

이 프로젝트 관련하여 작성한 내용은 링크(notion-link 또는 github-link)를 클릭하면 볼 수 있다.

 

[✨찐품명품✨이란?]

"우리 집 찐보물(쓸모없는 물건)💍들을 자랑하고 가치를 측정하는 웹 사이트"이다. 

간단하게 풀어서 설명을 하자면, 우리집에 쓸모없는 물건을 자랑하고 가치 평가를 받을 수 있는,

정말 왜 있는지 모르겠고 쓸모없는 서비스다...

 

메인화면에서는 조회수가 높은 글을 앞에 보여주어 실시간 인기 보물을 나타내주었다.

로그인을 한 상태에서만 보물 등록, 댓글달기, 가치측정이 가능하고, 글과 댓글은 글쓴이만 수정할 수 있다ㅎㅎ

 

우리 팀원들은 열심히만 하는게 아니라 잘하기까지 한다...

배포를 하고싶었는데 시간이 부족하여 못할 줄 알았다. 하지만 아주 그냥 배포까지 성공했다!!!!!

배포는 소규모 애플리케이션을 위한 무료 서비스를 제공하는 'pythonanywhere'를 사용하였다.

 

 

찐품명품 사이트 주소

http://hyun1011.pythonanywhere.com/JmApp/

 

메인 화면
실시간 인기 보물
보물 디테일페이지
댓글

 

[찐품명품 무드보드]

로고는 진지한 느낌을 주고자 검정에 클래식하게 만들었다ㅎㅎ😊

 

[개발 중 마주한 문제들과 해결 방법]

1. git 충돌

 우리 팀은 틈틈히 서로의 진행 상황을 체크하고, 피드백을 주고 받으면서 생각보다 빠른 진행을 해오고 있었는데... 충돌을 마주했다....

프로젝트 생성 시 '.gitignore' 파일을 나중에 생성했는데 '__pycache__' 파일이 인식을 하지 못하면서 발생한 충돌이었다.

그래서 각 앱에있는 '__pycache__'을 삭제 후, 다시 merge - git clone - pull - push 순으로 진행 하면서 충돌을 해결할 수 있었다.

 

앞으로는 이런 충돌이 발생하지 않도록 gitignore파일을 미리 생성해야겠다...

 

2. css가 적용되지 않는 문제

css를 수정했을 때 갑자기 적용이 되지 않았다.

에러 메세지가 뜬 것도 아니였기 때문에 코드를 다시 점검 해보아도 문제점을 찾을 수 없어 구글링을 해보았다.

구글링 결과 크롬 브라우저에서 캐시를 삭제한 후, 서버를 실행 해보면 css가 적용된 것을 알 수 있었다!

브라우저가 저장해논 캐시를 사용하기 때문에 그전에 내용이 그대로 보이는 경우가 많다고 한다.

 

3. csrf_token 오류

가치 측정을 할 때 ajax를 이용했는데 이 과정에서 csrf_token에서 지속되는 오류를 마주했다.

이 문제점의 해결 방안은 현 오빠가 잘 정리해놓은 이 링크를 참고하면 될 것 같다.

 

마무리


처음으로 배포까지 끝낸 프로젝트라 그런지 너무 뿌듯했다. 도움을 많이 못준 팀장이었지만 다들 너무 잘해주셔서 감사했다... 모두들 짱이였어요 ㅠㅠ 장고를 처음 배운게 엊그제 같은데 벌써 계획한 프로젝트도 만들었다니... 나 많이 컸다...ㅎㅎ

 

이번 프로젝트가 잘 마무리 된 덕분에 K-해커톤 본선 준비를 열심히 달릴 수 있게 되었다ㅎㅎ

방학이 끝나기 전, 간단한 토이 프로젝트를 하나라도 더 해 볼 계획이다 ㅎㅎ

이제는 정기 세션이 끝나서 스터디를 진행하기 때문에, 열심히 공부해볼 생각이다!!!

앞으로 더 열심히 해서 더 성장할 수 있길🥰