cavas

React Canvas로 폭죽 효과 만들기

이 글은 2021년 5월 1일에 작성되었습니다. 최근 Canvas에 관심이 생겨 뭐라도 따라 해 봐야겠다는 생각을 했습니다. 그러던 중 캔버스의 좋은 예제를 찾게 되었고 해당코드를 react로 변경해 보면서 캔버스의 전체적인 틀을 이해해 보는 시간을 갖게 되었습니다. 코드를 공개해 준 김병찬 님께 감사의 인사를 드립니다. 공개된 코드를 기반으로 폭죽 배경을 Canvas로 그려봤습니다. 1. 선이미지와 텍스트 그리고 배경색은 Html과 CSS로 간단하게 만들고 해당 페이지의 canvas 태그를 쓰고 해당 캔버스를 useRef로 참조합니다. import React, { useEffect, useRef, useState } from "react"; import Firecracker from "../../com..