728x90 반응형 분류 전체보기212 [React] Redux (+Redux Toolkit) 03_Redux 3-1. What is Redux? 크로스 컴포넌트 또는 앱 와이드 상태를 위한 상태 관리 시스템 상태의 종류 Local State 데이터가 변경되어 하나의 컴포넌트에 속하는 UI에 영향을 미치는 상태 ex) 토글버튼, 입력필드 .. useState() , useReducer() 로 관리 Cross-Component State -> Redux 로 관리 다수의 컴포넌트에 영향을 주는 상태 ex) 모달 컴포넌트 prop chains, prop drilling 으로 관리 App-Wide State -> Redux 로 관리 애플리케이션의 모든 컴포넌트에 영향을 주는 상태 ex) 사용자 인증 상태 prop chains, prop drilling 으로 관리 3-2. Why use Redux? 기존 .. 2023. 7. 23. [React] State - 동적 상태 관리 / 생명주기 / 데이터 전달 02_State state? 일반적으로 props와 같은 javascript 객체 props와의 차이점 props : (함수 매개변수처럼) 컴포넌트에 전달 state : (함수 내에 선언된 변수처럼) 컴포넌트 안에서 관리 React로 개발된 소스 코드 내에서 데이터 교환 및 이벤트 등을 동적으로 처리해줄 수 있도록 해줌 Event 생성 예제 const Component = (props) => { // btnVal : 화면에 표시되는 button의 라벨명 let btnVal = props.btnVal; // 기존 props.btnVal에 할당된 값이 'Before-Changing'이라 가정 // 버튼에서 onClick시 호출될 함수 정의 const clickHandler = () => { c.. 2023. 7. 20. [React] Start React 주요 공부 사항 (POINT!) component 생명주기 흐름 이해 Hook 함수 index.js에서 렌더링하여 호출함 index.css index.html => id에 선언된 root를 index.js 에서 호출하여, 렌더링 목록의 대상이 됨 JPX (JavaScript XML) jpx란 ? javascript 확장 문법 React의 element를 생성 -> javascript로 변환되어 브라우저에 적용됨 화면 개발을 위해 html과 javascript를 편하게 사용할 수 있음 => 아래와 같이 간단하게 선언 후, react에서 부과적인 코드들을 뒷단에 추가하여 browser에 보여줌 function App() { return ( Let's get started! visible ); } Co.. 2023. 7. 20. [백준/Python] 2839 설탕배달 | DP(다이나믹 프로그래밍) 📒 문제 🤸♀️ 문제 분석 다른 블로그를 보면 반복문(while)로 구현하여 greedy 방법으로 푼 풀이가 많은데, 요즘 DP 연습을 하고 있기 때문에 DP로 접근하여 문제를 풀었다. DP 테이블에는 '각 무게 별 사용하는 봉지의 최소값'을 저장한다. 이것을 가능하게 하는 조건은 아래와 같다. 3키로와 5키로 각각의 설탕봉지가 있기 때문에, 3키로 전 / 5키로 전 dp값에서 작은 값에 +1 한 값을 현재 dp에 할당하면 된다. 💡 경우의 수는 아래와 같이 세 가지 경우가 있다. case 1) 3kg전, 5kg전의 봉지사용 최소값이 둘 다 존재하는 경우(봉지로 옮길 수 있는 경우), 두 값에 +1 한 것 중 작은 값을 현재 dp에 할당한다. case 2) 3kg전 혹은 5kg 전 둘 중 하나만 존재하.. 2022. 3. 31. [백준/Python] 2579 계단오르기 | 다이나믹프로그래밍(DP) 📒 문제 🤸♀️ 문제 분석 연속 세 개의 계단을 이동할 수 없다는 것은 한칸->한칸 이동이 불가능 하다는 것이다. 1) 두칸 이동 2) 두칸 이동 후, 한칸의 이동만 가능하다. 정리하자면, i 번째 계단에 오기 위해서는 1) i-2번째 계단(두칸전) -> i 번째 계단 2) i-3번째 계단(세칸전) -> i-1번째 계단(한칸전) -> i 번째 계단 둘 중 하나이다. 그림 설명!!!! 나는 방법1은 나름 납득이 되었는데, 방법2에서 i-3은 dp에서 i-3까지의 최대값을 가져오고, i-1번째는 그냥 배열의 값을 가져와서 더해주는 게 이해가 안됐다. 그냥 i-1번째까지의 최대값을 가져오면 되는 것이 아닌가! 싶었는데 i-1번째까지의 최댓값만 구하면 계속 한칸씩만 이동할 것이고 그렇다면 세 칸의 계단을 연속.. 2022. 3. 30. [백준/Python] 1901 회의실 배정 | 그리디(greedy) 📒 문제 https://www.acmicpc.net/problem/1931 🤸♀️ 문제 분석 처음에 괜히 복잡하게 접근했다가 시간초과 판정을 받았다. - 처음에는 sort를 "가장 적은 회의 시간이 소요되는 회의"를 기준으로 오름차순 정렬(A)을 해서, - 회의 차지하는 빈 리스트(B)를 최대시간의 크기만큼 초기화하고, - 회의정보를 담고 있는 리스트(A)를 앞에서부터 살피며, 회의를 차지하고, 차지한 경우 리스트(B)에 각 인덱스를 채워주고 - 아닌 경우 A 반복을 break 걸고.. 뭐 이런식으로 복잡하게 접근했다. 💡 그러다가 sorting을 - 시작 시간 기준으로 오름차순 한번 - 끝나는 시간 기준으로 오름차순 한번 하면 간단하게 풀 수 있다는 것을 깨달았다(=구글링했다) 해당 기준으로 하면 회.. 2022. 3. 28. [백준/Python] 11047 동전0 | 그리디(greedy) 📒 문제 🤸♀️ 문제 분석 원하는 k의 값을 만들기 위해 최소의 동전의 수를 구해야 하기 때문에, 💡 가지고 있는 동전 중 단위가 큰 동전부터 k로 나누어 떨어지는 동전을 연산하는 것이 유리하다. 이러한 그리디 연산이 가능한 이유는 문제에 나와있는 조건인동전이 1 ≤ Ai ≤ 1,000,000, A1 = 1, i ≥ 2인 경우에 Ai는 Ai-1의 배수 이기 때문이다. 그렇기 때문에 작은 단위의 동전으로 만들 수 있는 금액을 큰 단위의 동전으로도 반드시 만들 수 있기 때문에, 큰 단위의 동전부터 계산하는 것이 유리한 정렬 후 greedy 방식을 적용할 수 있다. 🧮코드 # 11047 동전0 # n : 가지고 있는 동전의 종류 # 동전의 가치의 합 = k # 이 때 필요한 동전의 개수의 최솟값 n, k =.. 2022. 3. 28. python | 1439번. 뒤집기 | greedy(그리디) 📒 문제 🤸♀️ 문제 분석 연속되는 숫자의 묶음이 적은 수를 뒤집는 것이 유리하다. 💡 즉, 문자열에서 모든 수를 0으로 만드는 경우와 1로 만드는 경우를 비교하여 둘 중 행동이 적은 값을 선택하면 된다. 구하는 방법은 코드에서 확인할 수 있다. 🧮코드 def string_swap(numbers): # 0혹은 1의 문자열을 뒤집어서 1또는 0으로 통일되기 위한 횟수 swap_to_zero = 0 swap_to_one = 0 # 매번 비교대상의 숫자 (처음에는 맨 앞 숫자) temp = numbers[0] # 처음에는 맨 앞 숫자값가 아닌 값을 1로 세팅 if temp == '0': swap_to_one = 1 else: swap_to_zero = 1 # 입력 숫자를 첫번째 숫자 제외하고 하나씩 확인 f.. 2022. 3. 24. python | 곱하기 혹은 더하기 | 그리디(greedy) 대표적인 그리디 문제 중 또 쉬운 난이도인 곱하기 혹은 더하기 문제를 풀어보겠다. 📒 문제 각 자리가 숫자(0부터 9)로만 이루어진 문자열 S가 주어졌을 때, 왼쪽부터 오른쪽으로 하나씩 모든 숫자를 확인하며 숫자 사이에 '*' 혹은 '+' 연산자를 넣어 결과적으로 만들어질 수 있는 가장 큰 수를 구하는 프로그램을 작성하세요. 단, +보다 X를 먼저 계산하는 일반적인 방식과는 달리, 모든 연산은 왼쪽에서부터 순서대로 이루어진다고 가정합니다. 예를 들어 02984라는 문자열이 주어지면, 만들어질 수 있는 가장 큰 수는 ((((0+2) 9) 8) * 4) = 576 입니다. 입력 예시1: 02984 출력 예시1: 576 입력 예시2: 567 출력 예시2: 210 🤸♀️ 문제 분석 숫자를 하나씩 확인하며, 💡.. 2022. 3. 24. 이전 1 2 3 4 5 ··· 24 다음 728x90 반응형
