dev-hpk 님의 블로그

프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr1. 문제제한사항 행의 개수 N : 100,000 이하의 자연수열의 개수는 4개이고, 땅(land)은 2차원 배열로 주어집니다.점수 : 100 이하의 자연수입출력 예landanswer [[1,2,3,5],[5,6,7,8],[4,3,2,1]] 16 입출력 예 설명입출력 예 #1문제의 예시와 같습니다.2. 정답 풀이풀이 전략연산 횟수를 줄이기 위해 DFS(깊이 우선 탐색) 대신 이전 상태를 이용하는 DP(동적 프로그래밍) 방식 사용function solution(land) { // 첫 번째 행은 이미 정해진 값이므로, 두 번째 행(인덱스 1)부터 순회 ..

ISR(Incremental Static Regeneration)은 정적 생성(SSG)의 장점과 실시간 업데이트를 결합한 강력한 기능이며, 이와 관련된 On-Demand ISR은 ISR을 더욱 효과적으로 사용할 수 있도록 돕습니다. 목차 1. ISR(Increamental Static Regeneration)이란? 2. On-Demand ISR이란? 3. ISR vs On-Demand ISR추천글위의 목차를 클릭하면 해당 글로 자동 이동 합니다. 1. ISR(Increamental Static Regeneration)이란?ISR은 정적 페이지를 생성한 이후에도 데이터를 갱신할 수 있도록 지원하는 기능입니다. 기본적으로 getStaticProps 함수와 함께 revalidate 속성을 설정하면, 지정한 시..

개발에서는 프레임워크와 라이브러리라는 용어가 자주 등장합니다. 이 둘은 개발 효율성을 높이고 코드 품질을 향상하기 위해 사용되지만, 그 개념과 활용 방식에서 명확한 차이가 있습니다.  목차 1. 프레임워크(Framework)란? 2. 라이브러리(Library)란? 3. 프레임워크와 라이브러리의 차이 - 제어의 역전(Inversion of Control) 4. 프레임워크와 라이브러리 예시추천글위의 목차를 클릭하면 해당 글로 자동 이동 합니다. 1. 프레임워크(Framework)란?프레임워크는 애플리케이션의 기본 구조를 제공하며, 개발자가 이를 기반으로 코드를 작성해 나가는 "뼈대"입니다.앱/서버 등의 구동, 메모리관리, 이벤트 루프 등 공통된 부분은 프레임워크가 관리하고, 사용자는 프레임워크가 정해준 방식..

프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr1. 문제정수로 이루어진 배열 numbers가 있습니다. 배열의 각 원소들에 대해 자신보다 뒤에 있는 숫자 중에서 자신보다 크면서 가장 가까이 있는 수를 뒷 큰 수라고 합니다.정수 배열 numbers가 매개변수로 주어질 때, 모든 원소에 대한 뒷 큰수들을 차례로 담은 배열을 return 하도록 solution 함수를 완성해 주세요. 단, 뒷 큰 수가 존재하지 않는 원소는 -1을 담습니다. 제한사항 4 ≤ numbers의 길이 ≤ 1,000,0001 ≤ numbers[i] ≤ 1,000,000입출력 예numbersresult[2, 3, 3, 5][3, 5, 5..

프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr1. 문제 제한사항 1 ≤ n ≤ 1,000,0003 ≤ k ≤ 10 입출력 예nkresult43767433110011102 입출력 예 설명입출력 예 #1문제 예시와 같습니다.입출력 예 #2110011을 10진수로 바꾸면 110011입니다. 여기서 찾을 수 있는 조건에 맞는 소수는 11, 11 2개입니다. 이와 같이, 중복되는 소수를 발견하더라도 모두 따로 세어야 합니다. 2. 정답 풀이풀이 전략toString 메서드의 radix를 사용해 n을 k진수로 변환// 소수 판별 함수const isPrime = (num) => { // 약수의 대칭성 이용 Ma..

프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr1. 문제제한사항 dirs는 string형으로 주어지며, 'U', 'D', 'R', 'L' 이외에 문자는 주어지지 않습니다.dirs의 길이는 500 이하의 자연수입니다.입출력 예dirsanswer"ULURRDLLU"7 "LULLLLLLU" 7 입출력 예 설명입출력 예 #1문제의 예시와 같습니다.입출력 예 #2문제의 예시와 같습니다. 2. 정답 풀이풀이 전략Set 객체 사용같은 길에서 방향만 다른 경우를 고려[1,0]에서 'L'이 입력으로 들어온 경우 [0,0] : '1000' hash에 추가[0,0]에서 'R'이 입력으로 들어온 경우 [1,0] : '0010..

웹 개발에서 스타일링은 UI의 품질과 사용자 경험을 좌우하는 중요한 부분입니다. 이를 구현하는 방법에는 CSS-in-CSS, CSS Module, CSS-in-JS가 대표적입니다. 각각의 방식은 접근 방식과 사용 사례가 다르며, 프로젝트의 요구사항에 따라 선택지가 달라질 수 있습니다 목차 1. CSS-in-CSS 2. CSS Module 3. CSS-in-JS 4. CSS-in-CSS, CSS Module, CSS-in-JS 비교위의 목차를 클릭하면 해당 글로 자동 이동 합니다. 1. CSS-in-CSS CSS-in-CSS는 가장 전통적인 스타일링 방식으로, 별도의 CSS 파일에 스타일을 작성하고 HTML 요소에 클래스를 할당하는 방식입니다.특징파일 분리: CSS는 독립적인 파일에 작성되어 HTML, J..

프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr 1. 문제 입력 형식입출력 예ntmpresult2421"0111"161621 "02468ACE11111111" 161622 "13579BDF01234567"  2. 정답 풀이풀이 전략toString 메서드의 radix를 사용function solution(n, t, m, p) { let str = ''; // n진 숫자 // t * m : 총 인원의 수 만큼 n진 숫자 str에 추가 for (let i=0; i { if (idx % m === p-1) return acc + cur; else return acc; ..

React 애플리케이션에서 폼 관리는 매우 빈번한 작업입니다. React State를 이용해 폼 상태를 관리하고, 유효성을 검증하며, 성능을 최적화하는 것은 번거로울 수 있습니다. React Hook Form은 이러한 작업을 간소화하고 성능을 최적화해 주는 가볍고 직관적인 폼 관리 라이브러리입니다.목차 1. React Hook Form이란? 2. React Hook Form 설치 및 기본 사용법 3. 주요 Hook과 함수 4. React Form vs React Hook Form추천글위의 목차를 클릭하면 해당 글로 자동 이동 합니다. 1. React Hook Form이란?React Hook Form은 React의 Hooks API를 기반으로 설계된 폼 관리 라이브러리입니다. HTML의 기본 폼 요소를 활..

Next.js는 정적 사이트 생성(Static Site Generation, SSG)과 서버 측 렌더링(Server-Side Rendering, SSR)을 지원하는 React 기반 프레임워크입니다. 이 글에서는 정적 생성의 개념, 장점, 사용 방법, 그리고 실무에서의 활용 사례를 중심으로 자세히 설명하겠습니다. 목차 1. 정적 생성(SSG)이란? 2. 정적 생성(SSG)의  장점 3. 정적 생성(SSG) 사용 방법 4. getStaticPaths의 fallback 옵션추천글위의 목차를 클릭하면 해당 글로 자동 이동 합니다. 1. 정적 생성이란?정적 생성(SSG)은 Next.js가 빌드 시점에 페이지의 HTML 파일을 미리 생성해 저장하는 렌더링 방식이기 때문입니다. 이렇게 생성된 HTML은 CDN으로 캐..