fetch, Swiper, ActivityIndicator, Dimensions, BlurView, Scrollview

import styled from 'styled-components/native'
import Swiper from 'react-native-web-swiper'
import { NativeStackScreenProps } from '@react-navigation/native-stack'
import { ActivityIndicator, Dimensions } from 'react-native'
import { makeImgPath } from '../util'
import { BlurView } from 'expo-blur'

const API_KEY = '86d6efd228f2052ac88a791925717fc9'

const Container = styled.ScrollView``

const View = styled.View`
  flex: 1;
`
const Loader = styled.View`
  flex: 1;
  justify-content: center;
  align-items: center;
`

const BgImg = styled.Image`
  width: 100%;
  height: 100%;
  position: absolute;
`
const Title = styled.Text`
  font-size: 25;
  color: white;
`

const { height: SCREEN_HEIGHT } = Dimensions.get('window')

const Movies: React.FC<NativeStackScreenProps<any, 'Movies'>> = () => {
  const [loading, setLoading] = useState(true)
  const [nowPlaying, setNowPlaying] = useState([])
  const getNowPlaying = async () => {
    const { results } = await (
      await fetch(
        `https://api.themoviedb.org/3/movie/now_playing?api_key=${API_KEY}&language=en-US&page=1&region=KR`
      )
    ).json()
    setNowPlaying(results)
    setLoading(false)
  }

  useEffect(() => {
    getNowPlaying()
  })
  return loading ? (
    <Loader>
      <ActivityIndicator color="black" size="large" />
    </Loader>
  ) : (
    <Container>
      <Swiper
        loop
        timeout={2}
        controlsEnabled={false}
        containerStyle={{ width: '100%', height: SCREEN_HEIGHT / 4 }}
      >
        {nowPlaying.map((movie) => (
          <View
            key={movie.id}
            style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}
          >
            <BgImg source={{ uri: makeImgPath(movie.backdrop_path) }} />
            <BlurView>
              <Title>{movie.original_title}</Title>
            </BlurView>
          </View>
        ))}
      </Swiper>
    </Container>
  )
}

export default Movies

fetch,
Swiper,
ActivityIndicator,
Dimensions,
BlurView,
Scrollview
Movies 함수의 type
다 확인해볼것!!!!!