How can I create animations using Framer Motion?

How can I create animations using Framer Motion?

Framer Motion is a powerful library for React that makes it easy to create animations. What specific animation are you looking to implement?

I want to create a simple fade-in effect for a component.

You can achieve a fade-in effect by using the motion.div component and the initial, animate, and exit props. Would you like a code example?

Yes, please provide a code example.

Here's a simple example:

import { motion } from 'framer-motion';

const FadeInComponent = () => {
  return (
    <motion.div
      initial={{ opacity: 0 }}
      animate={{ opacity: 1 }}
      exit={{ opacity: 0 }}
      transition={{ duration: 0.5 }}
    >
      Hello, I fade in!
    </motion.div>
  );
};

This will create a fade-in effect when the component mounts.