Skip to content
@team8901

우학동: 동아리 관리 자동화 SaaS

귀찮았던 동아리 관리, 저희가 대신 해드릴게요!

📌 우학동: 동아리 관리 자동화 SaaS

GitHub READM md 메인 이미지


🔥 프로젝트 개요

'우학동'은 동아리 임원진을 대상으로 동아리 관리의 불편함을 간단하게 만들어주는 SaaS입니다. 실제로 팀원 중 한 명은 여러 동아리의 임원진을 경험해보았고, 매년 반복되는 동아리 관리에 대해 불편함을 느껴 해당 서비스를 기획하게 되었습니다. 저희가 생각해낸 $\bf{\color{#E53935}동아리\ 관리의\ 불편함}$은 다음과 같습니다.


1. 복잡한 동아리 신규 회원 등록 절차

대다수의 임원진은 신규 회원을 등록하기 위해 5단계의 절차를 수행합니다.

  • 구글 폼 생성
  • 구글 폼 배포
  • 동아리 회비 계좌 내역 확인
  • 동아리 회비 납부 회원 확인
  • 카카오톡 단체 채팅방 초대

이러한 5단계의 절차는 매 학기 신규 회원을 등록하기 위해 이루어집니다. 이 과정에서 많은 시간이 발생하며, 학업을 병행해야 하는 임원진의 입장에서 복잡한 신규 회원 등록 절차는 부담으로 이어질 수 있습니다.


2. 귀찮은 동아리 물품 관리 및 대여

각 동아리는 회비를 사용하여 운영에 필요한 동아리 물품을 구매합니다. 이때 물품 관리 체계가 잘 잡혀 있지 않은 동아리는 물품을 관리하기 위해서는 동아리 물품 종이에 수기로 작성하여 관리하거나, 엑셀, 노션 등을 이용해 직접 관리합니다. 만약 회원이 물품을 대여•반납을 희망하고자 할 때도 수기로 직접 대여•반납 상황을 업데이트해야 합니다.

만약 수기로 물품을 관리하는 경우에는 동아리의 모든 인원은 실시간으로 물품 현황을 알 수 없습니다. 그렇기에 물품 대여•반납 과정을 카카오톡으로 연락을 직접 주고받으며 이루어집니다. 이는 물품을 관리하는 임원진, 물품을 대여•반납하는 회원 양측 모두에게 귀찮은 과정입니다.


3. 불투명한 회비 사용 내역 및 일정 공유

각 대학교의 동아리들은 보통 회비를 엑셀에 기록하며, 동아리 연합회에 회비 사용 내역을 제출하여 감사를 받을 의무가 있습니다. 하지만 회비 사용 내역에 대해서는 동아리 임원진과 연합회에서만 파악이 가능하고, 일반 회원의 경우 회비 사용 내역에 대해 대부분 알 수 없습니다. 이러한 회비 사용 내역의 불투명성은 임원진과 회원 간의 오해와 갈등이 빚어질 수 있습니다.

그리고 현재 대부분의 동아리는 카카오톡 단체 채팅방을 통해 일정 및 공지를 전파하고 있습니다. 하지만 단체 채팅방의 특성상 일정 및 공지를 새로 채팅방에 입장하는 신규 회원은 쉽게 확인하기 어렵습니다. 또 채팅이 쌓이는 단체 채팅방의 내용을 잘 확인하지 않는 회원도 많이 존재합니다.

이러한 특성 때문에 임원진은 새롭게 일정 및 공지를 전파해야 하는 번거로움이 따르게 됩니다.


🚀 프로젝트 설명

이에 저희는 아래와 같은 슬로건을 가지고 $\bf{\color{#1A74E8}동아리\ 관리의\ 불편함을\ 해결}$하고자 했습니다.


$\large{귀찮았던\ 동아리\ 관리,\ 저희가\ 대신\ 해\ 드릴게요!}$


1. 신규 회원 등록 자동화

신규 회원의 회비 납부 이후 임원진이 직접 수행했던 3가지 작업을 자동화하여, 5단계였던 신규 회원 등록 절차를 2단계로 간소화합니다.

  • '우학동'을 이용한 동아리 신규 등록
  • '우학동'이 제공하는 동아리 전용 페이지 URL 및 QR 코드 배포

'우학동'이 제공하는 URL 및 QR 코드를 배포하기만 하면 동아리 신규 가입 희망자는 제공받은 URL로 이동하여 학교 구글 계정으로 로그인하고, 간단한 인적 사항을 작성하여 우학동에 회원 가입합니다. 이후 회비 납부 버튼을 통해 카카오페이로 회비를 납부하면 동아리 가입이 완료됩니다.

임원진은 기존에 5단계였던 신규 회원 등록 절차를 2단계로 간소화했으며, 신규 가입 희망자의 경우에도 기존의 동아리 가입 방식(구글 폼에 인적 사항 작성 후 회비 납부)에서 변경된 점이 없어 양측 모두에게 간편한 신규 회원 등록 절차를 제공합니다.


모바일 앱 UI

1 - 앱

모바일 웹 앱 UI

1 - 웹


2. 물품 대여 서비스 제공

임원진은 '우학동' 앱을 통해 간단한 물품 정보를 입력하여 물품을 등록할 수 있습니다. 회원은 동아리 전용 페이지에서 대여하고자 하는 물품을 찾은 후, 대여하기 버튼을 통해 물품을 대여할 수 있습니다. 물품 대여하기를 완료하면 물품이 있는 장소로 이동해 물품을 이용하고, 동일한 페이지에서 반납하기 버튼을 통해 반납하고자 하는 물품의 사진을 촬영하면 반납이 완료됩니다.

이 과정에서 임원진은 앱에서 실시간으로 물품 대여, 반납 및 연체 상황을 알 수 있으며, 회원도 전용 페이지에서 현재 물품의 대여, 반납 상태를 확인할 수 있습니다.

여기서 회원이 대여한 물품을 기간 내에 반납하지 않고, 연체할 경우 대여한 회원의 이메일로 연체 알림이 전송됩니다. 이를 임원진은 앱을 통해 연체 중인 물품과 회원을 알 수 있으며, 등록된 회원 정보를 이용해 곧바로 연락이 가능합니다.

임원진은 이 외에도 필터를 이용해 현재 물품 상태(대여 중, 보관 중, 연체)와 대여 가능 여부(대여 가능, 대여 불가)를 단독으로 확인할 수 있어 물품 관리에 도움을 줍니다.

이를 통해 임원진과 회원 양측 모두에게 간편한 물품 대여 서비스를 제공합니다.


모바일 앱 UI

2 - 앱

모바일 웹 앱 UI

2 - 웹


3. 회비 사용 내역 및 일정 공유 절차 간소화

임원진이 '우학동'에서 동아리를 등록하면서 입력한 동아리 회비 계좌를 통해 회비 사용 내역을 앱에서 동기화합니다. 회장 및 총무는 앱을 통해 회비 사용 내역을 업데이트할 수 있으며, 업데이트된 회비 사용 내역은 회원도 동아리 전용 페이지를 통해 확인할 수 있습니다.

이를 통해 투명한 회비 사용 내역을 제공하며, 임원진과 회원 간의 오해나 갈등을 최소화해 줍니다.

또 임원진은 앱을 통해 일정 및 공지를 등록할 수 있으며, 등록하면서 이메일 전송 여부를 결정할 수 있습니다. 만약 이메일 전송을 체크하면 등록하면서 회원들의 이메일로 등록된 일정 및 공지를 전송합니다. 중요한 일정 및 공지의 경우 이미 등록한 후에도 이메일 전송이 가능합니다.

이렇게 단체 채팅방과 분리되어 일정 및 공지를 전파할 수 있어 반복적인 전파를 줄여줍니다.


모바일 앱 UI

3 - 앱

모바일 웹 앱 UI

3 - 웹


📝 설계 및 구현

시스템 개요

시스템 개요


CI/CD

CICD


🧐 팀 소개

이름 학과 이메일 역할
박상준 (팀장) 소프트웨어학과 [email protected] Back-end
강동우 소프트웨어학과 [email protected] Front-end (임원진 App, UI/UX 설계)
봉지수 소프트웨어학과 [email protected] Front-end (임원진 통계 Web, 회원 Web App)
정의엽 소프트웨어학과 [email protected] Back-end

✅ 협업 방식

코드 컨벤션

Flutter: Dart

구분 규칙
Name • 클래스 이름은 Pascal Case를 사용
• 변수 및 함수 이름은 Lower Camel Case를 사용
• 상수 이름은 대문자와 언더스코어(_)를 사용
Format • 라인의 길이는 120자로 제한
• 위젯 사용 시 마지막에 콤마(,)를 사용해 자동 코드 정렬에서 줄 바뀜 적용
• 들여쓰기는 2칸 사용
주석 • 문서에는 /// 사용
• 간단한 주석에는 // 사용

React: JavaScript

구분 규칙
Name • 변수 선언 시 const를 기본으로 사용, 필요한 경우에만 let 사용
• 객체 및 배열에는 리터럴 표기법 사용
• 함수는 함수 표현식을 주로 사용
Format • 들여쓰기는 2칸 사용
• 여러 줄에 걸치는 객체는 쉼표 뒤에 줄 바뀜 적용
주석 • 코드의 의도를 설명하는 주석 추가

Spring: Java

구분 규칙
기본 • Google JAVA Code Convention 준수
특이사항 • record 클래스의 경우 유효성 처리 및 가독성 증가를 위해 각 인자마다 한 줄씩 띄어쓰기 진행

브랜치 규칙

설명

구분 규칙
Name WHD-지라이슈번호_태그-브랜치 제목의 규칙으로 작성
• 이슈를 해결하기 위한 브랜치를 만드는 것을 기본으로 함
Tag type feat : 새로운 기능 추가
chore : 사소한 코드 수정
fix : 에러 및 버그 수정
docs : 문서 수정
design : 디자인 관련 코드 추가 및 수정
refactor : 코드 리팩토링
cicd : 배포 관련 설정 추가 및 수정

예시

WHD-1_feat-add_member_list_page

WHD-12_fix-fix_overflow_in_login_page

커밋 규칙

설명

구분 규칙
Name [WHD-지라이슈번호] 태그: 커밋 제목의 규칙으로 작성
• 작은 단위로 커밋을 작성하는 것을 기본으로 함
Tag type Init : 프로젝트 생성
Feat : 새로운 기능 추가
Chore : 사소한 코드 수정
Fix : 에러 및 버그 수정
Docs : 문서 수정
Design : 디자인 관련 코드 추가 및 수정
Refactor : 코드 리팩토링
CI/CD : 배포 관련 설정 추가 및 수정

예시

[WHD-1] Init: Create project
- 프로젝트 생성
...

[WHD-2] Feat: Add login page
- 로그인 화면 추가소셜 로그인 연결
...

풀 리퀘스트(PR) 규칙

설명

구분 규칙
Name [WHD-지라이슈번호] 태그: PR제목
• 태그는 브랜치의 태그와 동일하게 사용
• 내용에는 자신이 작업했던 작업 상세하게 기록
• 모바일 및 웹의 경우 작업한 UI 캡쳐본 업로드
Tag type feat : 새로운 기능 추가
chore : 자잘한 코드 수정
fix : 에러 및 버그 수정
docs : 문서 수정
design : 디자인 관련 코드 추가 및 수정
refactor : 코드 리팩토링

예시

[WHD-1] Feat: Add member list page

[WHD-12] Fix: Fix overflow in login page

코드 리뷰
구분 규칙
Front-End 프론트엔드는 각 개발 환경이 상이하여 정확한 코드 리뷰가 어려울 수 있으나, 코드 리뷰는 여전히 필요하다. 모바일과 웹 PR에서는 서로를 리뷰어로 지정하여 코드 리뷰를 진행한다. 리뷰어는 폴더 명, 파일명, 변수 명 등이 적절하게 사용되었는지 판단하고, 간단한 로직이나 UI 코드에 대해 궁금한 점을 코멘트로 남기며 상호 간의 코드를 학습한다. 모든 코드를 검토한 이후, 리뷰어가 Merge를 승인하면 PR을 작성한 사람이 Merge를 진행한다.
Back-End 백엔드에서는 코드 컨벤션이 잘 준수되었는지, 코드에 오류가 없는지를 면밀히 검토한 후, 필요시 코멘트를 남긴다. 리뷰어가 Merge를 승인하거나 보완 요청을 하면, PR을 작성한 사람이 해당 코멘트를 확인하고 이에 따라 수정한 후 Merge를 진행한다.

🎉 수상

KakaoTalk_Photo_2024-12-05-20-14-21

2024-2 AJOU SOFTCON 최우수상(1위)

KakaoTalk_Photo_2024-12-05-19-46-25


2024-2 BM 발명 아이디어 경진대회 최우수상(2위)
SCR-20241205-rfcf

Popular repositories Loading

  1. woohakdong-spring woohakdong-spring Public

    [2024-2 SW 캡스톤디자인] 서버 개발을 위한 레포지토리

    Java 2

  2. woohakdong-mobile woohakdong-mobile Public

    [2024-2 SW 캡스톤디자인] 모바일 개발을 위한 레포지토리

    Dart 1

  3. .github .github Public

  4. woohakdong-web woohakdong-web Public

    [2024-2 SW 캡스톤디자인] 웹 개발을 위한 레포지토리

    TypeScript

  5. woohakdong-manifests woohakdong-manifests Public

    [2024-2 SW 캡스톤 디자인] 우학동 서버를 위한 쿠버네티스 기반 인프라 구성 및 설정

Repositories

Showing 5 of 5 repositories
  • woohakdong-spring Public

    [2024-2 SW 캡스톤디자인] 서버 개발을 위한 레포지토리

    team8901/woohakdong-spring’s past year of commit activity
    Java 2 0 0 1 Updated Jan 13, 2025
  • woohakdong-web Public

    [2024-2 SW 캡스톤디자인] 웹 개발을 위한 레포지토리

    team8901/woohakdong-web’s past year of commit activity
    TypeScript 0 0 0 0 Updated Dec 22, 2024
  • woohakdong-mobile Public

    [2024-2 SW 캡스톤디자인] 모바일 개발을 위한 레포지토리

    team8901/woohakdong-mobile’s past year of commit activity
    Dart 1 0 0 0 Updated Dec 6, 2024
  • .github Public
    team8901/.github’s past year of commit activity
    0 0 0 0 Updated Dec 5, 2024
  • woohakdong-manifests Public

    [2024-2 SW 캡스톤 디자인] 우학동 서버를 위한 쿠버네티스 기반 인프라 구성 및 설정

    team8901/woohakdong-manifests’s past year of commit activity
    0 0 0 0 Updated Nov 29, 2024

Most used topics

Loading…