React로 서비스를 개발하다보면 사용자 입력을 받아 처리하는 서식, 즉 form 형태를 많이 만들어야 한다. 대표적인 form으로는 모든 서비스에 거의 다 있는 로그인 기능이다. 아래는 React에서 Typescript 기반으로 작성한 단순한 로그인 form 예시다. import React, { ReactElement } from 'react'; interface LoginForm { email: string; password: string; } export default function Login() { const [email, setEmail] = React.useState('') const [password, setPassword] = React.useState('') const handleSub..

개요 별점을 주는 기능은 매우 흔하게 쓰이는 컴포넌트지만 구현하기는 꽤 까다로운 기능이다. 마우스를 별에 가져가면 별점이 자동으로 올라가게 만들거나, 클릭을 통해 별점을 지정하는 등 다양하게 만들 수 있다. React에는 react-star-rating-component react-star-rating-component React component for star (or any other icon based) ratings www.npmjs.com 위와 같은 라이브러리가 있다. 하지만 Typescript를 지원하지 않아서 React + Typescript 프로젝트를 진행하거나 간단한 구현을 원한다면 이 포스팅을 참고 하시길 바란다. Html 요소 별점을 나타내는 html 요소에는 많은 방법이 있다. 실제..