Welcome To

후니's Blog

Hello World
Let's Focus On
세그먼트 트리(Segment Tree)
·
Algorithm
세그먼트 트리여러 개의 데이터가 존재할 때 특정 구간의 합(최솟값, 곱 등)을 구하는데 사용하는 자료구조이다.트리 종류 중 하나로 이진 트리의 형태이며, 특정 구간의 합을 가장 빠르게 구할 수 있다.시간 복잡도는 O(logN)언제 사용할까 ?0123456789위와 같은 배열에서 2부터 8까지의 데이터를 더하려면 범위의 원소를 하나씩 다 더하면 된다.이러한 방식으로 다른 특정 구간의 합을 구한다고 고려했을 때 앞에서 하나씩 더하므로 데이터의 갯수가 N이면 시간 복잡도는 O(N)이다.따라서, 이러한 방식으로 구간의 합을 구하면 속도가 너무 느리기 때문에 더 좋은 방법이 필요하다.이 때, 더 좋은 방법은 세그먼트 트리(Segment Tree)를 사용하는 것이다. 세그먼트 트리란 ?맨 밑(leaf) 노드는 자기..
백준 1676번 - 팩토리얼 0의 개수(Node.js)
·
Algorithm/Baekjoon
백준 1676번 - 팩토리얼 0의 개수(Node.js)https://www.acmicpc.net/problem/1676   첫 번째 나의 풀이처음 내가 이 문제를 보고 생각한 것을 위의 코드를 보고 설명할 것이다.9 ~ 11번째 줄은 입력된 N에 따라 N!을 계산하는 코드이다.13번째 줄은 구한 N!의 값을 split() 메서드를 이용하여 하나씩 잘라주고 그 값을 answer에 넣어주었다. *split()메서드를 이용하기 위해서 문자열로 만드는 작업이 필요하기 때문에 String()을 사용하여 문자열로 만드는 작업을 해주었다.15 ~ 21번째 줄은 위의 split() 메서드를 이용하여 자른 결과의 배열인 answer를 뒤에서부터 반복문을 사용하여 "0"이 나오면 count를 1씩 더해주고, "0"이 아닌..
Responsive Web 하면서
·
React/2022-上
Responsive Web을 하면서 느낀점px, em, rem, %, vw, vh 등등이 있다. 나는 반응형 웹을 적용하기 위하여 rem을 사용중이고, html { font-size: 62.5% }로 설정하였다. 이 뜻은 font-size를 10px로 설정하겠다는 뜻이다. rem과 em의 차이점은 rem은 루트 태그의 영향을 받고 em은 부모 태그의 영향을 받는다. *** rem을 사용할 때, padding, margin 등에 사용하면 안된다고 한다.      :: 사용자가 임의로 글씨 크기를 키웠을 경우 화면이 잘리거나 하는 등의 문제가 발생할 수 있다고 한다.
Atomic Pattern
·
React/2022-上
Atomic Pattern아토믹 디자인 패턴은 사용자 인터페이스를 작고 단순한 요소로 분리하는 개념이다.아토믹 디자인 패턴은 Atoms(원자), Molecules(분자), Organisms(유기체), Templates(템플릿)으로 구성되어지고 최종적으로는 Pages 단위가 된다.즉, 일관된 UI를 만들고 유지보수성을 향상시켜준다. 구성요소 Atoms원자는 버튼, 제목 텍스트 입력 필드와 같은 가장 작은 구성 컴포넌트이다.모든 컴포넌트들의 기초가 되는 블록이며, 더 이상 분해 될 수 없는 필수 요소이다. Molecules분자는 2개 이상의 원자로 구성되어 있다. Organisms 분자들의 모음이다. Templates유기체들을 모아 템플릿으로 생성한 것이다. Pages실제 페이지를 구성하는 단위이다. 왜..
React-Router vs Next-Router
·
React/2022-上
React-Router vs Next-RouterNext.js는 React를 감싸고 있는 프레임워크이다.React의 기능들을 그대로 가지고 있으면서 Next.js에서만 구현할 수 있는 추가 기능들이 있어서 오히려 더 배운다고 생각하면 된다.하지만, Next.js와 React에서 차이를 유일하게 크게 보이는 곳이 Router 부분이다.라우팅을 할 때 Next에서는 상대적으로 쉽게하는 반면 React는 상대적으로 경로 및 컴포넌트 설정에 있어서 복잡하다.  React Link vs Next LinkNext-js 같은 경우는 자바스크립트 a 태그 형식과 거의 같다고 보면 된다. Next.js 같은 경우는 원하는 a 태그에 링크를 걸어서 href 형식으로 주면된다. javascript 형식과 굉장히 비슷하다. ..
Immutable & mutable
·
React/2022-上
Immutable & mutableMutable한 객체는 생성된 이후에 상태가 변경될 수 있는 객체이고, Immutable한 객체는 생성된 이후에 상태가 변경되지 않는 객체를 말한다.자바스크립트에서 Object와 Array를 제외한 모든 타입은 Immutable한 타입이다. immutableString에 string 값을 더하면, 아래와 같은 이벤트들이 발생한다.immutableString에 존재하던 값을 읽는다."World"가 immutableString에 존재하던 값에 덧붙여진다.결과값이 새로운 메모리 블록에 할당된다.immutableString 객체가 새로운 메모리 공간을 가리킨다.이전에 immutableString이 가리키던 메모리 공간은 GC의 대상이 된다. 따라서, Immutable한 타입은,..