🚀 프로젝트 개요

StudyO는 스터디(Study)와 스튜디오(Studio)를 결합한 올인원 협업 플랫폼입니다.
스터디 모집부터 활동, 팀 프로젝트까지 복잡한 과정을 손쉽게 관리하고 팀워크를 완성할 수 있습니다.

• 프로젝트명: StudyO - 모든 스터디의 시작
• 개발기간: 2025.07.14 - 2025.08.20 (5주)
• 팀구성: 6명 (풀스택 6명)
• 배포 URL: www.studyo.r-e.kr/ (2025년 10월까지 운영 예정)
• Frontend Repository: react-study-o
• Backend Repository: tjspring
• PPT: StudyO 발표 자료
• 시연 영상: youtu.be/YQAbBxCMgDo

👥 팀 소개

김환희(팀장)	김예지	백유선	윤고은	이재우	이현섭
UI/UX 디자인 스터디 그룹 관리 FullCalendar 연동	UI/UX 디자인 로그인 인증 계정 관리 멤버 승인/관리	UI/UX 디자인 스터디 그룹 CRUD AWS S3 연동 썸네일 관리	회원가입 시스템 필터링 기능 추천 시스템	마이페이지 프로필 수정 공용 컴포넌트	AWS 인프라 CI/CD 구축 홍보글 CRUD

✨ 주요 기능

📚 스터디 관리

• 스터디 모집: 지역과 주제별 필터를 통한 효율적인 스터디 탐색
• 그룹 관리: 스터디장 권한 기반 멤버 승인/거절 시스템
• 일정 관리: FullCalendar를 활용한 직관적인 캘린더 인터페이스

👤 사용자 경험

• 간편한 시작: 쉬운 가입과 로그인 과정
• 개인화: 마이페이지에서 프로필 관리 및 활동 현황 확인
• 실시간 소통: 스터디 후 팀 프로젝트로 자연스러운 전환

🎯 협업 도구

• 파일 관리: AWS S3 기반 안전한 파일 업로드/다운로드
• 진행 관리: 개인 할 일 관리 및 진척 상황 확인
• 홍보 시스템: 풍부한 텍스트 에디터를 통한 스터디 홍보

🛠 기술 스택

Environment

Frontend

Backend

Database

Infrastructure

Design & Cooperation

🏗 시스템 아키텍처

┌─────────────┐    ┌──────────────┐    ┌─────────────┐
│             │    │              │    │             │
│   React     │◄──►│ Spring Boot  │◄──►│ Oracle 11g  │
│  Frontend   │    │   Backend    │    │  Database   │
│             │    │              │    │             │
└─────────────┘    └──────────────┘    └─────────────┘
       │                   │                   
       │                   │                   
       ▼                   ▼                   
┌─────────────┐    ┌──────────────┐           
│             │    │              │           
│   AWS S3    │    │   AWS EC2    │           
│File Storage │    │    Server    │           
│             │    │              │           
└─────────────┘    └──────────────┘           

📂 프로젝트 구조

Frontend (React)

react-study-o/
├── public/
│   ├── index.html
│   └── favicon.ico
├── src/
│   ├── components/     # 재사용 컴포넌트
│   ├── pages/         # 페이지 컴포넌트
│   ├── utils/         # 유틸리티 함수
│   ├── App.js         # 메인 앱 컴포넌트
│   └── index.js       # 엔트리 포인트
├── package.json
└── README.md

Backend (Spring Boot)

tjspring/
├── src/main/java/com/tj/spring/
│   ├── admin/         # 관리자 기능
│   ├── auth/          # 인증/인가
│   ├── study/         # 스터디 관련
│   ├── user/          # 사용자 관리
│   └── common/        # 공통 기능
├── src/main/resources/
│   ├── mybatis/mapper/  # MyBatis 매퍼
│   ├── static/          # 정적 파일
│   └── application.properties
└── pom.xml

🚀 시작하기

설치 및 실행

Frontend 실행

# 레포지토리 클론
git clone https://github.com/hyunsupLee/react-study-o.git
cd react-study-o

# 의존성 설치
npm install

# 개발 서버 실행
npm run dev

Oracle DB 접속정보 설정

1. 인텔리제이 우상단 configuration Edit

Oracle 환경변수 설정

2. Environment variables 환경변수에 DB 정보 설정

Backend 실행

# 레포지토리 클론
git clone https://github.com/hyunsupLee/tjspring.git
cd tjspring

🎯 핵심 기능 상세

1. 권한 기반 스터디 관리

• 스터디장만 캘린더 등록/수정/삭제 권한
• 멤버 승인/거절 시스템
• 그룹별 권한 분리

2. 실시간 파일 관리

• AWS S3 연동을 통한 안전한 파일 저장
• 썸네일 자동 생성 및 최적화
• 파일 업로드/다운로드 진행률 표시

3. 직관적인 일정 관리

• FullCalendar 라이브러리 활용
• 드래그 앤 드롭으로 일정 수정
• 개인/그룹 일정 통합 관리

📊 개발 프로세스

Agile 방법론 적용

• 4주 스프린트: 기획 → 개발 → 테스트 → 배포
• 일일 스탠드업: 매일 진행 상황 공유
• 스프린트 리뷰: 주간 피드백 및 개선사항 도출

Git 워크플로우

• 브랜치 전략: 개인 브랜치 → Main 브랜치
• CI/CD: GitHub Actions를 통한 자동 배포

🎉 프로젝트 성과

기술적 성과

• 풀스택 개발: 6명 모든 팀원이 각자 담당 기능을 프론트엔드부터 백엔드까지 완전 구현
• 클라우드 배포: AWS 인프라를 활용한 실제 서비스 배포
• 팀 협업: Git을 활용한 6명 규모의 효율적인 협업 경험

사용자 가치

• 편의성: 스터디 모집부터 활동까지 원스톱 지원
• 효율성: 직관적인 UI/UX로 학습 관리 시간 단축
• 확장성: 스터디에서 프로젝트로 자연스러운 전환

---

StudyO - 모든 스터디의 시작
Study Together, Grow Together

---

ⓒ 김환희 · 김예지 · 백유선