리액트4 리액트 상태 관리 전략 - Context API 와 상태관리 라이브러리 리액트 애플리케이션을 개발하면서 가장 중요한 부분 중 하나는 상태 관리 전략을 선택하는 것이다. 이 중에는 리액트가 제공하는 Context API 부터, Redux, Recoil, MobX 등 다양한 라이브러리가 이러한 필요를 충족시키기 위해 존재한다. 각각의 도구는 고유의 장단점이 있고 사용하는 방법이 있기에, 프로젝트의 요구 사항에 따라 올바른 도구를 선택하는 것이 중요하다. 리액트의 Context API 와 Redux로 대표되는 상태 관리 도구를 비교하여, 어떤 상황에서 어떤 도구를 사용하는 것이 가장 효과적인지 알아보자. Context API 기본 개념리액트 Context API 는 컴포넌트 트리 전체에 걸쳐 데이터를 전역적으로 공유할 수 있는 메커니즘을 제공한다. 이를 통해 특정 데이터를 여러 .. 2024. 8. 9. ErrorBoundary in React || 리액트 에러 바운더리 기본적인 리액트 웹앱에서 렌더링시 에러가 발생한 경우, 리액트는 에러가 발생한 UI를 스크린에서 제거한다. JS에서 에러는 호출자(caller) 방향으로 전파된다. 즉 콜 스택의 아래 방향(실행 중인 실행 컨텍스트가 푸시되기 직전에 푸시된 실행 컨텍스트 방향)으로 전파되기 때문에, 리액트에서도 마찬가지로 하위 컴포넌트에서 에러가 발생하면 에러가 상위 컴포넌트까지 전달되고, 에러 바운더리가 없는 경우에는 사실상 앱 전체가 스크린에서 제거되면서 흰 화면이 나타나게 된다. 이 때 에러 바운더리를 사용하면 상위에 전파되는 에러를 적절하게 끊을 수 있고 앱 전체가 보이지 않게 되는 불상사를 막을 수 있다. ErrorBoundary 란?React에서 'ErrorBoundary' 는 컴포넌트 하위 트리 내에서 발.. 2024. 6. 17. 요즘은 왜 jQuery 를 안쓰는가 ? jQuery 를 더이상 사용하지 않는 이유를 알기 위해선, 그 당시 jQuery를 왜 많이 도입하고 사용했는지를 함께 알아보면서 그 때와 지금의 차이점을 알아볼 필요가 있다. jQuery 의 사용 이유와 더이상 사용하지 않는 이유 1. 브라우저 호환성 + 웹 표준 API 확장 초기 웹 개발에서는 브라우저 호환성 문제가 큰 문제였다. 브라우저 호환성 또는 웹 호환성이란 운영체제 및 브라우저 간 동일한 웹 사이트 경험을 제공하는 하는 것으로, 이를 준수하지 않으면 다양한 운영체제 환경 및 브라우저에서 사용이 불가능한 문제가 발생한다. jQuery는 이 호환성 문제를 해결하는 강력한 도구로 등장하여, 다양한 브라우저에서 일관된 방식으로 JavaScript를 사용할 수 있도록 해주었다. jQuery가 본격적으.. 2024. 5. 14. Why React? | 리액트 왜 사용하세요? 요즘의 프론트엔드 개발자라면 누구나 알고 있어야 하는 리액트. 딱히 프론트엔드 개발자가 아니더라도 웹개발에 관심이 있는 개발자라면 누구나 리액트가 인기있고 대세라는 것은 모두 알고 있는 사실이다. 개발자에게 의미있는 NPM 다운로드 수 기준으로만 본다면, 모던 웹 라이브러리/프레임워크(Modern Web Library/Framework) 즉, Angular, React, Vue 이 3대장 사이에서도 압도적인 다운로드 숫자를 가지며, 프로덕션 환경에서 가장 많이 쓰인다는 jQuery도 따라올 수 없는 수준이다. 그리고 이 격차는 점점 더 벌어지고 있다. React의 출시는 2013년이지만 본격적으로 인기가 많아진 시기는 React Hooks가 출시된 2019년 즈음부터인것 같다. 그 이전에는 클래스형 컴포.. 2024. 5. 14. 이전 1 다음
