React api.js

TMDB API

    TMDB에서 로그인을 하면 API 키를 발급 받을 수 있다.

  React Netflix app을 만들기 위해 서버와 DB는 The Movie Database API를 사용하기로 했다.

TMDB API

이 중 Movies, Search와 TV API를 사용할 것이다.

src/api.js

  큰 프로젝트가 아니라서 api.js 라는 한 개의 파일만을 만들고 이 안에 moviesAPi와 tvApi를 모아뒀다.

import axios from "axios";

const api = axios.create({
  baseURL: "https://api.themoviedb.org/3/",
  params: {
    api_key: process.env.REACT_APP_TMDB_API,
    language: "en-US",
  },
});

export const moviesApi = {
  nowPlaying: () => api.get("movie/now_playing"),
  upcoming: () => api.get("movie/upcoming"),
  popular: () => api.get("movie/popular"),
  movieDetail: (id) =>
    api.get(`movie/${id}`, {
      params: {
        append_to_response: "videos",
      },
    }),
  search: (term) =>
    api.get("movie/search", {
      params: {
        query: encodeURIComponent(term),
      },
    }),
};

export const tvApi = {
  topRated: () => api.get("tv/top_rated"),
  popular: () => api.get("tv/popular"),
  airingToday: () => api.get("tv/airing_today"),
  showDetail: (id) =>
    api.get(`tv/${id}`, {
      params: {
        append_to_response: "videos",
      },
    }),
  search: (term) =>
    api.get("search/tv", {
      params: {
        query: encodeURIComponent(term),
      },
    }),
};

참고 자료

• 노마드 코더의 React 멤버쉽 강의
• The Movie Database API
• themoviedb.org

소스 코드

github.com/zpskek/Nomflix-v2/commit/1c687b13adf73e577a2c567f32b38074d4971166