[Next.js] 클릭 한 후기 자동 스크롤, 포커싱 주기
분명 어디선가 본 것 같은데... 예시를 못 찾겠다ㅜㅜ 상세페이지에 해당 상품의 후기가 10개 정도 올라와 있고, 이 후기 중에 원하는 후기 하나를 누르면 후기 전체 페이지에서 클릭한 후기로 자동 스크롤되고 반짝이며 포커싱 되는 기능이다. 물론 구현을 위해서는 백엔드 쪽에서 데이터에 해당 후기의 고유번호를 넣어주어야 한다. 간단히 필수적인 기능들만 들어간 페이지 두 개로 실습해보자. 데이터는 목데이터로 단순하게 넣을 것이다. 참고로 기능만 집중적으로 살펴 볼 예정이기 때문에 전체 파일의 코드를 언급하지는 않으려고 한다. 혹시나 필요하신 분이 계시면 댓글 달아주세요... 깃허브에 올리겠습니다... 기본 세팅은 아래와 같다. pages > review > index.js 리뷰를 10개만 보여주는 미리보기 페..
Basic_Studies/React & Next.js
2022. 7. 18. 14:53
반응형
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- 10989 파이썬
- bs4 크롤링
- nuxt 공식문서
- 파이썬 정렬
- nuxt 공식문서 한글
- 리액트 라우터
- NextJS
- css marquee
- vscode venv
- 리액트 파라미터 넘기기
- Til
- 글래스모피즘 구현
- 자바스크립트
- 화이팅
- next.js 리다이렉트
- 리액트
- nextjs 파라미터 넘기기
- 파이썬 flask
- react router
- 리액트 컴포넌트
- 카페음료테스트
- 파이썬 크롤링
- nextjs 스크롤
- css 글래스모피즘
- 백준 10989 파이썬
- getserversideprops redirect
- 움직이는 글래스모피즘
- 리액트 스크롤
- 글래스모피즘 애니메이션 구현
- dvd 효과
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
글 보관함