본문 바로가기 메뉴 바로가기

나보단 잘하자

프로필사진
  • 글쓰기
  • 관리
  • 태그
  • 방명록
  • RSS

나보단 잘하자

검색하기 폼
  • 분류 전체보기 (256)
    • TIL Today I Learned (124)
    • Projects (9)
      • 원클릭 성적확인 서비스 (3)
      • 감정음악기록장 (6)
    • Basic_Studies (108)
      • 웹지식 (3)
      • Python (8)
      • HTML (2)
      • CSS (9)
      • Node.js (3)
      • JavaScript (18)
      • jQuery (3)
      • Vue.js & Nuxt.js (6)
      • React & Next.js (18)
      • 알고리즘 이론 (7)
      • 알고리즘 문제풀이 (20)
      • 그외 (11)
    • ERROR COLLECTION (13)
    • 나에게 하고싶은 말 (0)
    • 생각들 (1)
  • 방명록

nextjs 스크롤 (1)
[Next.js] 클릭 한 후기 자동 스크롤, 포커싱 주기

분명 어디선가 본 것 같은데... 예시를 못 찾겠다ㅜㅜ 상세페이지에 해당 상품의 후기가 10개 정도 올라와 있고, 이 후기 중에 원하는 후기 하나를 누르면 후기 전체 페이지에서 클릭한 후기로 자동 스크롤되고 반짝이며 포커싱 되는 기능이다. 물론 구현을 위해서는 백엔드 쪽에서 데이터에 해당 후기의 고유번호를 넣어주어야 한다. 간단히 필수적인 기능들만 들어간 페이지 두 개로 실습해보자. 데이터는 목데이터로 단순하게 넣을 것이다. 참고로 기능만 집중적으로 살펴 볼 예정이기 때문에 전체 파일의 코드를 언급하지는 않으려고 한다. 혹시나 필요하신 분이 계시면 댓글 달아주세요... 깃허브에 올리겠습니다... 기본 세팅은 아래와 같다. pages > review > index.js 리뷰를 10개만 보여주는 미리보기 페..

Basic_Studies/React & Next.js 2022. 7. 18. 14:53
이전 1 다음
이전 다음
반응형
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG
  • 자바스크립트
  • 리액트 라우터
  • 리액트 파라미터 넘기기
  • 파이썬 크롤링
  • 10989 파이썬
  • vscode venv
  • 글래스모피즘 구현
  • NextJS
  • bs4 크롤링
  • 리액트 스크롤
  • nextjs 파라미터 넘기기
  • 움직이는 글래스모피즘
  • 글래스모피즘 애니메이션 구현
  • 화이팅
  • nuxt 공식문서
  • Til
  • 백준 10989 파이썬
  • react router
  • css 글래스모피즘
  • 리액트
  • getserversideprops redirect
  • 카페음료테스트
  • next.js 리다이렉트
  • css marquee
  • dvd 효과
  • 리액트 컴포넌트
  • 파이썬 정렬
  • nuxt 공식문서 한글
  • 파이썬 flask
  • nextjs 스크롤
more
«   2025/05   »
일 월 화 수 목 금 토
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
글 보관함

Blog is powered by Tistory / Designed by Tistory

티스토리툴바