<br/>

<div align="center">
<img width="80%" src="https://content.presspage.com/uploads/2658/c1920_logo-stackoverflow-banner.jpg?64224" alt="roobits">
</div>

</br>

- **`팀 명` :** 🌡 37℃
- **`프로젝트 명` :** Stackoverflow
- **`프로젝트 기간` :** 2022.12.15 - 2023.01.02
- **`한줄 소개` :** Stackoverflow ! 개발자간의 질의응답 커뮤니티입니다.
- **`팀원` :** 이재혁(팀장), 이동우, 박종식, 박연환(부팀장), 김혜원, 박평환
- **`배포 링크` :** [🌐 stackoverflowpre.p-e.kr](http://stackoverflowpre.p-e.kr/)

<br/>

## 💼 Team

| 이재혁<br>(BE, 팀장) | 이동우<br>(BE) | 박종식<br>(BE) | 박연환<br>(FE) | 김혜원<br>(FE) | 박평환 <br>(FE) |
| :---: | :---: | :---: | :---: | :---: | :---: |
| <img alt="이재혁" src="https://avatars.githubusercontent.com/u/95069395?v=4" height="100" width="100"> | <img alt="이동우" src="https://avatars.githubusercontent.com/u/110949256?v=4" height="100" width="100"> | <img alt="박종식" src="https://avatars.githubusercontent.com/u/57285707?v=4" height="100" width="100"> | <img alt="박연환" src="https://user-images.githubusercontent.com/95069395/210201597-f550690c-8780-462f-8fdc-e8cb65d6b9f8.jpeg" height="100" width="100"> | <img alt="김혜원" src="https://avatars.githubusercontent.com/u/111227745?v=4" height="100" width="100"> | <img alt="박평환" src="https://avatars.githubusercontent.com/u/110876643?v=4" height="100" width="100">
|<p align="left">- 로그인 인증처리<br/>(JWT 발급,인증)<br/>- OAuth2 로그인 <br/>인증 처리(구글)<br/>- 질문 등록,조회<br/>삭제,투표기능<br/>- 답변 등록,조회<br/>삭제,투표기능<br/>- 예외처리 로직 <br/>기능 구현<br/>- 게시글,답변 <br/>유효성 검증<br/>처리 구현<br/>- 회원 프로필<br/>이미지 관리<br/>-JUnit 초안작성<br/>(Security 등)<br/>- 배포환경 구축</p>|<p align="left">- 메인화면 API <br/>- 게시글 검색기능<br/>- 게시글 정렬기능 <br/>- User화면 조회<br/>페이지네이션구현<br/>- Tag화면 <br/>조회 기능구현<br/>페이지네이션구현<br/>- User,Tags 검색<br/>- 회원 프로필 <br/>게시글,댓글<br/>조회 기능 추가<br/>- 배포환경 구축</p>|<p align="left">- 회원등록,삭제<br/>- 회원 프로필<br/>조회,수정<br/>삭제,편집<br/>- 회원 가입<br/>유효성 검증<br/>- 시간관리 기능<br/>- 배포환경 구축</p>|<p align="left"><br/>-Main페이지구현<br/>(검색, 정렬 조회)<br/>-Users<br/>페이지구현<br/>(검색 기능)<br/>-Tags페이지구현<br/>(검색 기능)<br/>-페이지네이션 <br/>구현(모든화면)<br/>-Signup 페이지<br/>구글 OAuth2.0 <br/>회원가입 구현<br/>-Right Sidebar <br/>컴포넌트 구현</p>|<p align="left">-Header<br/>컴포넌트 구현 <br/>-Left Nav <br/>컴포넌트 구현 <br/>-Post페이지 <br/>구현 (조회, 삭제<br/>공유, 투표) <br/>-유저 Profile <br/>페이지 구현 <br/>- 회원 Login <br/>페이지구현<br/>(JWT 로그인<br/>OAuth2.0<br/>로그인 구현)<br/>-모바일,태블릿 <br/>반응형 웹 작업 </p>|<p align="left">- Footer <br/>컴포넌트 작업 <br/>- 404 Page </p> |

<br/>

|name|Github|
|:---:|:---|
|이재혁| [@MyCatlikesChuru](https://github.com/MyCatlikesChuru) |
|이동우| [@eastmeet](https://github.com/eastmeet) |
|박종식| [@jongsic17](https://github.com/jongsic17) |
|박연환| [@yeonhwan](https://github.com/yeonhwan) |
|김혜원| [@zemma0618](https://github.com/zemma0618) |
|박평환| [@Parkpyunghwan](https://github.com/Parkpyunghwan) |

<br/>

### <span style=""> ⚙️ **Tools** </span>
| Github | Discord |Notion|
| :---: | :---: |:---:|
| <img alt="github logo" src="https://techstack-generator.vercel.app/github-icon.svg" width="65" height="65"> | <img alt="Discord logo" src="https://assets-global.website-files.com/6257adef93867e50d84d30e2/62595384e89d1d54d704ece7_3437c10597c1526c3dbd98c737c2bcae.svg" height="65" width="65"> |<img alt="Notion logo" src="https://www.notion.so/cdn-cgi/image/format=auto,width=640,quality=100/front-static/shared/icons/notion-app-icon-3d.png" height="65" width="65">|

<br/>

### <span style=""> 🖥 **Front-end** </span>
| Html | CSS | JavaScript | React | Styled-<br>Components | axios | Tanstack-Query | zustand | React-Quill |
| :---: | :---: | :---: | :---: | :---: | :---: | :---: | :---: | :---: |
| <img alt="Html" src ="https://upload.wikimedia.org/wikipedia/commons/thumb/6/61/HTML5_logo_and_wordmark.svg/440px-HTML5_logo_and_wordmark.svg.png" width="65" height="65" /> | <div style="display: flex; align-items: flex-start;"><img src="https://user-images.githubusercontent.com/111227745/210204643-4c3d065c-59ec-481d-ac13-cea795730835.png" alt="CSS" width="50" height="65" /></div> | <div style="display: flex; align-items: flex-start;"><img src="https://techstack-generator.vercel.app/js-icon.svg" alt="icon" width="75" height="75" /></div> | <div style="display: flex; align-items: flex-start;"><img src="https://techstack-generator.vercel.app/react-icon.svg" alt="icon" width="65" height="65" /></div> | <div style="display: flex; align-items: flex-start;"><img src="https://styled-components.com/logo.png" alt="styled-components icon" width="65" height="65" /></div> | <div style="display: flex; align-items: flex-start;"><img src="https://axios-http.com/assets/logo.svg" width="65" height="65"/></div> | <div style="display: flex; align-items: flex-start;"><img src="https://user-images.githubusercontent.com/81786662/210203759-1bd2d0ea-86b3-43c0-8e30-44436d73bb9f.png" width="65" height="65"/></div> | <div style="display: flex; align-items: flex-start;"><img src="https://user-images.githubusercontent.com/81786662/210204062-cb572e61-2027-4a9b-a52c-0eac83bcf703.jpeg" width="100" height="65"/></div> | <div style="display: flex; align-items: flex-start;"><img src="https://user-images.githubusercontent.com/81786662/210204172-8fc62516-4ee9-410d-859a-17a0da1e76f9.png" width="100" height="65"/></div>|

<br/>

### <span style="">🔒 **Back-end** </span>
| Java | mySQL | NginX | AWS | Spring | Spring<br>Boot | JWT|Spring<br/>Security
| :---: | :---: | :---: | :---: | :---: | :---: | :---: | :---: |
| <div style="display: flex; align-items: flex-start;"><img src="https://techstack-generator.vercel.app/java-icon.svg" alt="icon" width="65" height="65" /></div> | <div style="display: flex; align-items: flex-start;"><img src="https://techstack-generator.vercel.app/mysql-icon.svg" alt="icon" width="65" height="65" /></div> | <div style="display: flex; align-items: flex-start;"><img src="https://techstack-generator.vercel.app/nginx-icon.svg" alt="icon" width="65" height="65" /></div> | <div style="display: flex; align-items: flex-start;"><img src="https://techstack-generator.vercel.app/aws-icon.svg" alt="icon" width="65" height="65" /></div> | <img alt="spring logo" src="https://www.vectorlogo.zone/logos/springio/springio-icon.svg" height="50" width="50" > | <img alt="spring-boot logo" src="https://t1.daumcdn.net/cfile/tistory/27034D4F58E660F616" width="65" height="65" > | <img alt="spring-boot logo" src="https://play-lh.googleusercontent.com/3C-hB-KWoyWzZjUnRsXUPu-bqB3HUHARMLjUe9OmPoHa6dQdtJNW30VrvwQ1m7Pln3A" width="65" height="65" >| <img alt="spring-boot logo" src="https://blog.kakaocdn.net/dn/dIQDQP/btqZ09ESd8T/0ibqtotW52OaJS8HznXDQK/img.png" width="65" height="65" >|

<br/>

<br/>

## 🌟 Pages & Features

|||
|:---:|:---:|
|**메인 페이지(검색,정렬)**|**로그인 / 회원가입 페이지**|
|<img width="100%" src="https://user-images.githubusercontent.com/95069395/210195043-4d6756d4-3772-49f1-8042-af4ba6dbd903.gif"/>|<img width="100%" src="https://user-images.githubusercontent.com/95069395/210195071-038f0c24-e043-481e-9890-100713b01e02.gif"/>|
|**구글 OAuth2 인증**|**프로필 관리**|
|<img width="100%" src="https://user-images.githubusercontent.com/95069395/210197330-ff28ef1e-8563-440a-b2fa-b458f3ad9fcd.gif"/>|<img width="100%" src="https://user-images.githubusercontent.com/95069395/210202375-1f23a471-d59b-4b8e-ba29-dac42e2db98b.gif"/>|
|**질문 게시글 작성**|**게시글 조회,답변**|
|<img width="100%" src="https://user-images.githubusercontent.com/95069395/210195309-3cfb00a5-5d2f-46f5-ae6f-ed535e3bb0bb.gif"/>|<img width="100%" src="https://user-images.githubusercontent.com/95069395/210197858-0a2820fc-4383-4898-abea-eb78b78403f4.gif"/>|
|**게시글 답변 투표(추천)기능**|**USER & TAG 페이지**|
|<img width="100%" src="https://user-images.githubusercontent.com/95069395/210197983-f344229e-8c4b-4c2c-90d1-b394895b266b.gif"/>|<img width="100%" src="https://user-images.githubusercontent.com/95069395/210202204-af5d5cb3-2d42-4c78-ab18-23b7a0692971.gif"/>|

<br/>

## 👩🏻‍💻 User flow
<img width="70%" alt="💎 루비츠 User Flow" src="https://lh3.googleusercontent.com/u/0/drive-viewer/AFDK6gMFiYTy_nkRtFRp-OhnoaVjOpYmget-BUXcOmo_yXJGANmXTKZEykOqpiWclYKJF9-yoP8P158sPsdSIFv8bvR1BLE4zg=w1170-h921">

<br/>

## 🔖 DB Diagram
<img width="70%" alt="💎 루비츠 User Flow" src="https://lh3.googleusercontent.com/u/0/drive-viewer/AFDK6gNUG5VGS1_jfmUiRwPNPpvIbhXDwhZbKnZeaEDX_e_6K51YX5dQCgjzGDpjyl0hZW22DeLm2LPe2C-dF6KZm_i8CZGNCw=w1920-h921">

<br/>

## 📎 Git
### 🌲 Branch
`main` : 서비스 운영 브랜치입니다.
`release` : 메인 브랜치 배포전 릴리즈 브랜치입니다.
`dev/front` : 프론트엔드 개발 환경 브랜치입니다.
`dev/back` : 백엔드 개발 환경 브랜치입니다.
`feat/역할군/개발명` : 기능 개발 브랜치 입니다. ex) feat/BE/security

<img width="50%" src="https://lh3.googleusercontent.com/u/0/drive-viewer/AFDK6gPRcd6ABuDdMcynR6HuiG9x19VUEIEgZ22ux_TWOCwIbb_0bOlWJc1Ka7Ut_ljdzInElTXQf-IT1A-UnqGNjx5CTdse=w1920-h864"/>

<br/>

📌 Pull Request Merge 담당 📌
❗️주의 : 해당 브랜치별로 담당 인원분들은 전부 모여 코드리뷰 및 동의 후에 
Merge를 진행해주시기 바랍니다

main <- release : 이재혁 (팀장) (김혜원, 박연환, 박평환, 이재혁, 이동우, 박종식)

release <- dev_front : 박연환  (김혜원, 박연환, 박평환, 이재혁, 이동우, 박종식)
release <- dev_back : 이동우 (김혜원, 박연환, 박평환, 이재혁, 이동우, 박종식)

dev_front <- feat : 박연환 (김혜원, 박연환, 박평환)
dev_back <- feat : 이동우 (이재혁, 이동우, 박종식)

<br/>

### ✉️ Commit Message

|Message|설명|
|:---:|:---|
|[feat]|새로운 기능을 추가할 경우 ex) [feat] 로그인 기능 추가|
|[fix]|버그를 고친 경우|
|[design]|CSS 등 사용자 UI 디자인 변경|
|[!breaking change]|커다란 API 변경의 경우|
|[!hotfix]|치명적인 버그를 고쳐야하는 경우|
|[style]|코드 포맷변경, 세미콜론 누락, 코드수정이 없는 경우.|
|[refactor] |프로덕션 코드 리펙토링할 경우|
|[comment]|필요한 주석 추가 및 변경|
|[docs]|문서를 수정한 경우|
|[test]|테스트 코드 작업을할 경우|
|[chore]|빌드 테스트 업데이트, 패키지 매니저를 설정하는 경우|
|[rename]|파일 혹은 폴더명을 수정하거나 옮기는 작업만 하는 경우|
|[remove]|삭제하는 작업만 수행한 경우|
|[init]|브랜치 초기화 및 초기셋팅 관련된 설정일 경우|