2022/04/12 Final Project 발표 및 피드백

https://www.notion.so/4-GabojaGo-Muscle-Formula-71c94d49dd504a68b5e8a61f76197c3e

4. GabojaGo (Muscle Formula)

깃헙 링크 : https://github.com/codestates/MuscleFormula
배포 링크 : https://www.muscleformula.xyz/

발표 자료

내가 기여한 부분

• position : Front-end
• Stack : Typescript, React, Redux-toolkit, Styled-Component, CSS
• contributions
  • 리덕스 툴킷 세팅
  • 네비게이션 컴포넌트 작성
  • 캘린더 컴포넌트 작성
  • 운동기록 페이지 작성
  • 마이페이지 작성
  • 프로필 수정페이지 작성
  • 모달창, 탭 구현
  • CSS 전반 관리

• Design
  • components: Calendar, CalendarRecord, Footer, Loading, MyPostTab, Nav, NeedLogin, NoComment, NoPost, NoRecord, PhotoUploader, PostThumbnail, Record, Search, StarPoint, TodayKing, TodayRecord
  • pages: Detail, Editor, Landing, Login, Main, Mypage, Profile, Records, Share, Signup
  • modals: DeleteModal, PasswordModal, PhotoModal, QuitModal
• Common Component
  
  • Calendar, CalendarRecord, MyPostTab, Nav, Record, StarPoint, TodayKing, TodayRecord
• Page
  • Main, MyPage, Profile, Records, Share

질문

• 초 기록은 어떻게 구현했는지?
  • useEffect에서 setInterval 함수를 사용하여 1초마다 초 상태값을 1초씩 증가시키는 방식으로 구현했다.

useEffect(()=> {
    let interval :any = null;
    if(start) {
      interval = setInterval(()=> {
        getRecordValue(sec, idx);
        setSec((cur) => cur + 1);
      }, 1000);
    } else if (!start && sec !== 0) {
      clearInterval(interval);
    }
    return () => clearInterval(interval);
  },[start, sec, getRecordValue, idx]);

• 운동 기록 외에 휴식시간 설정에 대해 따로 생각하지 않았는지?
  • 따로 휴식시간에 대한 페이지나 UI를 생각하지 않았다. 멈춤 버튼만으로도 충분하다고 느꼈다. 하지만 그러한 질문을 통해 생각해보니, 휴식시간에 대한 UI적 볼거리를 제공하는 것도 필요하지 않았을까 싶은 생각이 든다.

피드백

1. 로그인을 꼭 하지 않아도 볼거리가 많아야한다. 많은 볼거리가 없는 것이 아쉽다.
2. 스택을 사용했을 때 프로젝트에 어떻게 적용했는지 그 원리에 대해 설명하면 좋을 듯 하다.

개선하고 싶은 점

1. 알림, 채팅 기능을 넣고자 했지만 활용 인력대비 시간이 부족했던 것이 아쉽다.
2. usememo 등의 기능을 이용해 불필요한 렌더링을 줄이는 방안을 강구했어야 했다.
3. 반응형에 좀 더 적합한 디자인에 대해 고민해보고 싶다.
4. 볼 거리가 많은 UI가 무엇인지, 어떻게 구현해야할지 고민해야할 듯 하다. 질문처럼 휴식시간이라는 아이디어를 생각해내지 못했던 것이 아쉽다.
5. Redux Toolkit의 createSlice 만 활용하고 나머지 미들웨어를 제대로 활용하지 못해서 아쉽다. 후에 버그 추적 등의 기능 들도 활용해보고 싶다.