node.js_axios,crawling

import axios from 'axios'

function Ex01(){
 fuction getMovies(){
 	const url='http~'
    
    //axios라는 비동기 통신 방법으로 이 url과 통신하겠습니다!
    const result = axios.get(url)
    console.log(result) //result 에 정보가 담긴다
 프로미스 타입의 데이터다 > 어신크 어웨이트 필요
 
 순차처리가 안되면 프로미스타입으로 반환되고
 어싱크 어웨잇을 넣으면 순차처리되고 제이슨파일로 반환이 된다.
 }
}

import { useEffect, useState } from 'react'
import axios from 'axios' //비동기통신 axios

function Ex01() {
    
    const [movieArray, setMovieArray] = useState([])
    async function getMovies() {



        //json유알엘 사이트 https://www.kobis.or.kr/kobisopenapi/homepg/apiservice/searchServiceInfo.do
        const url = 'http://kobis.or.kr/kobisopenapi/webservice/rest/boxoffice/searchDailyBoxOfficeList.json?key=f5eef3421c602c6cb7ea224104795888&targetDt=20120101'

        //axios비동기통신방법으로 통신을진행하겟습니다
        const result = await axios.get(url);
        //async~await를적지 않는다면 통신에 대한 응답값으로 프로미스 타입이 반환되어진다
        //그이유는 화면을 구성하는 컴포넌트 들이 요청을 보낼 떄 순차적으로 요청을 처리해야하기때문
        //console.log(result);
        console.log(result.data);
        console.log(result.data.boxOfficeResult.dailyBoxOfficeList[0].movieNm);
        console.log(result.data.boxOfficeResult.dailyBoxOfficeList);

        //10개영화데이터배열result.data.boxOfficeResult.dailyBoxOfficeList
        setMovieArray(result.data.boxOfficeResult.dailyBoxOfficeList) //movieArray 10개영화담긴배열로


    }


    return (
        <>
            <h1>영화데이터확인페이지</h1>
            <button onClick={getMovies}>영화정보가져오기</button>
            <table border='1'>
                <tr>
                    <td>순위</td>
                    <td>제목</td>
                    <td>개봉일</td>
                </tr>


                {movieArray.map(function (movie) {
                    return (
                        <tr>
                            <td>{movie.rank}</td>
                            <td>{movie.movieNm}</td>
                            <td>{movie.openDt}</td>
                        </tr>
                    )
                })}
                

            </table>

        </>
    )
}
export default Ex01