일상/React

React 공부 (with nico 4장)

Karice 2021. 1. 8. 12:05

4.0 Introduction to the Movie DB API

 

-API 키 받아오기

 

 

4.1 Sexy Networking with Axios Instances

//src에 api.js만들어줌
//yarn add axios 해주기

import axios from "axios";

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

export default api;

//기본 API주소에서 파라미터들 원하는거 주고 Axios로 받아오는거임

 

 

4.2 API Verbs Part One

export const moviesApi = {
    nowPlaying: () => api.get("movie/now_playing"),
    upcoming: () => api.get("movie/upcoming"),
    popular: () => api.get("movie/popular")
  };
  
export const tvApi = {
    topRated: () => api.get("tv/top_rated"),
    popular: () => api.get("tv/popular"),
    airingToday: () => api.get("tv/airing_today")
  };
  
  //API 불러오기

 

4.3 API Verbs Part Two 

 

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("search/movie", {
        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)
        }
      })
  };
  //조금 추가해서 search기능 만들었음.