Movie API - constant & custom hooks

constant는 말 그대로 자주 쓰는 변수를 선언한 폴더를 만들어 export하고 다른 폴더에서 import 하는 기능을 위해 만든 것이다.

constant > index.js

export const API_KEY =
  "Bearer eyJhbGciOiJIUzI1NiJ9.eyJh...
export const IMG_BASE_URL = "https://image.tmdb.org/t/p/w500";

이미지를 불러오기 위한 기본 URL과 데이터를 불러오기 위한 조건인 KEY 값을 선언한 폴더다.

hooks > index.js / useGetData.js

hooks 폴더 안에는 두 파일이 존재한다. index와 useGetData. index에선

export * from "./useGetData";

이 한줄만 쓰이지만 한번 거쳐서 export하는 이유는 폴더를 import하면 index가 import 되기 때문에 편리성을 위한 조치라고 볼 수 있다.

useGetData

import axios from "axios";
import { useEffect, useState } from "react";

const useGetData = (url, options) => {
  const [results, setResults] = useState(null);
  useEffect(() => {
    const getData = async () => {
      const { data } = await axios.get(url, { ...options });
      setResults(data);
    };
    getData();
  }, [url]);
  return results;
};

export default useGetData;