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

고니의 개발 일지📚

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

고니의 개발 일지📚

검색하기 폼
  • 분류 전체보기 (55)
    • Computer Science 💻 (4)
      • 운영체제 (2)
      • 네트워크 (0)
      • 자료구조 (0)
      • 데이터베이스 (0)
    • 기초 문법📚 (6)
      • JS(ES6+) (6)
    • Algorithm 🤖 (7)
      • 백준 문제 (3)
      • 프로그래머스 (4)
    • 웹 개발 (4)
    • React (12)
      • Javascript (9)
      • Typescript (2)
      • 토이프로젝트 (1)
    • Ubuntu Linux 🐧 (22)
      • [컴퓨터시스템관리] 실습일지 (14)
      • [컴퓨터시스템관리] 실습과제 (8)
    • 자격증📜 (0)
  • 방명록

리액트커스텀훅 (1)
React) 버튼 누르면 스크롤 이동하는 Custom Hook 만들기

경주의 명소를 소개하는 토이프로젝트를 진행하는데 주제가 맛집 탐방, 야간 명소, 한옥 호텔로 총 3가지였다. 라우팅 하기에는 데이터가 적어서 한 화면에 컴포넌트를 모두 띄우는 대신, 메인 배너에서 버튼을 누르면 해당 컴포넌트로 이동하는 스크롤 기능을 만들고 싶어 찾아보다가 유용한 정보를 발견했다! useMoveScroll.ts import { useRef } from "react"; const useMoveScroll = () => { const element = useRef(null); const onMoveToElement = () => { element.current?.scrollIntoView({ behavior: "smooth", block: "start" }); }; return { eleme..

React/Typescript 2023. 6. 23. 17:25
이전 1 다음
이전 다음
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG
  • 리액트커스텀훅
  • 리액트버튼누르면스크롤이동
  • 리액트state
  • 스크롤내리면나타나는애니메이션
  • 프로세스
  • 리액트스크롤이벤트
  • CSS디자인
  • ReactAnimation
  • graphql
  • JS비동기
  • 자바스크립트문법
  • Graphql서버연결
  • 개인플젝
  • 자바스크립트미니프로젝트
  • 프로세스스레드차이
  • 숫자표현JS
  • 리액트스크롤애니메이션
  • 리액트
  • 자바스크립트프로그래머스
  • 웹디자인툴
  • 프로그래머스
  • 자바스크립트기초
  • graphql개념
  • 리액트독학
  • 토이프로젝트디자인
  • 가까운수js
  • 자바스크립트최단거리
  • 리액트스크롤
  • 무료목업레퍼런스사이트
  • 프로그래머스js
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

티스토리툴바