api 연동하여, 컴포넌트에 적용하기
개요 React에서 api를 연동하여, 어떻게 컴포넌트에 적용시키는지에 대해 알아보겠다. api를 연동할때, 주로 사용되는 방법은 fetch와 axios가 있다. 하지만 fetch로 api를 연결하는 경우는 거의 없고, 대부분 axios와 같은 라이브러리를 사용하여 api연동을 한다. 먼저 fetch와 axios에 대해 간단하게 먼저 짚고 넘어가겠다. React로 개발을 할 때 fetch와, axios를 사용하여, GET, PUT, POST, DELETE 등의 메서드로 API를 호출 할 수 있다. 만약 이 메서드들에 대하여 생소하다면, REST API에 대해 먼저 알아볼 필요가 있다. REST API는 HTTP URI를 통하여 자원을 명시하고, HTTP 메서드 (POST, GET, PUT, DELETE)..
2022. 1. 21.
배열 다루기 생성 및 제거
개요 바로 이전 포스트에서는 Array.map 함수를 활용하여, 어떻게 화면에 보여지도록 하는지에 대해 알아보았다. 이번 포스트에서는 배열에 내용을 추가하거나, 삭제하는 방법에 대해 알아보겠다 배열 생성 Javascript를 다뤄 보았다면, 배열에 데이터를 추가할 때, Array.push를 사용하면 될 것이라고 생각을 할수도 있다. 리액트에서는 state의 내부값을 직접적으로 수정 하면 절대로 안된다. 그 이유는 불변성을 유지시키기 위해서 이다. 이를 위해, push, splice, unshift, pop 등과 같은 내장함수는 배열 자체를 직접 수정하게 되어, 적합하지 않다. 불변성을 유지해야, 리액트에서 모든 것들이 필요한 상황에 리렌더링 되도록 설계가 가능하며, 추후에 최적화를 할 수 있다. 리액트는..
2022. 1. 19.
