2022-01-20 TIL

Fact

• 프로그래머스 FLO과제를 완성했다.
• ”[”[03:20:56]메리크리스마스 개발은 재미있어요”, [“03:20:56]데브 코스 꼭 붙었으면 좋겠다”]”라는 형식의 데이터를 서버로부터 받아온다 나는 redux thunk를 사용해서 비동기 처리를 했다. 데이터를 받아오면 정규식을 사용해서 [03:20:56]와 같이 재생시간이 담긴 배열, ”메리 크리스마스 개발은 재미있어요”라는 배열로 나눠서 Object Key value 값으로 각각 정의했다.
• 컴포넌트 간에 상태 전달에 고민을 좀 많이 했다. 음악이 흐를 때마다 현재 재생시간을 다른 컴포넌트에 지속적으로 반복해서 보내줘야 하고, 그 해당 시간을 받아서 맞는 가사를 출력해야 한다. 사실 다 했음에도 불구하고 효율적으로 했는지는 잘 모르겠다.
• 음악의 싱크를 맞추는 것이 힘들었다. 소수점까지 있다 보니, 음악의 재생시간과 가사 출력 싱크를 맞추는 게 내가 생각했던 것보다 어려웠던 것 같다.

• 구현한 것

  • 음악 재생화면
  • 재생 중인 음악 정보(제목, 가수, 앨범 커버 이미지, 앨범명)
  • 현재 재생 준 인 가사의 하이라이팅
  • Seekbar
  • Play/Stop
  • 전체 가사 보기 화면
  • 특정 가사로 이동할 수 있는 토글 버튼
  • 전체 가사 화면 닫기 버튼
  • Seekbar
  • play/Stop 버튼

Feelings

• 커밋을 나누지 않았다. 코드가 길지 않을 것이라 예상해서 금방 끝날 줄 알고 커밋을 안 하면서 했는데, 착오였다.
• redux를 사용하는 것이 익숙해지긴 했지만, 아직 많이 부족하다는 것을 느낀다. 내가 정말 맞게 쓰고 있는 건가라는 생각도 들기도 한다.
• 완성 못할 줄 알았는데 완성해서 뿌듯하다.

Findings

• redux 사용에 익숙해진 것 같다. 하지만 좀 더 프로답게 쓰려면 공부를 많이 해야 할 것 같다.

Future Action

• 다음에 프로젝트를 할 때는 커밋을 꼭 해야겠다.