![]()
오늘은 별점 기능(star rating)을 리액트로 구현하는 방법에 대하여 작성해보려고 한다 (੭˙ ˘ ˙)੭ 학교에서 졸업 프로젝트를 진행하던 도중, 별점 기능을 넣어야하는 일이 생겼었는데 그 기능을 작성해보려고 한다. 특히, 이번엔 별점 기능을 기존 라이브러리를 사용하여 구현하는 것이 아닌 직접 구현을 해보게 되었다. 우선 UI는 아래와 같이 작성하였다. 우측 셀렉트 박스로 평점을 매기면 좌측에 별이 차오르도록 구현하였다. 셀렉트 박스를 0~5 사이를 0.5씩 나눈 태그를 넣어 만들어두었으며 setRating으로 value를 저장해두었다 ! // option value 값을 저장한다 const [rating, setRating] = useState(); setRating(e.target.value)}..
![]()
복학 전 방학에 사진 콘텐츠 제작과 관련된 서비스를 제공하는 회사에서 프론트엔드 개발자로 일을 했던 적이 있다. ( 간단하게 말했지만 'AI 기술로 커머스 판매 제품 콘텐츠 제작을 돕는 툴을 개발'하는 회사라고 할 수 있겠다. ) 아무튼.. 이 서비스에서는 사진 업로드 기능이 필수적이었는데, 구현된 코드를 테스트 해보던 도중 갑작스럽게 작은 문제점(?)을 발견했고, 결론적으로는 구글링을 통해 문제를 해결했다. ( 감사합니다 구선생님들..♡ ) 특정 사진들이 업로드 되지 않는 문제였는데 확장자가 heic 인 경우 기존코드로 업로드가 되지 않았다. 이 날 처음 알게 된 확장자...HEIC... 어쨋거나 잘 해결했기에 블로그를 통해 한 번 정리해두면 나와 같은 문제를 겪는 사람들에게 도움이 될 것이라고 생각했..
