khakha's dev log

백준 11561. 징검다리 / python / Silver 3 / 1h+문제 및 코드https://www.acmicpc.net/problem/11561T = int(input())tc = []for _ in range(T): tc.append(int(input()))for n in tc: start = 1 end = n answer = 0 while start 접근 방식징검다리가 n개 일 때, 처음 건넌 거리보다 다음번부터는 최소 1 이상 넘는 거리를 뛰어야 하므로 1 + 2 + 3 + ... + k 형태의 등차수열 합을 만족하는 건넌 횟수가 필요하다.등차수열의 합 구하는 공식은 k(k+1)/2 이므로 이분탐색으로 n에 가장 가까운 k를 구해주면 된다.후기이분탐색인지 알고 풀면..

백준 1072. 게임 / node.js / Silver 3 / 51m문제 및 코드https://www.acmicpc.net/problem/1072const filePath = process.platform === "linux" ? "./dev/stdin" : "input.txt";let [x, y] = require("fs") .readFileSync(filePath) .toString() .trim() .split(" ") .map((num) => +num);let z = Math.floor((y * 100) / x);let left = 1;let right = 1000000000;let answer = Number.MAX_SAFE_INTEGER;while (left 접근 방식이분 탐색 알고리..

이분 탐색이란이분탐색(Binary Search)은 정렬된 배열에서 원하는 값을 빠르게 찾기 위한 알고리즘입니다.시간 복잡도가 O(log⁡n)이기 때문에, 탐색 속도가 매우 빠르고 효율적입니다.이분탐색의 핵심 개념은 탐색 범위를 반씩 줄여가며 원하는 값을 찾아가는 데 있습니다.이분 탐색의 작동 원리초기 설정: 탐색 범위의 시작점 left와 끝점 right를 설정합니다. 처음에는 left는 배열의 첫 번째 인덱스, right는 마지막 인덱스로 설정합니다.중간값 계산: left와 right의 중간 인덱스 mid를 계산합니다. mid = (left + right) // 2.값 비교:중간값 arr[mid]가 찾고자 하는 값 target과 일치하면, mid를 반환하여 탐색을 종료합니다.arr[mid]가 target..

Next.js app 라우터 버전에서 layout 파일은 다음과 같은 역할을 한다.여러 route 간에 공유되는 UI페이지 이동시 state를 유지하고 interactive 요소를 유지하며 리렌더링이 일어나지 않는다.레이아웃은 중첩해서 존재할 수 있다.레이아웃은 기본적으로 layout.js 파일에서 React 컴포넌트를 정의하게 된다.해당 컴포넌트는 렌더링 중에 자식 레이아웃(존재하는 경우)이나 페이지로 채워질 children prop을 허용해주어야 한다.📦 app├── 📄 layout.tsx│ └── 📂 dashboard │ ├── 📄 layout.tsx│ ├── 📄 page.tsx│ └── 📂 settings└────────────└──📄 page...

