언젠가는 펼쳐 볼 아카이브

React 테스팅 코드 테스트가 필요한 경우 코드 작성 후, 원하는 대로 동작하는지 알려고 할 때 코드에 버그가 있으면 어떤 상황에서 버그가 발생하는지 확인할 때 코드를 리팩토링 한 후에, 원래대로 동작하는지 테스트할 때 리액트 앱의 컴포넌트가 늘어날 수록 컴포넌트끼리 서로 영향을 미치는 경우가 많아짐 특정 코드가 수정되면, 어떤 컴포넌트에서 에러가 발생할 수 있음 테스팅 코드 작성의 이점 언급한 상황들에 대한 테스팅 코드를 작성하여, 미연의 에러를 방지 TDD(Test Driven Development) 등의 방법론을 적용하여 생산성을 향상함 테스트가 늘어나면서 테스트 코드가 구현 코드에 대한 문서화가 됨 테스트가 용이하게 코드를 작성하여, 코드 품질과 신뢰성을 높임 mocking : 특정 동작을 흉내..

Redux 앱 전체 상태를 쉽게 관리하기 위한 라이브러리 Redux의 많은 개념들이 Flux pattern에서 차용됨 주로 React 앱과 같이 사용함 Redux를 언제 써야하나? 앱 전체의 상태 관리가 필요할 때 복잡한 비동기 처리가 있는 상태 관리가 필요할 때 앱의 상태가 복잡하고, 이를 체계적으로 관리하고 싶을 때 상태 관리 패턴을 도입하여, 여러 개발자와 협업하고 싶을 때 logger, devtool 등을 활용하여 상태를 관리할 필요하 있을 때 Redux의 핵심 원칙 Single source of truth : Store는 단 하나이고, 모든 앱의 상태는 이곳에 보관됨 Immutability : 상태는 오로지 읽을 수만 있고, 변경하려면 모든 상태가 변경되어야 함 Pure function : 상태..

상태관리 상태 관리 기술이란 앱 상에서의 데이터를 메모리 등에 저장하고 하나 이상의 컴포넌트에서 데이터를 공유하는 것 한 컴포넌트 안에서의 상태, 여러 컴포넌트 간의 상태, 전체 앱의 상태 관리를 모두 포함 MPA에서의 상태관리 SPA에서의 상태관리 - 서버의 데이터를 이용해 페이지를 렌더링하므로, 클라이언트의 데이터와 서버의 데이터가 큰 차이를 가지고 있지 않음 - 자체적으로 데이터를 갖고, 서버와의 동기화가 필요한 데이터만을 처리함 - 그 외의 데이터는 client만의 데이터로 유지 상태 관리 기술의 도입 상태가 많지 않거나, 유저와의 인터렉션이 많지 않다면 매 작업 시 서버와 동기화하더라도 충분함 앱이 사용하는 데이터가 점점 많아지고, 유저와의 인터렉션 시 임시로 저장하는 데이터가 많아지는 경우 상..

Javascript Asychoronus 초기 웹 환경에서는 서버에서 모든 데이터를 로드하여 페이지를 빌드 했기 때문에, Javascript 에서는 별도의 비동기 처리가 필요하지 않았음 Ajax의 등장으로 페이지 로드 없이 client-side에서 서버로 요청을 보내 데이터를 처리할 수 있게 됨 XMLHttpRequest라는 객체를 이용해 서버로 요청을 보낼 수 있게 됨 Javascript는 single-threaded 언어이므로, 서버 요청을 기다려야하면 유저는 멈춰있는 브라우저를 보게 됨 따라서 비동기 처리를 이용해 서버로 통신할 필요가 있음 Synchornous Asynchoronus - 해당 코드 블록을 실행할 때, 스레드의 제어권을 넘기지 않고 순서대로 실행함 - 코드의 순서와 다르게 실행 됨 ..