Docs: CONTRIBUTING.md 추가

CONTRIBUTING.md

@@ -0,0 +1,66 @@
+# How to Contribute
+
+저희 프로젝트에 관심을 가져주셔서 감사합니다. 모든 PR은 메인 컨트리뷰터에 의해서 검토됩니다.
+
+## 레포지토리의 방향성
+
+MotuS의 프론트엔드 레포지토리는 백엔드와 AI가 제공하는 MotuS API를 사용한 Example 프로젝트를 지향합니다. MotuS API에서 지원하는 기본 기능을 넘어서는 고급 기능보다는, **MotuS를 어떤 방식으로 사용하는가**에 초점을 맞추어 개발합니다.
+
+MotuS의 프로젝트 방향성과 거리가 먼 Issue 또는 Pull Request는 거부될 수 있습니다. 그럼에도 불구하고 여러분들이 생각하는 기능이 MotuS에 필요하다고 생각되면, 일단 Issue를 올려보세요!
+
+## Issue
+
+Issue는 컨트리뷰터에게 피드백을 남기거나, 새로운 기능을 제안하거나, 버그를 제보할 때 작성하시면 됩니다.
+
+Issue에는 두가지 템플릿이 있습니다.
+
+#### Feature
+
+웹사이트에 필요한 기능(사소한 수정이든, 큰 기능이든 모두 괜찮습니다!)을 적어주세요.
+
+기능의 규모가 클 수록 기능의 의도와 Flow를 상세하게 적어주세요. 단순히 "Web 3.0을 도입해주세요"와 같이 모호한 기능을 적어주시면 Issue가 Close될 수 있습니다.
+
+In Progress 부분은 Issue를 담당한 컨트리뷰터가 작성할 부분이므로 해당 부분은 비워둔 채로 올려주세요.
+
+#### BUG
+
+버그를 찾으신 경우, Issue를 통해서 제보해주세요.
+
+버그는 컨트리뷰터가 Reproduce할 수 있도록 최대한 상세한 내용을 기입해주세요. "**1. 사용자가 사용하는 운영체제에 대한 정보와 웹브라우저**", 그리고 "**2. 어떤 과정을 거쳐서 해당 버그가 발생했는지**"에 대한 정보는 반드시 기입되어야 합니다.
+
+## Pull Request
+
+저희 레포지토리에 여러분들의 능력을 기여해주셔서 대단히 감사합니다! Pull Request를 보내주실 때는 다음을 지켜주시기 바랍니다.
+
+### Commit Convention
+
+저희 레포지토리는 다음의 커밋 컨벤션을 사용하고 있습니다.
+
+| Tags | Explanation |
+| :--------------: | :-------------------------------------: |
+| Feat | 새로운 기능 추가 |
+| Fix | 버그 수정 |
+| !BREAKING CHANGE | 커다란 API 변경의 경우 |
+| !HOTFIX | 급한 치명적 버그 수정 |
+| Build | 빌드 관련 파일 수정 |
+| Design | CSS를 포함 UI 디자인 변경 |
+| Docs | 문서 수정 |
+| Style | 코드 포맷팅, 세미콜론 누락, 코드 변경 X |
+| Refactor | 코드 리팩토링 |
+| Comment | 필요한 주석 추가 및 변경 |
+| Test | 테스트 코드 수정 |
+| Rename | 파일, 폴더명 이름 수정 |
+| Remove | 파일, 폴더 삭제 |
+| chore | 빌드, 패키지 수정 |
+
+### Title Convention
+
+Pull Request의 제목을 "[태그/FE] ~~를 수정한다."와 같이 표기합니다. 예를 들어, 다음과 같이 작성합니다.
+
+- [Chore/FE] 패키지 버전을 업데이트한다.
+- [Docs/FE] README.md의 타이핑 오류를 수정한다.
+- [Feat/FE] Favicon을 추가한다.
+
+---
+
+여러분들의 멋진 PR을 기대하고 있겠습니다!

README.md

@@ -1,14 +1,12 @@
-# MotuS-FrontEnd
-
 <div align="center">
  <img width="720px" src="https://github.com/MotuS-Web/MotuS-FrontEnd/assets/35104213/f138f900-a288-49ec-ae92-ee70525beb36" />