invalidateQueries는 POST, PATCH, DELETE, .. 등의 요청이 완료된 이후 새롭게 데이터를 페칭해야할 때 캐싱된 쿼리를 무효화하는 메서드입니다. 기본적으로 queryKey와 일치하는 모든 쿼리를 즉시 유효하지 않은 것으로 표시하고 active한 상태의 쿼리는 refetch합니다. 무효화시키고 싶은 queryKey를 매칭해주는 방식은 여러가지 존재합니다. 아래 방식으로 적절하게 키를 지정해줘야 정확하게 쿼리를 무효화할 수 있습니다. 키는 hierarchy 구조이기 때문에, 이를 활용해서 화면 영역을 분리하는 용도로도 키를 설정할 수 있습니다. 1. prefix 무효화하고 싶은 접두사로 시작하는 모든 쿼리를 무효화할 수 있습니다. import { useQuery, useQueryC..

사이드 프로젝트를 하면서 여느때와 같이 Axios 인스턴스를 만들어서 사용하고 있다. 칸반 리팩토링을 하면서 Generics을 사용해 서버에서 만들어주는 응답값 인터페이스를 만들고, 각 api 함수를 선언시 Generics에 들어갈 타입을 지정해주도록 수정해서 pr을 올렸었다. // apis/kanban.ts interface IResponse { success: boolean; error: any; data: T; } export const fetchKanbanList = async (): Promise => { const data: IResponse = await goHigerApi.get('/v1/applications/kanban'); return data; }; 첨엔 나름 괜찮은것같다고 생각했지..

입력과 출력 모든 함수는 입력과 출력이 있습니다. 입력은 함수가 계산을 하기 위한 외부정보, 출력은 함수 밖으로 나오는 정보나 어떤 동작입니다. 함수를 호출하는 것은 어떠한 결과(출력)가 필요하기 때문이며 이를 얻으려면 입력이 필요합니다. 명시적 입/출력과 암묵적 입/출력 입력과 출력은 명시적이거나 암묵적일 수 있습니다. var total = 0; // 전역변수 function add_to_total(amount) { // amount : 인자는 명시적 입력입니다. console.log("Old total: " + total); // total : 전역변수를 읽는 것은 암묵적 입력, 콘솔을 찍는 것은 암묵적 출력입니다. total += amount; // 전역변수를 수정하는 것은 암묵적 출력입니다. re..

게발하는 애플리케이션의 크기가 커지면서 파일을 여러 개로 분리하게 되는데 이때 분리된 파일 각각을 '모듈(module)'이라고 부릅니다. 모듈은 대개 클래스 하나 혹은 특정한 목적을 가진 복수의 함수로 구성된 라이브러리 하나로 구성됩니다. 스크립트의 크기가 점차 커지고 기능도 복잡해지자 자바스크립트 커뮤니티에서 특별한 라이브러리를 만들어 필요한 모듈을 언제든지 불러올 수 있게 해준다거나 코드를 모듈 단위로 구성해 주는 방법을 만드는 등을 통해 모듈 시스템을 개발하게 되었습니다. AMD - 가장 오래된 모듈 시스템 중 하나로 require.js라는 라이브러리를 통해 처음 개발 CommonJS - node.js 서버를 위해 만들어진 모듈 시스템 UMD - AMD와 CommonJS와 같은 다양한 모듈 시스템을..

함수형 프로그래머는 액션과 계산, 데이터를 구분하여 개발과정에서 적용할 수 있습니다. 데이터 이벤트에 대한 사실. 일어난 일의 결과를 기록한 것입니다. e.g. 구입하려는 음식 목록, 이름, 전화 번호, 음식 조리법 데이터는 데이터 자체로 할 수 있는 것이 없기 때문에 데이터 그대로 이해할 수 있는 것이 장점입니다. 해석하지 않아도 실행할 수 있는 계산에 비해 해석이 반드시 필요하다는 점은 단점입니다. 데이터를 언제나 쉽게 해석할 수 있도록 표현하는 것이 함수형 프로그래밍에서 중요한 기술입니다. 계산 입력값으로 출력값을 만드는 것. 순수 함수, 수학 함수라고 부르기도 합니다. e.g. 최댓값 찾기, 이메일 주소가 올바른지 확인하기 실행 시점과 횟수에 관계없이 항상 같은 입력값에 대해 같은 출력값을 돌려줍..

컴포넌트 렌더링 중에 상태를 업데이트하려고 시도했기 때문에 발생한 경고이다. 워닝 문구 마지막에 Github issue에서처럼 에러가 발생한 부분을 확인하라고 알려주고 있다. Kanban.tsx const { data, isLoading, isSuccess } = useQuery('fetchKanbanList', fetchKanbanList); if (!isLoading && isSuccess) { const kanbanList = data.data; dispatch(setApplications(kanbanList)); } useQuery훅이 렌더링중에 호출되고, 데이터가 잘 받아와지면 dispatch를 호출하여 스토어 상태를 업데이트하도록하였다. 이는 렌더링 중에 상태를 업데이트하는 것인데, 잘못된 패..