react-redux를 기반으로 한 예제를 다룹니다. 예제는 간단한 로그인 기능 + TodoList 구현입니다. 이번 글에서는 모든 서버 관련 동작을 동기적으로 임시 구현하여 처리합니다. 추후 middleware를 이용해 비동기 동작을 처리할 예정입니다. 설치 1. react 설치 npx create-react-app my-todo 2. react-redux 설치 cd ./my-todo npm install redux react-redux 로그인 기능 구현 Server API - 동기(sync)로 임시 구현 로그인 동작을 임시로 구현하는 이유는 redux가 오직 동기적인 동작만을 처리할 수 있기 때문입니다. 비동기적인 처리는 redux-thunk나 redux-saga 등의 middleware를 사용해야 ..
Redux? Flux architecture로부터 파생된 단방향성 전역적 상태 관리 도구 많은 경우 React와 함께 사용하나 React 없이도 사용 가능 Redux를 사용하는 이유 1. 전역적 상태 관리 2. 상태의 중앙화 및 높은 예측 가능성 3. 디버깅 툴의 편리성 useContext & useReducer 대신 사용하는 이유? - 생산성의 차이 - 결국 useContext, useReducer를 사용해서 Redux를 구현하게 된다. Redux의 원칙 1. Single source of truth: 유일한 store에서 전역적 state를 관리 2. State is read-only: state 직접 수정 금지. action과 dispatch를 통한 변경만 가능. (Immutability) 3. C..
여러 Component에서 state를 공유해야 하는 경우가 있다. 이럴 경우 해결법은 공유해야 하는 state 처리를 공통 부모에서 하는 것이다. 미리보는 결과 예시로 다음과 같은 간단한 예시를 구현한다고 해보자. 요구사항 'IncreaseValue' 버튼을 누르면 value 값이 증가해야 한다. 'DecreaseValue' 버튼을 누르면 value 값이 감소해야 한다. 그리고 'current value : '에 현재 값을 표시해야 한다. IncreaseValule, DecreaseValue, current value 모두 개별적인 Component로 만들어야 한다!! 핵심은 마지막 줄이다. value 값이 state가 되어 값이 바뀔때마다 re-render를 해줘야 하는데, 두 개의 버튼 컴포넌트에서..
첫 퇴사로부터도 3개월이 넘었고, 이제 슬슬 혼자만의 굴에서 나와 사회로 다시 돌아갈 때가 되었다. 그간 개인적으로 정리해야 할 일들도 대부분 잘 마무리 지었고, 쉴 만큼 푹 쉬었다. 이제 새로운 것들을 해나가야 할 차례이다. 하지만 그 전에 지금의 생각을 정리해 남겨두려 한다. 어딘가에 속해 바쁘게 살아가다가 이 때의 나는 어떤 생각으로 어떻게 지냈는지를 잊어버리지 않기 위함이다. # 나의 첫 직장 다사다난했던 대학/대학원 생활을 마친 나는 분당 소재의 IT 기업인 첫 직장에 전문연구요원으로 입사하였다. 2019년 하반기에 입사했으니, 이직을 준비하는 지금 시점에선 벌써 4년이나 되었다. 처음 업무는 C++로 데스크탑 프로그램을 개발하는 것이었지만, 중간에 회사 제품이 웹 앱 컨셉으로 완전히 전환되어 ..
2023.09.10 프로그래머스에서 진행하는 하반기 Dev-Matching 코딩 테스트에 참여하였다. 테스트는 'PCCP'라 불리는 자체 인증 시험으로 진행되었는데, 자세한 내용은 아래 링크를 보도록 하자. https://certi.programmers.co.kr/ 코딩역량인증시험 코딩 역량에 대한 객관적 측정을 위해 체계적으로 설계된 프로그래머스 코딩역량인증시험 certi.programmers.co.kr 문제는 프로그래머스의 문제 기준 Lv 2 ~ 3 수준으로 느껴졌다. 다만, 이번 나의 경우에는 시간 관리에 완벽히 실패했다. 첫 두 문제는 무난히 풀어냈으나, 세 번째 문제 일부 테스트 케이스에서 통과하지 못하는 오류가 발견되어 붙잡고 늘어지다가 제대로 오류도 못 잡고 마지막 문제를 15분도 남지 않은..
# Binary Search Tree 번역하자면 이진탐색트리이며 줄여서 BST라고 부른다. BST는 말 그대로 binary search를 더 효율적으로 하기 위한 트리 자료 구조이다. 삽입, 삭제, 조회의 시간 복잡도는 모두 O(log n)이다. BST의 특징 1. 각 노드는 0 ~ 2개의 child node를 가진다. 2. 노드의 왼쪽 서브 트리의 값들은 항상 노드보다 작다. 3. 노드의 오른쪽 서브 트리의 값들은 항상 노드보다 크다. 4. 트리 내 중복되는 값은 없다. 삽입 삽입할 값을 root node부터 순차적으로 비교하며 삽입 값이 더 작은 경우에는 왼쪽, 큰 경우에는 오른쪽으로 이동한다. 이동 중 빈 자리를 발견하면 그 곳에 삽입한다. 아래 트리에 '3'을 삽입한다고 해보자. 1. root n..
