Category: React.js

이 튜토리얼은 5개의 포스트로 나뉘어진 이어지는 강좌입니다. 목차를 확인하시려면 여기를 참고하세요. 5장. 주소록에 Redux 끼얹기 이번 장에서는 이전에 우리가 만들었었던 주소록 프로젝트에 Redux 를 적용해보겠습니다. 기존의 코드에선 프로젝트의 모든 로직을 App 컴포넌트에서 관리했었습니다. 사실상, 이 프로젝트는 소규모 프로젝트이기 때문에 App…

이 튜토리얼은 5개의 포스트로 나뉘어진 이어지는 강좌입니다. 목차를 확인하시려면 여기를 참고하세요. 4장. Ducks 구조와 redux-actions 사용하기 Redux 공식 문서에서는, ActionType, Action, Reducer 이 3가지를 따로 따로 다룹니다. 그러다보니, 하나의 액션을 추가하려면 3개의 다른 파일들을 수정해야하죠. 가끔씩은, 액션생성자를 하나하나 만들고 또…

이 튜토리얼은 5개의 포스트로 나뉘어진 이어지는 강좌입니다. 목차를 확인하시려면 여기를 참고하세요. 3장. Immutable.js 익히기 Immutable.js는 자바스크립트상에서 불변성의 데이터를 다루는것을 도와줍니다. 3장을 진행하기에 앞서, 우선 자바스크립트에서 객체의 불변성에 대해서 알아보겠습니다. 객체의 불변성 이를 이해하려면, 간단한 자바스크립트 코드들을 실행해보아야합니다. 크롬에서 개발자도구를 열고,…

이 튜토리얼은 5개의 포스트로 나뉘어진 이어지는 강좌입니다. 목차를 확인하시려면 여기를 참고하세요. 2장. 멀티카운터 만들기 자, 이제 카운터의 갯수를 늘릴 차례입니다. 그렇게 어려워지진 않습니다. 기존에 우리가 투두리스트를 만들고, 주소록을 만들었던것과 같은 원리로 만들면 됩니다. 각 카운터가 지니고 있는 값을 객체로 만들어서…

  이 튜토리얼은 5개의 포스트로 나뉘어진 이어지는 강좌입니다. 목차를 확인하시려면 여기를 참고하세요. 1장. 카운터 만들기 우리가 1장 2장에 걸쳐 만들 프로젝트를 미리봐볼까요? 주소: https://counter.now.sh/ 상단의 생성, 제거 버튼을 누르면 동그라미가 나타나거나 사라지고, 동그라미를 왼쪽 클릭하면 더하기, 오른쪽 클릭하면 빼기, 더블클릭하면…

이번에 다룰 주제는 Redux 입니다. 리액트를 공부하다보면 한번쯤은 거쳐가야 할 관문이죠. 처음에 공부 할 때는 좀 어렵습니다. 초반엔 왜 사용해야 하나 싶기도 하고 오히려 복잡해지는것 같기도 합니다. 하지만 사용을 하다보면 정말 간단하면서도 편하고, 또 강력한 라이브러리라는것을 깨닫게 됩니다. 이 문서는…