Front-end/React.js
-
[React.js] 리액트 훅스 (React Hooks)Front-end/React.js 2020. 7. 12. 22:39
포스팅 계기 React 16.8 버전부터 Hooks를 지원함으로써, Class를 사용하지 않고 React를 사용할 수 있게 되었다. OOP를 선호하지 않거나 bind()의 불편함을 느끼던 개발자들이 해방을 느끼게 되어 많이 쓰이게 되는 듯 하다. Legacy 코드를 모두 함수형으로 바꾸기에는 무리가 있지만, 새로 시작하는 프로젝트에서는 주로 쓰일 것이기에 공부할 필요가 있었다. 훅스(Hooks) 등장 배경 Hook는 props, state, context, refs, 그리고 lifecycle와 같은 React 개념에 보다 직관적인 API를 제공할 뿐, React 컨셉을 대체하는 것은 아니다. 그리고 React 팀은 Class 개념을 제거할 계획이 없다고 한다. 따라서, 기존의 코드를 모두 바꿀 필요가 없..
-
[React.js] 리액트 라이프 사이클(React Lifecycle)Front-end/React.js 2020. 6. 21. 17:51
포스팅 계기 당연한 말일 수도 있지만, 안드로이드, 웹 프레임워크 등 모두 life cycle을 잘 이해해야 탄탄한 개발을 할 수 있다. 이제 리액트를 시작하는 단계이기 때문에, life cycle부터 공부해보기로 했다. 라이프 사이클을 이해하기 위해서 React 인스턴스 property(props와 state) 개념이 선행될 필요가 있다. 아직 두 개념에 대한 이해가 부족하다면 위의 링크를 통해 공부하길 추천한다. Life cycle (ver 16.4^) 기존 Life cycle과는 다소 차이가 있다. 하지만 React blog에서 밝히는 변경이유는 아래와 같다. - 초기 렌더링 작업을 제어하는 방법이 너무 많아서 혼란이 됨. - Error Handling의 중단 작업이 고려되지 않아서 memory l..