Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
Tags
- TiMER
- Hook
- 자바스크립트
- 바닐라 자바스크립트
- vanilla js
- 코코아톡
- react-native
- 클론코딩
- javascript
- react
- Firebase
- expo
- Clone
- 느낀 점
- Vanilla
- 마무리
- Netflix
- Nomad
- Nomad coder
- react-hook
- CSS
- 오류
- scflix
- HTML
- coding
- github
- Project
- Nicolas
- 계획
- 프로젝트
Archives
- Today
- Total
꾸매코딩
[Netflix] Star Rating 구현 본문
반응형
결과
각 포스터에 나오던 평점을 점수에 맞게 별 모양으로 출력되도록 하였다.
Detail 페이지에 나오는 평점을 평점 점수에 맞게 별 모양으로 출력되도록 하였다.
Star Rating
npm i react-star-ratings을 활용하여 만들었다.
해보려고 이런 저런 시도를 하다가, 잘 만들어진 라이브러리가 있어서 이용하였다.
설명이 잘 되어있으니 참고하여 필요에 맞게 사용하면 될 것 같다.
https://www.npmjs.com/package/react-star-ratings
수정
포스터 상단에 [기본 정보 / 무비 클립 / 시즌 정보]를 클릭하면 각각의 내용을 나타내려 하였는데,
router를 통해 새로운 페이지에 출력을 하려 하니 중복되는 요인들이 너무 많아서 다른 방법을 찾아보고 있다.
계획
수정에 기록한 내용을 계속 생각하면서 Search (검색) 기능을 만들 예정이다.
TV와 영화 페이지에 영화를 출력해주는것이 마음에 안들어서 배치를 다르게 해줄 예정이다.
배치를 스크롤이 바닥에 닿으면 새로운 데이터를 불러오기 적합하게 변경해줄 생각이다.
코드
https://github.com/ssc9811/scflix-hook
반응형