React Native: How to use the Animated API for a fade-in-up animation?

1import { Animated } from "react-native";
2
3function FadeInView({ children }) {
4  const fadeAnim = useRef(new Animated.Value(0)).current;
5  const slideAnim = useRef(new Animated.Value(30)).current;
6
7  useEffect(() => {
8    Animated.parallel([
9      Animated.timing(fadeAnim, {
10        toValue: 1,
11        duration: 500,
12        useNativeDriver: true,
13      }),
14      Animated.spring(slideAnim, {
15        toValue: 0,
16        friction: 8,
17        useNativeDriver: true,
18      }),
19    ]).start();
20  }, []);
21
22  return (
23    <Animated.View style={{
24      opacity: fadeAnim,
25      transform: [{ translateY: slideAnim }],
26    }}>
27      {children}
28    </Animated.View>
29  );
30}