그리디 문제입니다. A와 B로 이루어진 문자열 2개가 주어집니다. 2개의 문자열을 S와 T문자열이라 할때 S문자열을 T문자열로 만들 수 있는지 찾아야합니다. 2가지 경우의 수 1. S문자열의 뒤에 A를 추가한다. 2. S문자열을 뒤집고 뒤에 B를 추가한다. S문자열을 T문자열로 바꾸는 것이 아닌 T문자열을 S문자열로 바꿀 수 있는지 찾는 단계를 밟으면 해결할 수 있습니다. 1번과 2번 결국 뒤에 A와 B를 추가합니다. 이는 S문자열의 마지막 글자를 보면 어떤 작업이 이루어 졌는지 볼 수 있습니다. 마지막 글자가 A면 => A를 추가한 상태 마지막 글자가 B면 => 문자열을 뒤집고 B를 추가한 상태 이를 토대로 마지막 글자가 A면 => A를 빼기 마지막 글자가 B면 => B를 빼고 문자열을 뒤집기 위의 과..

투포인터 문제입니다. 3 가지 경우가 있습니다. 1. 문자의 좌우가 대칭되는경우 회문 (0) 2. 문자의 한글자를 빼서 대칭되는 경우 유사 회문 (1) 3. 둘다 아닌 경우 (2) 왼쪽과 오른쪽에 각각 포인터를 둡니다. 두 위치에서 값이 같은지 확인하고 같으면 한칸씩 안쪽으로 이동합니다. 왼쪽과 오른쪽의 위치가 같아지거나 왼쪽이 더 커진 경우 반복을 멈춥니다. 만약 값이 다른 경우 한글자를 뺄 수 있으므로 2가지 경우가 가능합니다. 1. 왼쪽을 뺀 경우 2. 오른쪽을 뺀 경우 1번의 경우 왼쪽만 한칸 오른쪽으로 이동해서 위의 과정을 반복합니다. 2번의 경우 오른쪽만 한칸 왼쪽으로 이동해서 위의 과정을 반복합니다. 위의 경우 이미 한 글자를 지웠으므로 체크를 해둡니다. 결과적으로 2가지 경우가 발생합니다...

브루트포스 문제입니다. 규칙에 맞게 가능한 경우의 수를 구해야합니다. 규칙 1. 두 문제 이상 2. 문제의 난이도의 합이 L보다 크거나 같고 R보다 작거나 같음 3. 가장 어려운 문제와 가장 쉬운문제의 차이는 X보다 큼 DFS를 돌면서 위의 규칙에 해당하면 카운팅을 해주었습니다. import java.io.BufferedReader; import java.io.BufferedWriter; import java.io.InputStreamReader; import java.io.OutputStreamWriter; import java.util.StringTokenizer; public class Main { static int n; static int l; static int p; static int x; ..

Ref란? HTML에서 id를 사용하여 DOM에 이름을 다는 것처럼 리액트 프로젝트 내부에서 DOM에 이름을 다는 방법이 있다. 바로 ref(reference의 줄임말) 개념이다. ref는 render 메서드에서 생성된 DOM 노드나 리액트 엘리먼트에 접근할 수 있도록 레퍼런스 값을 만들어준다. Ref를 통해서 DOM 노드나 리액트 엘리먼트에 접근하여 값을 얻어낼 수 있다. id 대신 ref? 리액트 컴포넌트 안에서도 id를 사용할 수는 있다. 하지만 컴포넌트의 특성상 여러번 사용되게 되면 HTML에서 id가 중복되어 나타나기 때문에 잘못된 사용이 된다. 반면 ref는 전역적으로 작동하지 않고 컴포넌트 내부에서만 작동하기 때문에 이런 문제가 생기지 않는다. 어떤 상황에서 ref를 사용해야 할까? ref는..

4.1 리액트의 이벤트 시스템 HTML에서 이벤트를 작성하던 것과 비슷합니다. 아래는 HTML에서의 이벤트 입니다. 예시 버튼 리액트에서의 이벤트는 어떨까요? 이벤트를 사용할 때 주의 사항 1. 이벤트 이름은 카멜 표기법으로 작성 - React: onClick - HTML: onclick 2. 이벤트에 실행할 자바스크립트 코드를 전달하는 것이 아니라, 함수 형태의 값을 전달 - React: 함수 형태의 객체 - HTML: 큰따옴표 안에 실행할 자바스크립트 코드 3. DOM 요소에만 이벤트를 설정 div, button,,, 등의 DOM 요소에는 이벤트를 설정 할 수 있지만, 직접 생성한 컴포넌트는 불가능 합니다. 위와 같이 직접 만든 MyComponent에 onClick 이벤트를 설정한다고 해서 해당 컴포..

컴포넌트의 기능은 단순한 템플릿 이상이다 - 데이터가 주어졌을 때 UI 생성 - 라이프사이클 API를 이용하여 컴포넌트가 화면에서 나타나거나 사라지는 등 변화가 나타날 때 주어진 작업을 처리 - 임의 메서드를 만들어 특별한 기능을 추가 클래스형 컴포넌트 import { Component } from 'react'; class App extends Component { // render 함수가 꼭 필요하다. render() { const name = 'react'; return {name} } } export default App; 클래스형 컴포넌트와 함수 컴포넌트 차이 클래스형 컴포넌트 - 객체지향 프로그래밍 구조를 가지며, state를 초기화 하기 위해 constructor을 가진다. - 코드가 길고 ..

리액트를 사용하는 이유 최근 몇 년간 개발자들은 자바스크립트에 열광하고 있습니다. 자바스크립트는 웹 브라우저에서 간단한 연산을 하거나 시각적인 효과를 주는 단순한 스크립트 언어에 불과하지만 현재는 웹 어플리케이션에서 가장 핵심적인 역할을 합니다. 자바스크립트만으로 규모가 큰 어플리케이션을 만들 수 있는 시대가 왔지만 대규모 어플리케이션을 특별한 도구 없이 순수하게 JS로만 관리하기엔 힘듭니다. 따라서 지금까지 수많은 프레임워크(Angular, Backbone.js, Vue.js 등)가 조금씩 다른 관점에서 이를 해결하기 위해 노력해왔습니다. 자바스크립트 기반 프레임워크 이 프레임워크들은 주로 MVC, MVVM, MVW 아키텍처를 사용합니다. MVC(Model-View-Controller) 아키텍처 Mod..

누적합 문제입니다. 개똥벌레가 직선으로 이동할 때 파괴해야 하는 장애물의 최솟값과 그러한 구간의 개수를 구해야합니다. 장애물은 높이가 주어지고 아래, 위, 아래, 위 ... 아래, 위 순서로 설치됩니다. 먼저 위 아래를 구분해서 배열을 만들어주었습니다. 그리고 각 높이의 개수를 구해줍니다. 그렇다면 예를들어 아래와 같은 배열이 만들어집니다. 위 3미터 2개 위 2미터 3개 위 1미터 1개 아래 3미터 1개 아래 2미터 2개 아래 1미터 2개 위처럼 만들어졌다고 가정하면 누적합을 사용해서 값을 더해줍니다. 3미터인 경우 2미터도 포함이므로 3미터를 2미터에 더해줍니다. 더해진 2미터를 1미터에 더해줍니다. 누적합 배열이 만들어졌습니다. 위 3미터 2개 위 2미터 5개 위 1미터 6개 아래 3미터 1개 아래..