[React] 리액트의 생명 주기
2020. 11. 15. 22:03
Front-End/React
* 본 게시글은 이 링크를 참고해서 만들어졌습니다. React의 생명 주기를 알아야 하는 이유는? 안드로이드에도 라이프 사이클이 있듯이, 리액트의 컴포넌트에도 생명주기가 있습니다. 앞서 리액트를 공부하셨던 분들이라면, 리액트의 큰 특징 중 하나가 컴포넌트 기반이라는 것을 아실겁니다. 컴포넌트 기반의 프로그래밍이니, 그 컴포넌트의 생명주기를 알아야겠죠. 대표적인 사례는 다음과 같습니다. "컴포넌트가 만들어지자마자 특정 state를 변경하고 싶어. 이럴 땐 어디에 코드를 넣어야 하지?..." 충분히 발생할 수 있는 상황이죠? 이럴 때, 컴포넌트의 생명주기를 알고 있다면, 어디에 코드를 삽입해야 할지 정확히 알 수 있습니다. React의 생명 주기 리액트의 생명 주기를 간략하게 표현한 그림은 아래와 같습니다...
[React] 리액트란 무엇인가? (개념/설치)
2020. 11. 15. 17:50
Front-End/React
* 본 게시글은 이 링크를 참고하여 만들었습니다. React란? 리액트는 페이스북이 만든, 사용자 UI 구축을 위한 라이브러리입니다. 아마, 리액트에 대해서 슬쩍 들어보셨던 분들이라면 '리액트는 프레임워크 아니었어? 뷰나 앵귤러는 프레임워크던데...' 라는 생각을 가지실 수도 있을 것 같아요. 하지만 엄연히, 리액트는 라이브러리가 맞습니다. 다만, 개발자들이 리액트에 필요한 여러 가지 기능들을 추가해놨기 때문에, 사실상 프레임워크에 '가깝다' 라고 말하는 것이죠. React의 대표적인 특징 1. JSX 문법 리액트는 JSX 문법을 사용하는 것이 특징입니다. JSX가 뭐냐구요? 이는, 자바스크립트 안에서 HTML 문법을 사용해서 View를 구성할 수 있게 도와주는 자바스크립트 문법입니다. JSX 문법을 사..
[백준/15684] 사다리 조작 (C++)
2020. 10. 8. 00:05
Programming/백준 문제풀이
문제 해석 누군가 백트래킹을 시도할 때에는, 조건을 잘못 주면 개망한다고 했다. 내가 그랬다. 이 문제를 풀기 위해서 2일의 시간이 걸렸고, 백준에 40번을 제출했는데 다 틀렸다. 현자타임이 온다. 내가 이것밖에 안되나 싶다. 결국 다른 사람이 작성한 코드를 봤는데도 이해가 잘 안됐다. 허무하다. 구현 #include using namespace std; bool ropes[31][11] = { 0 }; int N, H, M; int answer = 4; bool check() { for (int i = 1; i = answer) return; if (check()) { if (answer > cnt) answer = cnt; return; } if (cnt == 3) return; for (int i ..
[백준/14890] 경사로 (C++)
2020. 10. 5. 17:36
Programming/백준 문제풀이
문제 해설 나에게 엄청난 좌절을 안겨준 문제이다. 처음 문제를 훑어보았을 때는 1시간이면 풀 수 있을 것이라고 착각했지만, 내 구현 능력이 아직 많이 부족하다는 것을 여실히 보여주었다. 장장 이틀에 걸친 삽질을 통해 풀 수 있었던 문제이다. 앞으로도 열심히 공부해야겠다는 자극을 받았다. 어쨌든, 이 문제는 이해를 바탕으로 구현하는 시뮬레이션 문제이다. 다만, 조건이 조금 까다롭기 때문에 적절한 분기 처리를 해주어야 테스트 케이스를 모두 통과할 수 있다. 나의 경우도 이 조건, 저 조건을 따지다가 시간을 모두 날려먹은 케이스이다. 어쨌든, 내가 풀었던 문제 풀이에 대해서 설명해보겠다. 다음과 같이 3, 2, 2, 1, 1, 1, 1, 2, 2, 3 의 높이를 가진 길과 길이 2의 경사로를 생각해보자. 왼쪽..
[알고리즘] 트라이 (Trie) 자료구조 개념 및 구현 (C++)
2020. 10. 4. 01:24
Programming/알고리즘
트라이 (Trie) 자료구조란? 문자열 검색에 최적화된 트리 형태의 자료구조이다. 상위 문자가 하위 문자들의 부모 노드가 되는 트리 구조를 가지고 있다. 'tree', 'trie', 'trim' 이렇게 3개의 문자열을 포함하는 트라이의 예시를 보자. 그림에서 보는 것과 같이, 't' 밑에 'r' 이 하위 노드로 들어가 있고, 'r' 밑에 'i' 와 'e' 가 하위 노드로 들어가 있는 것을 볼 수 있다. 이와 같은 구조를 가지고 있기 때문에, 길이 m의 특정 문자열이 존재하는지 판단하는 것이 O(m) 시간으로 가능하다. 트라이에 필요한 기능 트리 구조에 익숙한 분들이라면 위의 그림만으로도 구현의 방법이 그려졌을 것이다. 트라이의 구현에서는 다음과 같은 기능이 필요하다. (1) 해당 단어가 존재하는지 판단하..
[백준/2004] 조합 0의 개수
2020. 9. 1. 23:14
Programming/백준 문제풀이
1. 문제 2. 접근 방법 중고등학교때 열심히 배웠던 이항계수와 관련된 문제이다. 다음과 같이 n=5, c=2 의 경우를 가정해보자. 계산된 값은 10 이다. 그러므로 문제에서 요구하는 '뒤에서부터 처음으로 0이 아닌 값이 나올 때까지의 0의 개수' 는 1 이다. 이런 식으로, 문제가 요구하는 값을 찾아야 하는데 문제는 범위가 1 ~ 20억이라 자칫하면 시간 초과 오류가 발생할 수 있다. 일반적인 순차 접근은 어림도 없으니, 이제 효율적인 알고리즘을 알아보자. 문제에서 요구하는, 뒤에 0이 발생하는 경우는, 2와 5가 만나야만 가능하다. 2와 5를 곱하면 10이다. 어떤 수에 10이 곱해지면 뒤에 0이 하나 생기는 것이다. 그러므로, 우리는 다음의 알고리즘을 적용하면 답을 구할 수 있다. (1) 분자를 ..