>웹 프론트엔드 >JS 튜토리얼 >프레이머 모션 | 소개 - 1부

프레이머 모션 | 소개 - 1부

WBOY
WBOY원래의
2024-07-19 03:57:19926검색

소개

Framer Motion은 React 애플리케이션에 애니메이션을 쉽게 추가할 수 있는 라이브러리입니다. 전환, 드래그 상호작용 등의 애니메이션 효과를 추가하는 데 사용됩니다.

크리에이터

Framer라는 회사에서 만들었습니다. 프레이머는 사용자 인터페이스(UI) 디자인과 프로토타이핑을 위한 전문 툴을 개발하는 회사입니다.

설치

Framer는 React 18 이상 버전을 지원합니다. npm을 통해 설치하려면 다음 명령을 실행하세요.

npm install framer-motion

Framer Motion 라이브러리는 종속성이 없으며 단일 패키지로 사용할 수 있습니다.

Image description
Image description

2024년 7월 10일 현재 Framer Motion은 npm에서 주간 약 340만 건의 다운로드 수, GitHub에서 별표 22,700개를 기록하여 사용자들의 상당한 감사를 받고 있습니다.

사용방법

원하는 구성요소 내에서 framer-motion 라이브러리에서 motion 객체를 가져오고 모션 구성요소를 추가할 수 있습니다. 모든 HTML 또는 SVG 요소.

import { motion } from "framer-motion";

export default function App() {
  return <motion.div />;
}

위 내용은 프레이머 모션 | 소개 - 1부의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.