Axios

Axios는 전 세계에서 가장 사랑받는 HTTP 클라이언트 라이브러리다. Axios는 Vue에서만 사용되도록 만들어진 라이브러리가 아닌 자바스크립트 라이브러리이기 때문에 한번 사용법을 익혀둔다면, Vue로 작성된 프로젝트뿐 아닌 다른 프로젝트에서도 유용하게 사용할 수 있기 때문에 익혀놓는 것이 좋다.

 

Vue CLI를 사용하여 프로젝트 진행시, npm 을 사용하면 간단히 Axios를 설치할 수 있다.

npm install axios --save

**Bower는 FE웹개발에 사용되는 패키지 관리 도구로, FE패키지 설치와 관리에 중점을 둔다. 반면, NPM은 Node.js 생태계에서 사용되는 패키지관리 도구로, 서버측 Javascript 개발에 사용되는 패키지를 설치하고 관리하는 데 중점을 둔다.

 

Axios는 HTTP 통신을 위한 라이브러리이기 때문에 기본적으로 HTTP 메소드를 기반으로 한 API를 제공해준다. ?가 붙은 인자들은 필수가 아니라, 필요에 따라 선택할 수 있는 인자들이다. 

axios.get(url, config?) // GET 메소드를 사용하여 자원을 조회한다
axios.post(url, data?, config?) // POST 메소드를 사용하여 자원을 생성한다
axios.put(url, data?, config) // PUT 메소드를 사용하여 자원을 수정한다
axios.patch(url, data?, config) // PATCH 메소드를 사용하여 자원의 일부를 수정한다
axios.delete(url, config?) // DELETE 메소드를 사용하여 자원을 삭제한다

 

이 메서드들은 모두 Promise객체를 반환하며 then과 catch 체인을 사용하여 이후 동작을 제어할 수 있다.