전 블로그에 바이낸스 api로 트레이딩뷰에서 제공하는
lightweight-charts
를 활용해 차트를 만들어보겠다
우선 활용을 위한 돔을 만들어준다.
const chartContainerRef = useRef<HTMLDivElement>(null);
const chartInstance = useRef<IChartApi | null>(null);
const seriesInstance = useRef<ISeriesApi<"Candlestick"> | null>(null);
그 후 fetch를 사용중이기 때문에 useEffect를 호출해 데이터 가공 및 차트를 만들어준다.


그리고 이제 렌더링 된 화면을 보자

그런데 차트가 뭔가 이상하다 다음시간에 디버깅을 해보자...
'nextJs' 카테고리의 다른 글
| 바이낸스 api 호출하여 시가총액 50 차트 보여주기 (0) | 2025.10.16 |
|---|---|
| nextJs로 투자 차트 불러오기 (2) | 2025.09.22 |
| nextJs의 ErrorHandling (0) | 2025.09.16 |