짧은코딩

Transition Transition은 어떤 상태에서 다른 상태로의 변화를 애니메이션으로 만드는 방법이다. Go home transition는 state가 없는 곳에 써야한다. 그리고 여러 가지 속성을 넣을 수 있지만 그냥 a와 a:hover에서 다르게 설정한 color, background-color, border-radius만 서서히 움직일 수 있도록 해준다. 그리고 몇 초 동안 변할 것인지 시간을 써줄 수 있다. transition: all 5s ease-in-out; 혹은 all로 쓰면 a와 a:hover과 다른 요소를 모두 변하게 해줄 수 있다. -ease-in function 브라우저에게 애니메이션이 어떻게 변할지 말해주는 것이다. https://matthewlein.com/tools/cea..

최적의 해를 구하기 위해 시간 소요가 많거나 메모리를 많이 차지하는 문제는 컴퓨터로도 해결하기 어렵다. 그래서 연산 속도, 메모리를 최대한으로 활용할 수 있는 효율적인 알고리즘을 작성해야 한다. 어떤 문제는 메모리 공간을 약간만 더 사용하면 속도를 비약적으로 증가시킬 수 있다. 이런 것을 동적 계획법이라고 한다. 다이나믹 프로그래밍 방식은 탑다운, 보텀업 2가지 방식이 있다. 특히 다이나믹 프로그래밍을 위해 자주 사용되는 메모이제이션 기법도 있다. 프로그래밍에서 다이나믹은 '프로그램 실행되는 도중에'라는 의미이다. 하지만 다이나믹 프로그램에서 '다이나믹'은 이런 의미가 아니다. -피보나치 수열 다이나믹 프로그래밍으로 해결할 수 있는 대표적인 예시는 피보나치 수열이 있다. 피보나치 수열의 점화식(인접한 항..

-이전에 정리한 글 https://shortcoding.tistory.com/194?category=1007874 복잡한 상태 관리 로직 분리하기 App 컴포넌트에는 굉장히 많은 상태들이 존재한다. -상태 변화 처리 함수 onCreate: 데이터 생성 onEdit: 데이터 수정 onRemove: 데이터 삭제 이 3개의 상태 변화 로직이 있다. 함수들 안에 data가 많다. 이 shortcoding.tistory.com 이 글과 함께 보면 더 잘 이해가 될 것이다. 1. 상태 관리 세팅하기 -App.js const [data, dispatch] = useReducer(reducer, []); 복잡한 상태의 로직을 분리하기 위해서 useReducer를 사용한다. 2. 프로젝트 State Context 세팅하..

1. 폰트 세팅 https://fonts.google.com/ Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com 이 사이트에 가면 여러 가지 폰트가 있다. 이 중에서 나눔펜, 연성 글꼴을 사용할 것이다. -App.css @import url("https://fonts.googleapis.com/css2?family=Nanum+Pen+Script&family=Yeon+Sung&display=swap"); .App { padding: 20px; font-family: "Nanum Pen Script", cursive; font-family: "Yeon Sung", cursive;..

https://www.acmicpc.net/problem/1654 1654번: 랜선 자르기 첫째 줄에는 오영식이 이미 가지고 있는 랜선의 개수 K, 그리고 필요한 랜선의 개수 N이 입력된다. K는 1이상 10,000이하의 정수이고, N은 1이상 1,000,000이하의 정수이다. 그리고 항상 K ≦ N 이다. 그 www.acmicpc.net 내 풀이(반례 보고 맞춤) n, m = map(int, input().split()) ary = [] for i in range(n): ary.append(int(input())) start = 1 end = max(ary) answer = 0 while (start = mid: total += ary[i] // mid #너무 짧게 짤랐다. if total >= m: ..

https://www.acmicpc.net/problem/2805 2805번: 나무 자르기 첫째 줄에 나무의 수 N과 상근이가 집으로 가져가려고 하는 나무의 길이 M이 주어진다. (1 ≤ N ≤ 1,000,000, 1 ≤ M ≤ 2,000,000,000) 둘째 줄에는 나무의 높이가 주어진다. 나무의 높이의 합은 항상 M보 www.acmicpc.net 내 풀이(맞음) n, m = map(int, input().split()) ary = list(map(int, input().split())) start = 0 end = max(ary) answer = 0 while (start mid: total += ary[i] - mid if m > total: end = mid - 1 else: start = mid..

이 문제는 전형적인 이진 탐색 문제이자 파라메트릭 서치 유형의 문제이다. 파라메트릭 서치는 최적화 문제를 예/아니요로 답하는 문제인 결정 문제로 바꾸어 해결하는 기법이다. 이 문제 풀이는 절단기 높이를 반복해서 조정하는 것이다. 당연한 말이지만 절단기 높이는 0부터 가장 긴 떡의 길이 안에 있어야 한다. 따라서 절단기의 범위인 0~가장 긴 떡의 길이를 고려하면 된다. start는 0이고 end는 가장 긴 떡의 길이로 두면 된다. 내 풀이 n, m = map(int, input().split()) ary = list(map(int, input().split())) ary.sort() def search(ary, target, start, end): mid = (start + end) // 2 sum = 0..

PAGE ROUTING ROUTER: 데이터의 경로를 실시간으로 지정해주는 역할 ROUTING: 경로를 정해주는 행위와 과정을 다 포함하는 말, 어떤 네트워크 내에서 통신 데이터를 보낼 경로를 선택하는 과정 PAGE ROUTING: 요청에 따라서 어떤 페이지를 돌려줄지 정해주는 것 -MPA(Multipage Application) 이렇게 여러 개의 페이지를 준비했다가 요청이 들어오면 적절한 페이지를 돌려주는 것을 MPA라고 한다. -SAP(Single Page Application) 리액트는 MPA가 아닌 SPA를 사용한다. SPA는 페이지가 하나 밖에 없는 간단한 어플리케이션이다. SPA는 페이지를 이동할 때 위 부분이 전혀 깜빡이지가 않는다. 핸드폰에서 사용하는 것 처럼 이동이 빠르다. 우선 처음엔 ..

내 풀이(이진 탐색을 어이없게 구현하지 못함) # 이진 탐색 def binary(ary, target, start, end): left = start mid = (start + end) // 2 right = end if left > right: return "no" if target == ary[mid]: return "yes" elif target < ary[mid]: return binary(ary, target, left, mid-1) else: return binary(ary, target, mid+1, right) n = int(input()) ary = list(map(int, input().split())) ary.sort() m = int(input()) chk = list(map(int..

트리 이진 탐색의 전제 조건은 데이터가 정렬되어 있어야 한다. DB는 내부적으로 대용량 데이터 처리에 적합한 트리 구조를 사용하여 데이터가 항상 정렬되어 있다. 이진 탐색과 유사한 방법을 이용해 탐색을 항상 빠르게 수행하도록 설계되어 있다. 1. 트리는 부모, 자식 노드로 구성 2. 최상단 노드 = 루트 노드 3. 최하단 노드 = 단말 노드 4. 일부를 때어내도 트리 구조이며 서브 트리라고 부른다. 5. 파일 시스템처럼 계층적이고 정렬된 데이터를 다루기 적합하다. 이진 탐색 트리 트리 자료구조 중에서 가장 간단한 형태가 이진 탐색 트리이다. 1. 부모 노드보다 왼쪽 자식 노드가 작다. 2. 부모 노드보다 오른쪽 자식 노드가 크다. -이진 탐색 트리 1. 위 그림에서 37를 찾기 위해서는 먼저 루트 노드부..