MOVE : 부담스러운 운동은 NO!
START : 가볍게 스트레칭으로 시작하세요!
WITH, TOGETHER : 혼자가 아닌 뭅스터와 같이, 함께해요!
누구나, 어디서든, 가볍게 할 수 있는 스트레칭을 소개하여,
바쁜 현대인들의 일상 속, 몸과 마음을 위한 시간을 틈틈이 만들어가자 는 취지로 시작하였습니다.
2021년부터 네이버 블로그, 카카오 오픈채팅방으로 시작한 서비스이며,
더 많은 사용자에게, 더 좋은 편의성(찜, 출석포인트 등)을 제공하고자 웹서비스로 제작하게 되었습니다.
뭅스터 웹사이트 바로가기 : https://movester.kr
뭅스터 어드민 웹사이트 바로가기 : https://movester-admin.shop
| Role | Member |
|---|---|
| Full-Stack, Web-Design | 조나현 |
| Mentor | 최용권 |
- 서비스 웹사이트
- 관리자 웹사이트
- 맞춤 스트레칭 검색 (부위별, 자세별, 효과별, 태그별 스트레칭 검색)
- 신체부위별로 원하는 스트레칭을 찾아볼 수 있도록 하였습니다.
- 내가 원하는 스트레칭을 손쉽게 찾아보세요.
- 일주일 추천 스트레칭
- 나에게 딱 맞는 스트레칭을 고르기 귀찮다면, 뭅스터가 추천해주는 일주일 스트레칭을 따라해보세요!
- 찜한 스트레칭 리스트
- 나에게 필요한 스트레칭만 골라 찜 리스트에 담아보세요!
- 오로지 나만을 위한 맞춤형 스트레칭 공간입니다.
- 유연성 셀프 측정 및 기록 시스템
- 유연성 유지 및 향상은 몸 건강의 지표입니다.
- 꾸준한 기록을 통해 어제보다 나은 오늘의 나로 함께 나아가요.
- 매달 진행하는 출석 이벤트
- 매일 뭅스터와 함께 스트레칭하며, 출석 도장을 찍어보세요.
- 매달 말일, 출석왕을 위해 뭅스터가 특별한 선물을 준비했어요!
- 관리자 계정 관리
- 로그인, 관리자 조회, 관리자 계정 등록/삭제, 비밀번호 변경
- 회원 검색 및 조회
- 회원 정보, 월별 누적 포인트, 부위별 기록 조회
- 스트레칭 CRUD
- 스트레칭 검색 및 조회
- 스트레칭 등록/수정/삭제
- 일주일 스트레칭 조회
- 일주일 스트레칭 등록/수정/삭제
- 노출할 일주일 스트레칭 관리
Javascript,Node.js의Express로REST API구현 (회원, 스트레칭 등등의CRUD)MVC패턴 구조 [Controller>Service>Dao]KakaoOauth활용한 회원 계정 관리Redis활용한 회원 세션 관리JWT활용한 인증 체계 구축Bcrypt활용한 비밀번호 암호화 관리Nodemailer활용한 메일 전송Sentry활용한 에러 수집 및Slack으로 에러 메세지 전송
Javascript,React로CSR,SPA구현Styled-component활용한 컴포넌트 스타일링Redux-toolkit활용한 전역 상태 관리Ìmmer활용한 전역 데이터 불변성 유지Axios활용한 API 요청Quill,Recharts,rc-slider활용한 사용자 입력 데이터 시각화
ÀWSEC2활용한 클라우드 서버 세팅ÀWSRDS활용한 클라우드 DB 세팅ÀWSS3활용한 클라우드 스토리지 세팅ÀWSRoute53활용한 호스팅NGINX활용한 리버스 프록시PM2활용한 무중단 서비스 세팅
- 주 단위 스프린트 회의를 통한 이슈 및 티켓 관리
Figma활용한 프로토타입 구축Notion활용한 프로젝트 기획 및 관리Slack활용한 멤버 간 소통MySQL Worckbentch활용한 데이터베이스 관리Postman활용한 API 테스트 및 문서화Sentry,Slack활용한 실시간 에러 모니터링Prettier,ESlint활용한 코드 스타일 관리
Routes:REST API요청을 받아, 라우팅 >Middleware호출 >Controller호출Controller:Request받아, 유효성 검증 후Service호출 >Response반환Service: 비지니스 로직 처리,Dao호출Dao:DB에 접근하여 데이터 조회 및 가공Middleware:Controller호출 전, 공통적으로 적용되는 로직 처리Modules: 외부 라이브러리를 활용한 공통 함수Util: 공통적으로 사용되는 사용자 정의 함수
Page:container component역할.API요청 및state관리 후Component에props전달Component:presentational component역할.state직접 조작하지 않고,Page에서 전달받은props활용하여 랜더링 화면 구성Store:Redux전역 상태 관리Service:Axios세팅 및API fetch생성Util: 공통적으로 사용되는 사용자 정의 함수
프로덕트 BE
.
├── bin
│ └── www.js
├── config
│ ├── dev.js
│ ├── jwt.js
│ ├── nodemailer.js
│ ├── operationEnv.js
│ ├── prod.js
│ └── redis.js
├── controllers
│ ├── attendPoint.js
│ ├── auth.js
│ ├── difficulty.js
│ ├── like.js
│ ├── record.js
│ ├── stretching.js
│ ├── user.js
│ └── week.js
├── dao
│ ├── attendPoint.js
│ ├── difficulty.js
│ ├── like.js
│ ├── pool.js
│ ├── record.js
│ ├── stretching.js
│ ├── user.js
│ └── week.js
├── index.js
├── labels.json
├── middleware
│ ├── auth.js
│ ├── validator
│ │ ├── attendPoint.js
│ │ ├── common.js
│ │ ├── difficulty.js
│ │ ├── like.js
│ │ ├── record.js
│ │ ├── stretching.js
│ │ └── user.js
│ └── validatorError.js
├── modules
│ ├── emailSender.js
│ ├── encrypt.js
│ ├── jwt.js
│ ├── redis.js
│ └── slackSender.js
├── package-lock.json
├── package.json
├── routes
│ ├── attendPoint.js
│ ├── auth.js
│ ├── difficulty.js
│ ├── index.js
│ ├── like.js
│ ├── record.js
│ ├── stretching.js
│ ├── user.js
│ └── week.js
├── service
│ ├── attendPoint.js
│ ├── difficulty.js
│ ├── like.js
│ ├── record.js
│ ├── stretching.js
│ ├── user.js
│ └── week.js
└── utils
├── getToday.js
├── responseForm.js
├── responseMessage.js
└── statusCode.js
프로덕트 FE
.
├── README.md
├── labels.json
├── package-lock.json
├── package.json
├── public
│ ├── assets
│ ├── favicon.png
│ ├── index.html
│ ├── manifest.json
│ └── robots.txt
└── src
├── App.js
├── components
│ ├── common
│ │ ├── AuthTemplate.js
│ │ ├── Calendar.js
│ │ ├── Error.js
│ │ ├── Footer.js
│ │ ├── Header.js
│ │ ├── Loading.js
│ │ ├── Main.js
│ │ ├── Modal
│ │ │ ├── ConfirmModal.js
│ │ │ ├── EmailAuthModal.js
│ │ │ ├── LinkModal.js
│ │ │ ├── LogoutModal.js
│ │ │ ├── ModalPortal.js
│ │ │ ├── ResignModal.js
│ │ │ └── StretchingTagModal.js
│ │ ├── MoveLink.js
│ │ ├── Nav.js
│ │ ├── ReCaptcha.js
│ │ └── TitleWrapper.js
│ ├── elements
│ │ ├── Button.js
│ │ ├── GrayBg.js
│ │ ├── LikeButton.js
│ │ ├── NavProfileButton.js
│ │ ├── NavigationDropMenu.js
│ │ ├── NoContent.js
│ │ ├── Pagination.js
│ │ ├── ProfileDropMenu.js
│ │ ├── ProfileInput.js
│ │ ├── ProfileTitle.js
│ │ ├── StretchingItem.js
│ │ └── WeeklyCard.js
│ ├── findPassword
│ │ ├── EmailAuth.js
│ │ ├── ResetPassword.js
│ │ └── SendEmailAuth.js
│ ├── index
│ │ └── Index.js
│ ├── like
│ │ ├── Like.js
│ │ └── LikeStretchingItem.js
│ ├── profile
│ │ ├── PasswordChange.js
│ │ ├── Profile.js
│ │ └── Resign.js
│ ├── record
│ │ ├── Graph.js
│ │ ├── Leg.js
│ │ ├── Record.js
│ │ ├── Ruler.js
│ │ └── Shoulder.js
│ ├── sign
│ │ ├── AuthForm.js
│ │ ├── EmailAuth.js
│ │ └── SignForm.js
│ ├── stamp
│ │ ├── Calendar.js
│ │ ├── Stamp.js
│ │ └── Submit.js
│ └── stretching
│ ├── StretchingList.js
│ ├── StretchingMenu.js
│ └── detail
│ ├── StretchingDetail.js
│ ├── StretchingHeader.js
│ └── StretchingRecommend.js
├── hook
│ └── useAsync.js
├── index.css
├── index.js
├── lib
│ ├── PrivateRoute.js
│ └── PublicRoute.js
├── pages
│ ├── About.js
│ ├── Event.js
│ ├── IndexPage.js
│ ├── NotFound.js
│ ├── PrivacyPolicyPage.js
│ ├── like
│ │ └── LikePage.js
│ ├── profile
│ │ ├── PasswordChangePage.js
│ │ ├── ProfilePage.js
│ │ ├── ResignAfterPage.js
│ │ └── ResignPage.js
│ ├── record
│ │ ├── LegPage.js
│ │ ├── RecordPage.js
│ │ └── ShoulderPage.js
│ ├── sign
│ │ ├── EmailAuthPage.js
│ │ ├── FindPasswordPage.js
│ │ ├── KakaoRedirectPage.js
│ │ ├── SignInPage.js
│ │ └── SignUpPage.js
│ └── stretching
│ ├── StretchingDetailPage.js
│ └── StretchingListPage.js
├── reportWebVitals.js
├── services
│ ├── authAPI.js
│ └── defaultClient.js
├── setupProxy.js
├── setupTests.js
├── store
│ ├── auth
│ │ ├── authAsyncThunk.js
│ │ └── authSlice.js
│ └── index.js
├── styles
│ ├── FormWrapper.js
│ ├── StyledButton.js
│ ├── StyledInput.js
│ └── flexCenterAlign.js
├── theme.js
└── util
├── authNumRegex.js
├── calendarArr.js
├── date.js
├── emailRegex.js
├── nameRegex.js
├── passwordRegex.js
└── stretchingEnum.js
백오피스 BE
.
├── bin
│ └── www.js
├── config
│ ├── dev.js
│ ├── jwt.js
│ ├── operationEnv.js
│ ├── prod.js
│ └── redis.js
├── controllers
│ ├── admin.js
│ ├── common.js
│ ├── stretching.js
│ ├── user.js
│ └── week.js
├── dao
│ ├── admin.js
│ ├── common.js
│ ├── pool.js
│ ├── stretching.js
│ ├── user.js
│ └── week.js
├── index.js
├── labels.json
├── middleware
│ ├── auth.js
│ ├── validator
│ │ ├── admin.js
│ │ ├── common.js
│ │ ├── stretching.js
│ │ ├── user.js
│ │ └── week.js
│ └── validatorError.js
├── modules
│ ├── encrypt.js
│ ├── jwt.js
│ ├── multer.js
│ └── redis.js
├── package-lock.json
├── package.json
├── routes
│ ├── admin.js
│ ├── admin.spec.js
│ ├── common.js
│ ├── index.js
│ ├── stretching.js
│ ├── user.js
│ ├── user.spec.js
│ └── week.js
├── service
│ ├── admin.js
│ ├── common.js
│ ├── stretching.js
│ ├── user.js
│ └── week.js
└── utils
├── responseForm.js
├── responseMessage.js
├── sql.js
└── statusCode.js
백오피스 FE
.
├── README.md
├── labels.json
├── package-lock.json
├── package.json
├── public
│ ├── assets
│ │ └── images
│ │ ├── logo.png
│ │ └── movester-background.png
│ ├── favicon.png
│ ├── index.html
│ ├── manifest.json
│ └── robots.txt
└── src
├── App.js
├── components
│ ├── admin
│ │ ├── AdminCreate.js
│ │ ├── AdminList.js
│ │ ├── Login.js
│ │ └── PasswordChange.js
│ ├── common
│ │ ├── Content.js
│ │ ├── Home.js
│ │ ├── Main.js
│ │ ├── MenuItem.js
│ │ ├── Modal
│ │ │ ├── AdminDeleteModal.js
│ │ │ ├── ConfirmModal.js
│ │ │ ├── DeleteModal.js
│ │ │ ├── LogoutModal.js
│ │ │ ├── ModalPortal.js
│ │ │ ├── SearchModal.js
│ │ │ ├── StretchingDeleteModal.js
│ │ │ ├── UpdatePasswordModal.js
│ │ │ ├── WeekStretchingDeleteModal.js
│ │ │ └── searchStretching
│ │ │ ├── SearchStretching.js
│ │ │ ├── SearchStretchingModal.js
│ │ │ └── SearchStretchingPage.js
│ │ ├── Nav.js
│ │ ├── Pagination.js
│ │ ├── SearchStretching.js
│ │ ├── Winner.js
│ │ ├── button
│ │ │ └── Button.js
│ │ └── elements
│ │ ├── Center.js
│ │ ├── ContentBox.js
│ │ ├── Input.js
│ │ ├── InputBox.js
│ │ ├── InputTitle.js
│ │ ├── ListTable.js
│ │ ├── ListTableNumbering.js
│ │ ├── Loading.js
│ │ ├── ProfileInput.js
│ │ ├── SelectBox.js
│ │ ├── StyledButton.js
│ │ ├── UserCount.js
│ │ ├── UserTable.js
│ │ └── Year.js
│ ├── editor
│ │ └── Editor.js
│ ├── event
│ │ ├── EventDetail.js
│ │ ├── EventListComponent.js
│ │ ├── RegisterEvent.js
│ │ └── RegisterWinner.js
│ ├── stretching
│ │ ├── CreateStretching.js
│ │ ├── StretchingDetail.js
│ │ ├── StretchingList.js
│ │ └── UpdateStretching.js
│ ├── user
│ │ ├── UserDetailComponent.js
│ │ └── UserListComponent.js
│ └── weekStretching
│ ├── CreateWeekStretching.js
│ ├── UpdateWeekStretching.js
│ ├── WeekStretchingDetail.js
│ └── WeekStretchingList.js
├── config
│ └── s3.js
├── hooks
│ └── useInputs.js
├── index.css
├── index.js
├── pages
│ ├── admin
│ │ ├── AdminCreatePage.js
│ │ ├── AdminListPage.js
│ │ ├── LoginPage.js
│ │ └── PasswordChangePage.js
│ ├── event
│ │ ├── RegisterEventPage.js
│ │ └── index.js
│ ├── stretching
│ │ ├── CreateStretchingPage.js
│ │ ├── StretchingDetailPage.js
│ │ ├── StretchingListPage.js
│ │ └── UpdateStretchingPage.js
│ ├── user
│ │ └── index.js
│ └── weekStretching
│ ├── CreateWeekStretchingPage.js
│ ├── UpdateWeekStretchingPage.js
│ ├── WeekStretchingDetailPage.js
│ └── WeekStretchingListPage.js
├── reportWebVitals.js
├── services
│ ├── authAPI.js
│ └── defaultClient.js
├── setupProxy.js
├── setupTests.js
├── store
│ ├── auth
│ │ ├── authAsyncThunk.js
│ │ └── authSlice.js
│ └── index.js
├── theme.js
└── util
├── idRegex.js
├── listTableHeaders.js
├── nameRegex.js
├── navEnum.js
├── passwordRegex.js
├── readOnlyBlur.js
├── selectboxOptions.js
└── stretchingEnum.js





