TIL day10 🚩

import { useEffect, useState } from "react";
import Movie from "./Movie";

function App() {
  const [loading, setLoading] = useState(true);
  const [movies, setMovies] = useState([]);
  const getMovies = async () => {
    const json = await (
      await fetch(
        `https://yts.mx/api/v2/list_movies.json?minimum_rating=8.8&sort_by=year`
      )
    ).json();
    setMovies(json.data.movies);
    setLoading(false);
  };
  // useEffect(() => {
  //   fetch(
  //     `https://yts.mx/api/v2/list_movies.json?minimum_rating=8.8&sort_by=year`
  //   ).then((response) =>
  //     response.json().then((json) => {
  //       setMovies(json.data.movies);
  //       setLoading(false);
  //     })
  //   );
  // }, []);
  useEffect(() => {
    getMovies();
  }, []);
  console.log(movies);
  return (
    <div>
      {loading ? (
        <h1>Loading...</h1>
      ) : (
        movies.map((movie) =>(<Movie mediumCoverImage={movie.medium_cover_image} />) )
      )}
    </div>
  );
}

export default App;

스크린 단위로 라우터 단위로 생각해야함
1라우트는 홈스크린 홈페이지
HOME 라우트에 전체 영화 목록이 나오게하고
나머지 MOVIE 라우트에는 하나의 영화에 대한 페이지가 나오게 할꺼임

내일 php에서 다른페이지 가는거 어케했는지 봐야지
근데 다 제이쿼리로 했던거같은디 암튼 내일 다른 코드보고 생각해보갯음