Skip to content

prography/10th-Motimo-FE

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

51 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🚀 Motimo

목표를 효과적으로 달성하는 방법, 모티모


모티모 포스터

버그 신고 · 기능 요청

데모 링크




📋 목차



📑 소개

  • 혼자 꾸준히 지속하기 어려운 기간이 긴 목표 달성. 모티모에서 다른 사람들과 함께 동기부여를 주며 목표를 달성해보세요!
  • 그룹방에서 여러 사람들이 투두를 달성하는 것을 보고 동기부여를 얻을 수 있어요!
  • 혼자가 아니라 함께하면 목표 달성률이 올라가요! 서로에게 동기부여를 주며 목표를 달성해봐요!



✨ 주요 기능

🌟 중장기 목표 설정

  목표 - 세부목표 - 투두 단계로 할 일을 세분화 할 수 있습니다.

🔥 기록 남기기

  투두를 완료 후 감정과 사진 등 기록을 남겨 상세히 정리할 수 있습니다.

💡 그룹

  그룹에 들어가 다른 사람들과 투두에 대해 상호작용하며 동기부여를 얻을 수 있습니다.

🎯 피드

  보다 많은 사람들의 목표와 달성 과정을 확인하며 동기부여를 얻을 수 있습니다.



🛠️ 기술 스택

Frontend

React TypeScript Next.js Tailwind CSS SWR Zustand

DevOps & Tools

GitHub Actions Vercel Chromatic Netlify



⭐ 주요 페이지 동작

온보딩

  • 회원가입 및 로그인
  • 목표 생성과정을 온보딩에 적용
-.Clipchamp.mp4

메인 페이지

  • 목표 선택 및 세부 목표별 투두 작성
  • 투두 결과 제출
  • 투두 수정 및 삭제
  • 목표 추가
default.webm

목표 상세 페이지

  • 세부 목표 완료, 목표 달성 처리
  • 투두 결과 제출
  • 목표명, 기간, 세부 목표 위치와 이름 수정 및 삭제
-.Clipchamp.mp4

그룹 페이지

  • 그룹 참여
  • 투두 완료, 결과 제출에 대한 리액션
  • 그룹 참여원 찌르기
default.webm

마이 페이지

  • 개인정보 및 관심사 수정
  • 달성한 목표 확인
  • 알림 설정
  • 로그아웃
default.webm



👥 팀

역할 이름 GitHub
Frontend Developer 이상현 @Hys-Lee
Frontend Developer 조형관 @devgony
Backend Developer 고범석 @qjatjr29
Backend Developer 이종은 @jongeuni
Project Owner 신동민 -
Designer 전석희 -

FE 역할 분담

이상현

  • UI
    • 페이지: 메인 페이지, 상세 페이지, 그룹 채팅방
    • 주요 공용 컴포넌트: 모달, 바텀시트
  • 기능
    • 모달, 바텀시트, 토스트 전역 커스텀 훅
    • 투두, 채팅 무한 스크롤
  • 개발
    • 스토리북 설정(plop.js) 및 공통 컴포넌트 디자인 시스템화(vercel), 패키지화.
    • 크로마틱 CI 적용
    • Figma 디자인 토큰 Tailwind 토큰화 (Token Studio, Style Dictionary)
    • 스테이징 배포 (netlify)

조형관

  • UI
    • 페이지: 온보딩, 마이 페이지, 그룹 페이지
    • 주요 공용 컴포넌트: 쿠퍼티노 피커, Lottie 로딩 애니메이션 컴포넌트
  • 기능
    • OAuth 로그인
    • 공통 api fetcher 제작
  • 개발
    • API 생성 (swagger-typescript-api)
    • Cursor 사용한 제작



🚀 Motimo 디자인 시스템 둘러보기

디자인 시스템 페이지

image 10th-motimo-storybook.vercel.app



Motimo 공통 컴포넌트 패키지

image

https://www.npmjs.com/package/motimo-shared-ui



🤝 기여하기

🐛 버그 신고

버그를 발견하셨나요? 이슈를 생성해주세요!

💡 기능 제안

새로운 기능을 제안하고 싶으시다면 토론에서 의견을 나눠주세요!



📄 라이선스

이 프로젝트는 MIT License 하에 배포됩니다. 자세한 내용은 LICENSE 파일을 참조하세요.



🙏 감사의 말

  • Vaul - 바텀 시트에 사용된 라이브러리
  • Motion - 애니메이션에 사용된 라이브러리
  • Contributors - 모든 기여자분들께 감사드립니다
  • Prography - 활발한 개발 환경 지원
  • Motimo 팀원들과 Progarphy 10기 분들



⭐ 이 프로젝트가 도움이 되셨다면 스타를 눌러주세요! ⭐

Made with ❤️

About

프로그라피 2팀 모티모 프론트엔드 레포지토리입니다.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 3

  •  
  •  
  •