💻 결과화면 📕 새로 알게된 개념 ✔ 리덕스가 생성, 실행 하는 과정 동작 과정을 간단하게 정리해서 새로운 개념들을 먼저 이해하고 어떻게 동작하는지를 먼저 파악했다. - action : 프로젝트 상태에 변화를 일으킨다. - reducer : 액션 객체를 받아서 상태를 어떻게 변경할 것인지 정의하는 함수 - store : 스토어는 리덕스에서 state를 저장하고 관리하는 객체 - render : UI를 렌더링하는 메서드 혹은 함수 - subscribe : 스토어가 변경될 때마다 render함수가 호출되도록 하는 역할 - dispatch : 액션을 발생시키는 것 ✔ 리듀서에서는 상태의 불변성을 유지하면서 데이터에 변화를 일으켜 주어야 한다. 이 말이 처음에는 굉장히 모순이라고 생각했다. 변하지 않는 속성을 ..
💻 결과화면 context API를 이용하여 색상을 선택하면 상자의 색상이 변경되는 기능을 구현해 보았다. 마우스 좌클릭 하면 큰 상자의 색 변경 마우스 우클릭 하면 작은 상자의 색 변경 프로젝트 깃허브 주소 : https://github.com/devuoon/context-tutorial 📒 Context API context API는 무엇이고 왜 쓰는 것일까? 일반적인 React에서는 props를 통해 데이터를 부모로부터 자식 요소로 전달하는데 이 때 여러 컴포넌트에 전달해야 하는 props의 경우에 과정이 매우 복잡해질 수 있다. 과정이 복잡해진다는 것은 유지 보수가 어렵고 프로젝트가 커질 수록 데이터 관리도 어려워 진다. 이 때 사용하는 것이 context API 이다. 즉, Context API..
💻 결과화면 https://newsapi.org/ 에서 제공하는 API를 이용하여 카테고리별로 최신 뉴스 목록을 보여주는 뉴스 뷰어를 구현해 보았다. 📕 프로젝트 관련 개념 콜백 함수 : 자바스크립트에서 비동기 작업을 할 때 가장 흔히 사용하는 방법으로 함수 자체를 또 다른 함수의 인자로 전달해주는 것을 말한다. Promise : Promise는 콜백 지옥과 같은 코드가 형성되지 않게 하는 방안으로 .then을 사용하여 다음 작업을 설정하기 때문에 콜백 지옥이 형성되지 않는다. newsapi API 키 발급하기 - 전체 뉴스 불러오기 GET https://newsapi.org/v2/top-headlines?country=kr&apiKey=8602958015cb4cd9aebcd69bff10175b - 특정..
