UI개발 (2) 썸네일형 리스트형 [motion] React에서 useScroll 훅 가이드 - 옵션과 사용법 정리 useSpring은 스프링 애니메이션을 구현하는 데 사용되는 훅입니다. 이 훅은 값을 변경할 때 자연스러운 스프링 물리 효과를 적용하여 부드러운 애니메이션을 제공합니다. useSpring의 사용 방법과 설정 옵션을 공식 문서를 바탕으로 정리해 보겠습니다.사용 방법1. 직접적인 값 설정useSpring을 초기 값과 함께 사용하여 스프링 애니메이션을 생성할 수 있습니다.예: const x = useSpring(0)와 같이 초기 값을 설정하고, x.set(100)으로 값을 변경하면 스프링 애니메이션으로 100으로 전환됩니다.즉시 값을 변경하고 싶다면 x.jump(100)을 사용할 수 있습니다.2. 다른 모션 값 추적다른 모션 값을 전달하여 그 값이 변경될 때마다 스프링 애니메이션을 적용할 수 있습니다.예: c.. [Next.js] Next.js 15의 새로운 Form 컴포넌트 가이드 기존 form 과의 주요 차이점 로딩 UI의 프리페칭 가능 ( 화면 미리 불러오기 )form 제출 시 부드럽게 페이지 전환 (깜빡임 없음) : 클라이언트 사이드 네비게이션preventDefault() 기본 수행쿼리 파라미터 를 name 속성에 맞춰 자동으로 붙여줌 기본 작성법import Form from 'next/form'function SearchForm() { return ( 검색 )} input name='query' 은 자동으로 쿼리 파라미터를 붙이는 기능입니다.url이 이렇게 됩니다 ......./search?query='인풋에서 쓴 내용' 컴포넌트의 동작은 액션 프로퍼티가 문자열인지 함수인지에 따라 달라집니다. 1. 액션이 문자열인 경우 은 .. 이전 1 다음
