🌿JOBCHO🌿

잔디를 벤치마킹하여 만든 팀 협업 플랫폼

Jobcho는 팀원 간의 실시간 소통과 프로젝트 관리를 지원하는 웹 기반 협업툴입니다.
잔디(JANDI)의 기능을 참고하여 구현되었으며, 메시지 채팅, 공지 관리, 할 일, 파일 공유 등의 기능을 제공합니다.

API 명세서 링크

https://spotless-seeker-00f.notion.site/JOBCHO-API-22d13ddc688b80449ec1c9b64f0b609f?pvs=73

Notion

https://spotless-seeker-00f.notion.site/16513ddc688b806aacb5f59a6befa64e?p=22913ddc688b80a092aad24c232204da&pm=c

<br><br>

선정 이유

• Spring Boot를 학습하면서 실시간 채팅, 파일 업로드, 알림 등 다양한 기능을 직접 구현해보고 싶은 욕심이 생겼습니다.
• 기업 협업툴인 잔디(JANDI)를 벤치마킹하여 웹 협업 플랫폼을 만들자는 목표로 프로젝트를 기획했습니다.
• 단순한 채팅과 일정 관리 협업툴이 아닌 깃허브와 같은 파일 관리를 직접 설계하고 구현하고 싶었습니다.

<br><br>

𝌙 주요 기능

🧑 사용자 관리

• 로그인 및 로그인 유지 기능
  • Spring Security
• 비로그인 시 로그인 페이지 외 접근 제한
• 비밀번호 찾기 기능 -> 이메일로 임시 비밀번호 전송
• 사용자 계정 설정
• 사용자 활동 상태 확인

🗨️ 실시간 커뮤니케이션

• 1:1 고객센터 채팅
  • WebSocket 기반 실시간 채팅, 사용자/관리자 권한 구분
• 다중 채팅방 지원
• 멘션 기능
  • @닉네임 멘션 시 실시간 알림 전송
• 메시지 기능
  • 메시지 등록, 수정, 삭제, 답글 기능 포함
• 즐겨찾기
  • 자주 사용하는 채팅방/메시지를 북마크

📁 파일 및 프로젝트 관리

• 워크스페이스 내 파일 공유
  • 폴더 기반 파일 정리
• Git 스타일 브랜치 기반 프로젝트 트래킹
  • 브랜치 별 커밋 시각화

🧑‍🤝‍🧑 워크스페이스 & 조직도

• 워크스페이스 생성 시 **도메인 지정 가능**
• **채팅방 멤버 초대 (이메일 기반), 역할 구분**
• 조직도 기반 멤버 구조 시각화
• 현재 로그인 되어 있는 ( 활동 중 ) 멤버 별도 표시

🔔 알림 센터

• 실시간 알림 기능 제공 (멘션 / 공지사항 / 할 일 등)
• 알림 읽음/안읽음 구분 및 확인 기록 저장

<br><br>

📠 기술 스택

• Frontend : HTML, CSS, JavaScript
• Template : Thymeleaf
• Backend : Spring Boot, Spring MVC, JPA
• Database : Oracle
• Build Tool : Gradle

<br><br>

👨🏻‍💻 역할

🙋🏻‍♂️ <a href="https://github.com/SongHyojun0228" target="_blank">송효준</a>

➬ 프론트엔드

• 회원가입, 로그인, 비밀번호 찾기 페이지
• 계정 설정 페이지
• 팀생성, 홈화면 페이지
• 워크스페이스 및 채팅방 멤버 초대 페이지
• 1 : 1 고객센터 페이지
• 워크스페이스 및 채팅방 조직도 페이지
• 알람 센터 페이지
• 프로젝트 파일, 폴더 업로드 페이지

🔙 백엔드

• 회원가입, 로그인, 로그아웃 (Spring Security)
• 비밀번호 찾기 -> 이메일로 임시 비밀번호 전송
• 비로그인 시 로그인 페이지 외 접근 제한 및 로그인 유지
• 사용자 계정 설정
• 워크 스페이스 생성 시 사용자가 지정한 도메인 설정
• 사용자 활동 상태 확인
• 관리자와 고객센터 1:1 실시간 채팅 -> WebSocket
• 즐겨찾기 등록
• 채팅방 멘션 기능 -> ex) @송효준
• 워크스페이스 및 채팅방 멤버 식별
• 브랜치 생성 및 해당 브랜치로 커밋
• 폴더 구분 기반의 세분화된 파일 업로드

⚾ 데이터베이스

• 테이블 설계
• 무결성 제약 조건 설계

🙋🏻‍♂️ <a href="https://github.com/walwal123" target="_blank">유승원</a>

➬ 프론트엔드

• 워크스페이스 페이지
• 즐겨찾기, 할 일 자세히 보기 페이지
• 프로젝트 차트 페이지
  • Chart.js

🔙 백엔드

• 워크 스페이스 별 나와의 채팅방
• 웹소켓 기반 다중 채팅방 구현
• 채팅방 수정, 삭제, 나가기 구현
• 채팅방 파일 업로드 구현
• 메시지 별 부가 기능 -> 수정, 삭제, 답글 등
• 공지사항, 할 일 등록

<br><br>

성장점

• 처음으로 스프링으로 만든 프로젝트였는데 실제 서비스처럼 동작하도록 만들다 보니 웹 애플리케이션의 구조와 흐름을 더 이해할 수 있는 계기가 됐습니다.
• Spring Security를 사용한 로그인 처리, 도메인 기반 접근 제어, WebSocket 실시간 채팅, 폴더 구조 기반 파일 업로드 등 여러 기능을 직접 구현하면서 많은 고민과 오류 등 큰 경험을 할 수 있었습니다.
• WebSocket을 활용한 1:1 고객센터와 다중 채팅방 기능을 구현하고, 멘션이나 할 일 등록 시 실시간 알림이 가도록 만들면서 실시간 이벤트 처리 흐름에 대해 익숙해졌습니다.
• DB 설계에서는 무결성, 참조 제약 조건 등을 신경 쓰며 데이터가 안정적으로 유지되도록 설계하는 방법을 배울 수 있었습니다.

<br><br>

📆 기간

• 2025년 04월 중반 ~ 2025년 06월 후반

<br><br>

📸 스크린샷