+ <br/>
+ <h2>MotuS ─ 비대면 운동 학습 플랫폼<br/>Frontend Repository</h2>
 </div>
 
-<br/>
-
-비대면 운동 학습 플랫폼, "MotuS" 프론트엔드 팀 개발 저장소입니다.
+---
 
-## 🔥 Frontend Team
+## 🔥 Main Contributor
 
 | 오소현 | 김경재 |
 | :------------------------------------------------------------------------------: | :------------------------------------------------------------------------------: |
@@ -43,32 +41,17 @@ npm run dev
 
 주의: 본 레포지토리를 Production으로 배포하려는 경우, 사용자의 웹캠에 접근할 수 있도록 반드시 HTTPS 환경으로 배포하시기 바랍니다.
 
-## 📚 Frontend Libraries
+## 📚 Libraries
 
 | **Stack** | **Version** | **Why** |
 | :---------------: | :-------------------------------: | :-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------: |
-| React.js | `18.2.0` | 많은 사용자들이 오랜 기간동안 사용하여 다른 프레임워크에 비해 오픈 소스 생태계가 활발하며, <br/> 컴포넌트 단위로 분리하여 개발을 할 수 있어 분업하기 좋고 생산성이 탁월하기 때문에 도입 |
+|  React  | `18.2.0` | 많은 사용자들이 오랜 기간동안 사용하여 다른 프레임워크에 비해 오픈 소스 생태계가 활발하며, <br/> 컴포넌트 단위로 분리하여 개발을 할 수 있어 분업하기 좋고 생산성이 탁월하기 때문에 도입 |
 | Redux | `8.1.2` | 모든 상태 업데이트를 액션으로 정의하고, <br/> 액션 정보에 기반하여 Reducer에서 상태를 업데이트하기 때문에 <br/> 상태를 더욱 쉽게 예측 가능하게 하여 유지보수 측면에 긍정적인 효과가 있어 <br/> 상태 관리를 하는 컨테이너로 채택 |
 | @reduxjs/toolkit | `1.9.5` | Redux를 사용하면서 생기는 boilerplate 코드를 줄이고, <br/> Redux 코드 작성에 필요한 도구와 헬퍼를 갖추기 위함. <br/> 또한 불변성을 유지하면서 상태 업데이트를 간소화하고, <br/> 비동기 작업을 쉽게 관리하기 위해 도입 |
 | Styled-Components | `6.0.6` | 스타일 작성의 생산성 향상을 위하여 CSS-in-JS 도입 |
 | axios | `1.5.0` | API 통신에 사용하기 위해 도입 |
 | Vercel | [Link](motus-frontend.vercel.app) | 다른 개발 팀과의 협업 시 프론트 개발 현황을 vercel로 호스팅한 것으로 확인이 가능해 이해를 도움. <br/> 또한 빌드 도구로 활용해 개발시 오류를 바로 확인이 가능함. |
 
-## 💡 Frontend Commit Convention
+## 💡 Contribution
 
-| Tags | Explanation |
-| :--------------: | :-------------------------------------: |
-| Feat | 새로운 기능 추가 |
-| Fix | 버그 수정 |
-| !BREAKING CHANGE | 커다란 API 변경의 경우 |
-| !HOTFIX | 급한 치명적 버그 수정 |
-| Build | 빌드 관련 파일 수정 |
-| Design | CSS를 포함 UI 디자인 변경 |
-| Docs | 문서 수정 |
-| Style | 코드 포맷팅, 세미콜론 누락, 코드 변경 X |
-| Refactor | 코드 리팩토링 |
-| Comment | 필요한 주석 추가 및 변경 |
-| Test | 테스트 코드 수정 |
-| Rename | 파일, 폴더명 이름 수정 |
-| Remove | 파일, 폴더 삭제 |
-| chore | 빌드, 패키지 수정 |
+MotuS 프론트엔드 레포지토리에 기여해주셔서 감사합니다! Contribution 가이드는 [CONTRIBUTING.md](CONTRIBUTING.md)에서 확인해주세요.