리덕스(Redux) 리덕스는 가장 사용률이 높은 상태관리 라이브러리로서, 리액트의 복잡한 컴포넌트 구조속에서 보다 간편하게 모든 컴포넌트들이 state를 쉽게 공유할 수 있게 해주는 방식이다. 리덕스는 리액트 내부에 있는 기술이 아니며 순수 HTML, JavaScript 내에서도 사용이 가능하다. 리액트와 시너지가 좋으니 대체적으로 리덕스를 사용할 뿐이다. 리덕스를 언제 써야 할까? 프로젝트의 규모가 큰가? Yes: 리덕스 No: Context API 비동기 작업을 자주 하게 되는가? Yes: 리덕스 No: Context API 리덕스를 배워보니까 사용하는 게 편한가? Yes: 리덕스 No: Context API 또는 MobX 리덕스에서 자주 사용되는 키워드 액션(Action) State에 어떤 변화가 ..

useRef useRef는 저장공간(변수 관리), DOM 요소에 접근을 위해 사용이 되는 React Hooks이다. Ref는 'Reference'의 약자로, '참조'라는 뜻이다. 저장공간(변수 관리) 리액트 컴포넌트는 State가 변할 때마다 리렌더링이 되면서 컴포넌트 내부 변수들이 초기화가 된다. 내부 변수들이 초기화 된다는 것은 해당 컴포넌트 함수의 변수들이 모두 초기화가 되고 모든 함수 로직 등이 다시 실행되는 것을 의미합니다. 이렇게 원하지 않는 렌더링 때문에 곤란할 때, State 대신 Ref안에 값을 저장하면 불필요한 렌더링을 막을 수 있다. 또한 컴포넌트가 아무리 렌더링이 되어도 Ref안에 저장되어 있는 값은 변화되지 않고 유지가 된다. 변경 시 렌더링을 발생시키지 말아야 하는 값을 다룰 때..

Flux 패턴에 대해 설명해 주세요 Flux 패턴과 MVC 패턴의 차이점에 대해 설명해 주세요 Flux 패턴의 장점과 단점은 무엇인가요? Flux 패턴을 구현할 때 어떤 라이브러리를 사용할 수 있나요? 가장 널리 사용 되는 것은 Redux이다. Redux는 Flux 패턴을 기반으로 만들어 졌으며, React와의 통합이 매우 쉬워 많은 개발자들이 사용하고 있다. 그 외에도 Mobx, Fluxible, Reflux등이 있다. Redux의 작동 원리를 간단하게 설명해 주세요 액션(Action): 액션의 종류와 액션에 필요한 데이터를 전달하는 함수를 생성합니다. 스토어(Store): 애플리케이션의 상태와 액션을 처리하는 로직이 들어있는 객체입니다. 리듀서(Reducer): 이전 상태와 액션을 받아서 다음 상태를..

주어진 넓이를 주어진 타일로 채우는 문제인 타일링은 재귀적 사고방식으로 봐야 패턴을 확인 할 수 있다. f(1), f(2), f(3)... 같이 순차적으로 값을 파악하기보다 f(n), f(n-1), f(n-2) 같이 역순으로 파악하며 구조와 패턴을 찾아야 한다. 타일링의 패턴을 찾기위해 거쳐야 하는 과정은 다음과 같다. 맨 마지막에 들어갈 수 있는 타일의 경우의 수 찾기 => 넓이가 증가할 때마다 나타나는 특이 케이스 찾기 2xn 타일링 2 x 1 크기의 직사각형 타일로 2xn 넓이를 채우는 경우의 수의 개수 구하기 2xn을 채우는 경우의 수 개수 = f(n) f(n)에서 마지막에 오는 타일의 경우의 수는 두 가지 경우밖에 없다. 한 개가 세워져 있는 경우 두 개가 눕혀져 있는 경우 이런 패턴으로 보면 ..

버블 정렬(Bubble Sort)알고리즘의 개념 요약 오름차순을 기준으로 정렬 서로 인접한 두 원소를 검사하여 정렬 인접한 2개의 레코드를 비교하여 크기가 순서대로 되어 있지 않으면 서로 교환 선택 정렬과 기본 개념이 유사 버블 정렬(Bubble Sort)알고리즘의 구체적인 개념 버블 정렬은 첫 번째 자료와 두 번째 자료를, 두 번째 자료와 세 번째 자료를,... 이런 식으로 (마지막-1)번째 자료와 마지막 자료를 비교하여 교환하면서 자료를 정렬한다 1회전을 수행하고 나면 가장 큰 자료가 맨 뒤로 이동하므로, 2회전 에서는 맨 끝에 있는 자료는 정렬에서 제외되고, 2회전을 수행하고 나면 끝에서 두 번째 자료까지는 정렬에서 제외된다. 이렇게 정렬을 1회전 수행할 때마다 정렬에서 제외되는 데이터가 하나씩 늘..

UI 사람들이 컴퓨터와 상호 작용하는 시스템 화면상의 그래픽 요소들 외에도 컴퓨터와 상호작용을 위한 시스템인 키보드, 마우스 등의 물리적 요소. UX 사용자가 어떤 시스템, 제품, 서비스를 직 간접적으로 이용하면서 느끼고 생각하는 총체적 경험 서비스 그 자체에 대한 경험. 홍보, 접근성, 사후처리 등 말 그대로 총체적 경험. 프론트엔드에서 UX에 가장 영향을 많이 끼치는 것은 UI 만약 홈페이지가 정렬도 안되어있고, 글자 크기도 뒤죽박죽이면 UX가 좋지 않다. UI UX 차이점 UX는 UI를 포함한다. UI UX는 서로 보완하는 역할 UX가 좋지 않은 곳을 찾아냄으로 UI개선점을 찾아낼 수 있고, UI를 개선함으로 UX가 좋아지기도 함