react,redux 개발시 꼭 필요한 디버깅 툴

React, Redux 디버깅할 때 유용한 툴을 소개한다.

이것 없으면 진짜 힘들다..

1. 개발자 도구

크롬의 개발자 도구이다. 이번에 자세히 써보니. 크롬 개발자 도구에 대한 기본 지식이 없어서 쉽지 않았다.

아래 내용을 참고 한다. 

http://shiren.github.io/2016-03-23-%EC%9B%B9%EA%B0%9C%EB%B0%9C%EC%9E%90%EB%A5%BC-%EC%9C%84%ED%95%9C-%ED%81%AC%EB%A1%AC-%EA%B0%9C%EB%B0%9C%EC%9E%90-%EB%8F%84%EA%B5%AC/

2. Chrome React DevTools

설치

https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi

3. Chrom Redux DevTools

설치 

https://chrome.google.com/webstore/detail/redux-devtools/lmhkpmbekcpmknklioeibfkpmmfibljd?hl=ko

사용하려면 아래 createStore에 아래 정보를 추가해야 한다.

 const store = createStore(
   reducer, /* preloadedState, */
+  window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
 );