Skip to content

movester/movester_server_backoffice

Repository files navigation

MOVESTER : 1일 1스트레칭 습관만들기

logo

MOVE : 부담스러운 운동은 NO!

START : 가볍게 스트레칭으로 시작하세요!

WITH, TOGETHER : 혼자가 아닌 뭅스터와 같이, 함께해요!


누구나, 어디서든, 가볍게 할 수 있는 스트레칭을 소개하여,

바쁜 현대인들의 일상 속, 몸과 마음을 위한 시간을 틈틈이 만들어가자 는 취지로 시작하였습니다.


2021년부터 네이버 블로그, 카카오 오픈채팅방으로 시작한 서비스이며,

더 많은 사용자에게, 더 좋은 편의성(찜, 출석포인트 등)을 제공하고자 웹서비스로 제작하게 되었습니다.


뭅스터 웹사이트 바로가기 : https://movester.kr

뭅스터 어드민 웹사이트 바로가기 : https://movester-admin.shop



프로젝트 기간

스크린샷 2022-05-18 오후 2 09 49



프로젝트 인원

Role Member
Full-Stack, Web-Design 조나현
Mentor 최용권



화면 미리보기

  • 서비스 웹사이트

product


  • 관리자 웹사이트

backoffice



주요 기능

프로덕트

  • 맞춤 스트레칭 검색 (부위별, 자세별, 효과별, 태그별 스트레칭 검색)
    • 신체부위별로 원하는 스트레칭을 찾아볼 수 있도록 하였습니다.
    • 내가 원하는 스트레칭을 손쉽게 찾아보세요.
  • 일주일 추천 스트레칭
    • 나에게 딱 맞는 스트레칭을 고르기 귀찮다면, 뭅스터가 추천해주는 일주일 스트레칭을 따라해보세요!
  • 찜한 스트레칭 리스트
    • 나에게 필요한 스트레칭만 골라 찜 리스트에 담아보세요!
    • 오로지 나만을 위한 맞춤형 스트레칭 공간입니다.
  • 유연성 셀프 측정 및 기록 시스템
    • 유연성 유지 및 향상은 몸 건강의 지표입니다.
    • 꾸준한 기록을 통해 어제보다 나은 오늘의 나로 함께 나아가요.
  • 매달 진행하는 출석 이벤트
    • 매일 뭅스터와 함께 스트레칭하며, 출석 도장을 찍어보세요.
    • 매달 말일, 출석왕을 위해 뭅스터가 특별한 선물을 준비했어요!

백오피스

  • 관리자 계정 관리
    • 로그인, 관리자 조회, 관리자 계정 등록/삭제, 비밀번호 변경
  • 회원 검색 및 조회
    • 회원 정보, 월별 누적 포인트, 부위별 기록 조회
  • 스트레칭 CRUD
    • 스트레칭 검색 및 조회
    • 스트레칭 등록/수정/삭제
    • 일주일 스트레칭 조회
    • 일주일 스트레칭 등록/수정/삭제
    • 노출할 일주일 스트레칭 관리



기술 스택

BE

             

FE

         

INFRA

EC2, RDS, S3, Route53,    

DEV TOOL

           



개발

BE

  • Javascript, Node.jsExpressREST API 구현 (회원, 스트레칭 등등의 CRUD)
  • MVC 패턴 구조 [Controller > Service > Dao]
  • KakaoOauth 활용한 회원 계정 관리
  • Redis 활용한 회원 세션 관리
  • JWT 활용한 인증 체계 구축
  • Bcrypt 활용한 비밀번호 암호화 관리
  • Nodemailer 활용한 메일 전송
  • Sentry 활용한 에러 수집 및 Slack 으로 에러 메세지 전송

FE

  • Javascript, ReactCSR, SPA 구현
  • Styled-component 활용한 컴포넌트 스타일링
  • Redux-toolkit 활용한 전역 상태 관리
  • Ìmmer 활용한 전역 데이터 불변성 유지
  • Axios 활용한 API 요청
  • Quill, Recharts, rc-slider 활용한 사용자 입력 데이터 시각화

INFRA

  • ÀWS EC2 활용한 클라우드 서버 세팅
  • ÀWS RDS 활용한 클라우드 DB 세팅
  • ÀWS S3 활용한 클라우드 스토리지 세팅
  • ÀWS Route53 활용한 호스팅
  • NGINX 활용한 리버스 프록시
  • PM2 활용한 무중단 서비스 세팅



프로젝트 관리

  • 주 단위 스프린트 회의를 통한 이슈 및 티켓 관리
  • Figma 활용한 프로토타입 구축
  • Notion 활용한 프로젝트 기획 및 관리
  • Slack 활용한 멤버 간 소통
  • MySQL Worckbentch 활용한 데이터베이스 관리
  • Postman 활용한 API 테스트 및 문서화
  • Sentry, Slack 활용한 실시간 에러 모니터링
  • Prettier, ESlint 활용한 코드 스타일 관리



디렉터리 구조

BE : MVC 패턴

  • Routes : REST API 요청을 받아, 라우팅 > Middleware 호출 > Controller 호출
  • Controller : Request 받아, 유효성 검증 후 Service 호출 > Response 반환
  • Service : 비지니스 로직 처리, Dao 호출
  • Dao : DB에 접근하여 데이터 조회 및 가공
  • Middleware : Controller 호출 전, 공통적으로 적용되는 로직 처리
  • Modules : 외부 라이브러리를 활용한 공통 함수
  • Util : 공통적으로 사용되는 사용자 정의 함수

FE : presentational & container 패턴

  • Page : container component 역할. API 요청 및 state 관리 후 Componentprops 전달
  • 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



프로젝트 아키텍처

스크린샷 2022-05-18 오후 3 34 05



프로젝트 IA

스크린샷 2022-05-18 오후 3 38 49

About

뭅스터 : 백오피스 서버 🔙 💻

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors