--> 서버가 제공하는 도메인을 그대로 사용하는 형식으로 진행
API를 통해 날씨 데이터 가져오는 순서
1) 현재 위치(좌표) 데이터 필요, 가져오기
--> 어디의 날씨인지 알아야 하기 때문
https://velog.io/@odesay97/%EC%95%B1%EA%B3%BC-%EC%84%9C%EB%B2%84-%EB%82%A0%EC%94%A8-%EC%84%9C%EB%B2%84-%EC%99%B8%EB%B6%80-API-1-%ED%9C%B4%EB%8C%80%ED%8F%B0-%EC%9C%84%EC%B9%98-%EA%B0%80%EC%A0%B8%EC%98%A4%EA%B8%B0
2) 위치 데이터를 이용하여 현재 위치 날씨 데이터 가져오기
Weather API 공식문서 : https://openweathermap.org/api
Weather API로 받은 데이터를 읽는 방법 : https://openweathermap.org/current
--> 서버에서 제공하는 도메인 형식의 API 사용을 위한 도구
yarn add axios
--> 도구 설치
import * as Location from "expo-location";
import axios from "axios"
const getLocation = async () => {
//수많은 로직중에 에러가 발생하면
//해당 에러를 포착하여 로직을 멈추고,에러를 해결하기 위한 catch 영역 로직이 실행
try {
//자바스크립트 함수의 실행순서를 고정하기 위해 쓰는 async,await
await Location.requestPermissionsAsync();
const locationData= await Location.getCurrentPositionAsync();
const latitude = locationData['coords']['latitude']
const longitude = locationData['coords']['longitude']
const API_KEY = "cfc258c75e1da2149c33daffd07a911d";
const result = await axios.get(
`http://api.openweathermap.org/data/2.5/weather?lat=${latitude}&lon=${longitude}&appid=${API_KEY}&units=metric`
);
......
--> 외부 API를 사용하는 작업으로 함수 순서가 뒤섞일 수 있기 떄문에 async, await 선언으로 함수 순서를 고정해줌
--> 현재 스마트폰 위치를 받아서 날씨 API를 실행하기 위해 필요한 데이터를 수집( 현재 위치 )
--> API_KEY를 해당 API를 제공하는 곳에서 미리 받아서 확보해놓음
--> axios.get('해당 API를 사용하기 위해 필요한 데이터와 API_KEY가 포함된 도메인')
http://api.openweathermap.org/data/2.5/weather?lat=${latitude}&lon=${longitude}&appid=${API_KEY}&units=metric
--> latitude,logitude등의 위치데이터와 API_KEY가 도메인에 포함되어 있음
axios.get('필요한 데이터와 API키가 포함된 도메인')
const temp = result.data.main.temp;
const condition = result.data.weather[0].main
--> 데이터는 딕셔너리가 여러겹으로 이루어진 경우가 많음
따라서 위의 코드처럼 필요한 데이터를 찾기 위해 데이터의 구조를 파악하여 접근해야함
temp = result 변수(API로부터 데이터를 받아 저장한 변수, JSON형태)의 data딕셔너리에 있는 main키의 값(딕셔너리)에 있는 temp키의 값(데이터--> 온도)
--> 이런 느낌으로 API에게 받은 데이터에서 필요한 정보까지 파내려가야함
--> 가장 상단에 있는 API 데이터 읽는 방법에 대한 공식문서를 참고하는 등의 방법 사용