[React Native] React Native로 날씨앱 만들기 (8) - API 사용하기

날씨 데이터를 가져오기 위해 사용할 API는 아래의 웹 사이트에서 얻을 수 있다.

openweathermap.org/api

Weather API - OpenWeatherMap

 

회원가입을 하면 API key를 확인할 수 있다.

API key를 복사해서 app.js 로가서 const 로 만들자.

 

내가 필요한 API는 Current Weather Data 이다.

데이터를 가져오는 많은 방법이 있지만 내가 할 수 있는 방법은 By geographic coordinates 이다.

 

브라우저에서 API를 호출해보자. lat과 lon과 API key만 알면 된다.

http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139&appid={API key}

매우 잘나오는것을 확인한다.

이제 거의다 왔다. 데이터들을 fetch하기 위해서 Axios를 설치한다.

 

또 날씨정보를 가져오는 getWeather()함수를 만든다.

 

참고로 위와 같이 문자열 사이에 변수를 넣을 때는 쌍따옴표나 싱글 따옴표가 아닌 백틱(`)을 사용해야 한다.

${변수} <- 이건 template string 이라고 부르는데 자바스크립트의 es6이다.

 

이제 API를 호출하는 법을 알았다. 다음 포스트부터는 얻은 데이터로 App을 꾸미는것을 해볼 것이다.