Vue.js
axios코드를 actions로 전부 다 옮기는게 좋을까?
MDanderson
2023. 4. 19. 02:27
Vue.js 애플리케이션에서 API 호출을 다루는 데는 여러 가지 방법이 있습니다. created() 라이프사이클 훅에 직접 axios 코드를 넣는 것이 가장 간단한 방법이지만, 규모가 크거나 복잡한 애플리케이션에서는 유지 관리가 어려워질 수 있습니다.
Vue.js 애플리케이션의 상태 관리를 위해 Vuex를 사용한다면, actions로 빼서 사용하는 것이 좋습니다. 이렇게 하면 다음과 같은 이점이 있습니다:
코드의 구조화: API 호출을 Vuex의 actions에 정리하면 코드의 구조가 더 명확해지고, 관리하기 쉬워집니다.
재사용성: API 호출을 중앙 집중식으로 관리하면, 다른 컴포넌트에서도 쉽게 호출할 수 있어 재사용성이 높아집니다.
디버깅 용이성: Vuex를 사용하면 개발 도구를 통해 상태 변화를 쉽게 추적할 수 있어 디버깅이 용이해집니다.
따라서 규모가 크거나 복잡한 애플리케이션을 개발할 때는 actions를 사용하여 API 호출을 관리하는 것이 좋습니다. 하지만 간단한 애플리케이션에서는 직접 created()에 axios 코드를 넣어도 문제는 없습니다. 프로젝트의 규모와 요구 사항에 따라 적절한 방법을 선택하세요.