visualizer 구현

context가 undefined..

pull을 받은 이후로 visualizer가 제대로 작동하질않는다.

일단 이유는 AudioContext를 담은 변수가 undefined가 되는것이었는데,

왜 그런지 이것저것 확인해봤다.

visualizer를 구현한 컴포넌트는 상위 컴포넌트에서 선택한 음악 state를 props로 전달받는다.
이 props가 상위 컴포넌트의 초기값으로 되어있었다.

그렇다는것은 확실하진 않지만 예상하건데
다른 컴포넌트에서 state가 변경되어 리 렌더링 되면서 초기값으로 다시 설정 되는것같다.
1분 미리듣기때처럼 변수에 담았기에 리 렌더링 되면서 사라지는것이다.

우선 선택한 곡도 사라지기에 선택한 곡 상태부터 되 살려보기로했다.
상위 컴포넌트를 없애고 visualizer컴포넌트에서 선택한 곡을 그대로 받기로 했다.
대신, 선택한 곡을 state가 아닌 값으로 기억해둬야한다.
이를 localstorage를 이용하여 값을 기억하기로 했다.

음원 상세페이지에서 visualizer로 가는 버튼을 누를시 해당곡의 id, src값 등등
음원 상세 정보를 localstorage에 저장시킨다.
그 다음 visualizer로 history push가 되는데
최초 렌더링시 localstorage의 값을 state에 각각 지정시켜줬다.

오늘은 여기까지..

프로젝트의 코드의 양이 점점 많아지니 슬슬 sideEffect 가 발생한다.
핵심 기능인 visualizer에서 계속 말썽이 생기니 불안하다..
그래도 매번 방법을 구상하고 적용시키는 모습을 보니 조금은 개발이라는 것에 적응하는 것 같다.