React Redux 개요 Props drilling props dilling 의 예시 아래와 같은 구조의 React가 있을 때 해당 배치 상태는 다소 비효율적이다. 상태 끌어올리기와 Props 내려주기를 여러 번 거쳐야하며 애플리케이션이 복잡해질수록 데이터 흐름이 복잡해진다. 컴포넌트 구조가 바뀐다면 데이터의 흐름을 ...

캐릭터의 좌표 문제 머쓱이는 RPG게임을 하고 있습니다. 게임에는 up, down, left, right 방향키가 있으며 각 키를 누르면 위, 아래, 왼쪽, 오른쪽으로 한 칸씩 이동합니다. 예를 들어 [0,0]에서 up을 누른다면 캐릭터의 좌표는 [0, 1], down을 누른다면 [0, -1], left를 누른다면 [-1, 0], ri...

React 장바구니에 상품을 추가하거나 삭제하고,props를 활용하여 총 주문 금액의 상태값이 바뀌는 기능을 구현한다. state.js state 파일에 임의의 값을 작성해 놓는다. export const initialState = { "items": [ { "id" : 1, ...

React 상태 프론트엔드 개발에서 UI에 동적으로 표현될 데이터를 말한다. 예를 들어, 쇼핑몰의 장바구니 안에는 상품의 선택 여부, 선택한 상품의 수량, 장바구니에 담긴 물품, 선택한 물품에 따른 주문 금액 등이 변할 수 있는 상태이다. 상태에 따라 어떤 화면이 영향을 받고, 이 화면을 컴포넌트로 분리하여 컴포넌트가 서로 어떠한 상태를 ...

Algorithm 알고리즘의 성능 평가 어떤 알고리즘이 있을 때, 알고리즘의 성능을 평가하기 위해 사용하는 척도이다. 그 중 시간 복잡도와 공간 복잡도가 있는데, 동일한 기능을 수행하는 알고리즘이 있을 때 복잡도가 낮을 수록 좋은 알고리즘이라고 한다. 시간 복잡도 : 특정한 크기의 입력에 대한 알고리즘의 수행 시간 분석 ...

외계어 사전 문제 PROGRAMMERS-962 행성에 불시착한 우주비행사 머쓱이는 외계행성의 언어를 공부하려고 합니다. 알파벳이 담긴 배열 spell과 외계어 사전 dic이 매개변수로 주어집니다. spell에 담긴 알파벳을 한번씩만 모두 사용한 단어가 dic에 존재한다면 1, 존재하지 않는다면 2를 return하도록 solution 함수를...

React ClickToEdit 값을 입력했을 때에 정해진 요소의 값을 입력한 값으로 바꿔주는 기능 구현 컴포넌트 짜기 입력할 컴포넌트와 입력을 출력할 컴포넌트로 나눈다. 나머지는 styled-component로 감싸준다. return ( <> <InputView> <MyInp...

React Autocomplete 갖고 있는 정보에 일치하는 문자를 입력했을 경우, 아래에 문자와 일치하는 정보를 나타내는 기능 구현 컴포넌트 짜기 입력창을 갖고 있는 컴포넌트와 입력을 받았을 때 하위에 자동완성 기능을 나타낼 컴포넌트로 나눈다. 컴포넌트 안에 요소를 작성한다. return ( <InputCont...

isSubsetOf 문제 두 개의 배열(base,sample)을 입력받아 sample이 base의 부분집합인지 여부를 리턴한다. let isSubsetOf = function(base,sample){ } 입력 base number 타입을 요소로 갖는 배열 base.lenght는 100 이하 ...

React Tag 값을 입력 후 Enter 키를 누르면 값이 태그 형태로 들어가는 기능 구현 컴포넌트 짜기 컴포넌트를 나눈다. 우리가 작성해야 하는 것은 태그를 감싸고 있는 박스 하나. 그 안에 태그를 달아주는 것과 입력하는 것을 모두 작성했지만 각 컴포넌트로 쪼갤 수 있다. ul안에 li가 있고,...