![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/bbJs6N/btq74Dw0NcB/BzCq6M90nE7MPwJ2bdkDhk/img.png)
React Hooks란? React v16.8에 추가된 새로운 기능이다. 기존 함수 컴포넌트에서는 Class컴포넌트의 life cycle기능을 사용할 수 없었는데 hooks를 이용하여 가능하도록 했다. (class 컴포넌트는 hooks사용 불가능) https://kmj24.tistory.com/118 [React] Lifecycle과 useEffect hook React는 class로 컴포넌트를 생성할 수 있고, function으로 컴포넌트를 생성할 수 있다. class컴포넌트와 함수 컴포넌트의 차이는 Lifecycle method를 사용할 수 있냐 없냐가 있다. React에서 함수 컴포넌트를 kmj24.tistory.com State Hook class컴포넌트에서 state는 object 형태로 사용했..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/bQktlS/btq7HEI9fPk/Tegdnx9oSyEmKED1QEKDQ1/img.png)
Divide and conquer, 분할 정복 알고리즘 단어 그대로 "분할", "정복", "합치기" 세개로 나누어 진행하는 알고리즘이다. divide and conquer알고리즘의 대표적인 예로는 merge sort가 있으며 quick sort, ip 주소 할당, memorization알고리즘 등이 있다. 1. 분할(divide) - 가장 작은 단위가 될때 까지 쪼갠다. - 주어진 문제의 최소단위로 나누어질때 까지 같은 작업을 반복하기 때문에 recursion으로 구현할 수 있다. 2. 정복(conquer) - 쪼개진 단위들을 정렬하며 합쳐나간다. merge sort의 time complexity는 O(logn)이 된다. 프로그래밍언어마다 내장되어 있는 sort method가 있다. //javascrip..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/bjPVO8/btq7y2Dx82w/he6QFtmNvESUex2lbQuMvK/img.gif)
• Front-end - 기존에 만들어 둔 boiler-plate 코드 사용 - 업비트 open api 사용 (web-socket, rest api) - react - redux(thunk, saga) - scss - styled-components • Back-end - 기존에 만들어 둔 boiler-plate 코드 사용 - typescript - nestjs - mysql 웹 소켓을 처음 사용해봄 직접 소켓을 구축한 것은 아니지만, 나중에 채팅같은 기능 구현할때 직접 서버에 대고 소켓 프로그래밍을 해봐야겠다. upbit open api로 코인을 받아오는 로직을 redux에 모듈화 했다. 다음부터는 css를 직접 만들지 않고 antd나 tailwindcss같은 라이브러리를 사용해서 만들어야 겠다. 현재..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/c7QTby/btq7sFbTPSM/eB89ylAN4wkIMY3PWPiVR1/img.png)
BST - 이진탐색과 연결 리스트를 결합한 자료구조이다. - 트리형태이며 하나의 노드는 left, value, right를 가진다. - value는 unique이다. - 어떤 노드를 기준으로 왼쪽노드의 value는 더 작은 값이 들어간다 - 어떤 노드를 기준으로 오른쪽노드의 value는 더 큰 값이 들어간다 - 루트 노드를 기준으로 왼쪽의 노드들의 value는 루트 노드의 value보다 작다. - 루트 노드를 기준으로 오른쪽의 노드들의 value는 루트 노드의 value보다 크다. - 현재 노드를 기준으로 큰 값은 오른쪽 작은 값은 왼쪽에 있으므로 time complexity는 O(logn)이다 1. 삽입 알고리즘 - root node부터 검색하여 큰값이면 오른쪽 작은값이면 왼쪽으로 위치시킬 수 있도록 ..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/LMY9N/btq66VE7ogr/KMXbr8VRVDs7jIkq5Qwm5k/img.png)
Redux-Saga redux-saga는 redux의 비동기 작업을 구현할 수 있도록 도와주는 library이다. redux 공식문서에서는 다음과 같이 소개하고 있다. redux-saga is a library that aims to make application side effects easier to manage, more efficient to execute, easy to test, better at handling failures. redux-saga는 side effect(실행중인 현재 함수의 범위를 벗어난 것에 영향을 미치는 모든 것, server와의 통신과 같은 비동기 작업, 인증 서비스 호출, 브라우저 캐시 액세스 등의 작업)를 보다 쉽게 관리/실행/테스트를 할 수 있도록 도와주는 라이브..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/6e8Cx/btq6Z7Trz3W/s4z1Ssiplx3PPNviPRgAQ1/img.png)
https://leetcode.com/problems/employee-importance/ Employee Importance - LeetCode Level up your coding skills and quickly land a job. This is the best place to expand your knowledge and get prepared for your next interview. leetcode.com 사원의 중요도를 표현한 객체와 중요도를 계산할 id값을 입력 받는다. ex) 중요도 : [[1,5,[2,3]],[2,3,[]],[3,3,[]]], id : 1 id가 1번인 사원의 중요도를 출력해야 된다. 1번 노드의 하위 노드는 2, 3이고 1번의 중요도가 5, 2번/3번의 중요도가 3..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/b2gaMh/btq6CNUUUCA/FaohXKdU8tC4oYMjP7ycw1/img.png)
웹 소켓이란? - 웹 표준 프로토콜 중 하나이다. - 웹 페이지의 한계에서 벗어나 실시간으로 상호작용 하는 웹 서비스를 만드는 표준 기술 이다. - Chrome, Safari, Firefox, Opera등의 브라우저에서 사용할 수 있다. - 80번 포트를 통해 웹 서버에 연결한다. 웹 소켓의 특징 양방향 통신(Full-Duplex) - 데이터 송수신을 동시에 처리한다. - 서버와 브라우저 간 연결을 유지한 상태로 데이터를 교환할 수 있다. - 패킷(packet) 형태로 데이터를 송수신하며, 양방향 통신이다. - connection의 중단과 추가 요청 없이 양방향으로 이루어진다. - 통상적인 HTTP통신은 Client가 요청을 보내는 경우에만 Server가 응답하는 단방향 통신이며, 웹 소켓은 양방향 통신..
![](http://i1.daumcdn.net/thumb/C148x148/?fname=https://blog.kakaocdn.net/dn/mCIaS/btq6ru97VqB/yeAcSD2gc9FXv1SESuW0XK/img.png)
Router란? 라우터는 컴퓨터 네트워크에서 데이터를 송수신하는 장치이다. 패킷의 위치를 추출하여 그 위치에 대한 최적의 경로(가장 빠르게 동신이 가능한 경로)를 지정하며 이 경로를 따라 데이터 패킷을 다음 장치로 전향시키는 네트워크 중계 장치이다. 사실 Router는 여기서 기술할 react router와는 관련이 없다. 하지만 "경로를 설정한다"라는 기능은 동일하다. React router React router는 설정한 URL에 따라 콘텐츠를 전송해준다. react-router는 서드파티 라이브러리로써, 컴포넌트를 routing하기위해 가장 많이 사용하는 라이브러리이다. router를 직접 구현하는 것은 시간이 걸리는 작업이다. react router 라이브러리를 사용하면 이러한 작업을 간단하게 해..