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