강태풍의 개발블로그

1️⃣ 개요 환경은 React와 typescript, styled-components 를 사용했습니다. Styled-Components 는 Props 를 받아서 CSS 속성을 동적으로 변경해줄 수 있습니다. npm install -D styled-components Progress Bar가 위 그림에서 회색 전체 진행바 부분이고, 파란색 부분은 Progress 입니다. 파란색 Progress의 width를 조정하여 왼쪽부터 채우는 원리다. 위 사진에 border-radius를 씌우면 귀염귀염한 진행 바를 확인할 수 있다. import {useEffect, useState, useRef} from "react"; import styled from "styled-components"; interface IT..