What is Redux? Redux는 Cross-Component State 또는 App-Wide State를 위한 state 관리 시스템이라고 한다. 즉, 애플리케이션 상호작용으로 변경된 정보를 화면에 표시하는 데이터(state)를 다수의 component나 더 나아가 App 전체에서 관리할 수 있도록 도와준다. 자세한 사항은 아래 링크를 참고할 수 있다. Redux - 자바스크립트 앱을 위한 예측 가능한 상태 컨테이너. | Redux 자바스크립트 앱을 위한 예측 가능한 상태 컨테이너. ko.redux.js.org Categories of State 이미 앞서 useState나 useReducer를 사용하여 그러한 데이터들을 관리했는데, 그 기능에 따라 아래 세가지로 구분지을 수 있다. Local S..
다음 페이지들는 Array.prototype에서 사용할 수 있는 다양한 방법에 대한 좋은 개요를 제공한다. 필요에 따라 이를 클릭하고 지식을 리프레시할 수 있다. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array 이 코스에서 특히 중요한 사항들 : map() => https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map find() => https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/fin..
Custom Hook이란? useState()와 같은 내장된 Hook(정규 함수)과 동일하다. 다만, 내부 상태를 설정할 수 있는 로직이 포함된 것 뿐이다. custom hook은 재사용 가능한 함수에 상태를 설정하는 로직을 outsourcing할 수 있는 장점이 있다. 다시 말해, 정규 함수와는 다르게 custom hook은 다른 custom hook을 포함한 다른 react hook들을 사용할 수 있다. useState()나 useReducer()를 통해 관리하는 React state를 활용할 수 있다는 말이다. 이를 통해 다양한 component에서 호출이 가능해지며, 로직 재사용이 가능한 매카니즘이다. 주로, 코드가 중복되는 경우 re-factoring과 함수의 재사용을 위해서 이용된다.일반적인 ..
React를 공부하다보면, TypeScript라는 것으로 코딩할 수 있다고 알게된다. 그러면 이번시간에는 TypeScript가 무엇이며 왜 사용해야하는지에 대해서 알아보자. What is TypeScript? TypeScript는 JavaScript의 superset 언어로 JavaScript를 기반으로 하되 보다 확장된 프로그래밍 언어라는 뜻이다. 이는 아주 중요한 특징 중 하나로, TypeScript의 뿌리에는 여전히 JavaScript가 있다는 것을 의미한다. 그렇기에 JavaScript의 기본 문법들, 코드 작성법, 조건문, 반복문, 객체 사용법 등등 그대로 사용 가능할 것이다. 다만, 몇가지 기능이 추가된 것이다. 또한, TypeScript는 React와 달리 JavaScript의 library..
promise는 생성된 시점에 알려지지 않았을 수도 있는 값을 위한 대리자로 비동기 메서드에서 마치 동기 메서드처럼 값을 return 할 수 있다. 다만 최종 결과를 반환하는 것이 아니고, 미래의 어떤 시점에 결과를 제공하겠다는 '약속'(promise)을 return한다. 바로 예시 코드를 보자. function fetchMoviesHandler() { fetch("https://swapi.dev/api/films") .then((response) => { return response.json(); }) .then((data) => { const transformedMovies = data.results.map((movieData) => { return { id: movieData.episode_id, ..
