전체 글

전체 글

    [프로그래머스 Level 2] 무인도 여행 - JavaScript

    [프로그래머스 Level 2] 무인도 여행 - JavaScript

    🔗 문제 링크 https://school.programmers.co.kr/learn/courses/30/lessons/154540 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr ✏️ 풀이 function solution(maps) { const xLen = maps.length; const yLen = maps[0].length; const offset = [[0, 1], [0, -1], [1, 0], [-1, 0]]; const visited = Array.from({ length: xLen }, () => Array(yLen).fill(false));..

    [프로그래머스 Level 2] 호텔 대실 - JavaScript

    [프로그래머스 Level 2] 호텔 대실 - JavaScript

    🔗 문제 링크 https://school.programmers.co.kr/learn/courses/30/lessons/155651 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr ✏️ 풀이 function solution(book_time) { const getTime = (date) => { const [hour, minute] = date.split(':'); return hour * 60 + Number(minute); }; const rooms = []; book_time .sort((a, b) => getTime(a[0]) - getTime(b[0..

    [백준 2447 - Node.js] 별 찍기 - 10

    [백준 2447 - Node.js] 별 찍기 - 10

    🔗 문제 링크 https://www.acmicpc.net/problem/2447 2447번: 별 찍기 - 10 재귀적인 패턴으로 별을 찍어 보자. N이 3의 거듭제곱(3, 9, 27, ...)이라고 할 때, 크기 N의 패턴은 N×N 정사각형 모양이다. 크기 3의 패턴은 가운데에 공백이 있고, 가운데를 제외한 모든 칸에 별이 www.acmicpc.net ✏️ 풀이 const N = Number(require('fs').readFileSync('/dev/stdin').toString().trim()); const basicPattern = ['***', '* *', '***']; const getPattern = (n) => { if (n === 3) { return basicPattern; } const ..

    [프로그래머스 Level 3] N으로 표현 - JavaScript

    [프로그래머스 Level 3] N으로 표현 - JavaScript

    🔗 문제 링크 https://school.programmers.co.kr/learn/courses/30/lessons/42895 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr ✏️ 풀이 function solution(N, number) { const dp = Array.from({ length: 9 }, () => new Set()); dp[1].add(N); for (let i = 1; i num2) { dp[i].add(num1 - num2); } if (num2 > 0) { dp[i].add(Math.floor(num1 / num2)); } 이렇게..

    [프로그래머스 Level 2] 프린터 - JavaScript

    [프로그래머스 Level 2] 프린터 - JavaScript

    🔗 문제 링크 https://school.programmers.co.kr/learn/courses/30/lessons/42587 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr ✏️ 풀이 function solution(priorities, location) { const docs = priorities.map((priority, index) => ({ priority, index })); let order = 1; while (true) { const { priority, index } = docs.shift(); if (docs.some(({ prior..

    [Recoil] Duplicate atom key 에러 메시지 없애기 (Next.js, Vite)

    [Recoil] Duplicate atom key 에러 메시지 없애기 (Next.js, Vite)

    Expectation Violation: Duplicate atom key "{아톰 키}". This is a FATAL ERROR in production. But it is safe to ignore this warning if it occurred because of hot module replacement. 개발 환경에서 Recoil을 사용할 때 HMR 때문에 Recoil 관련 파일이 변경될 때마다 이러한 에러가 뜨곤 한다. 주로 Next.js나 Vite를 사용하면 이러한 에러를 볼 수 있는 것 같다. 이와 관련한 이슈가 계속되자 0.7.6 버전에서 이 에러를 띄우지 않게 하는 RECOIL_DUPLICATE_ATOM_KEY_CHECKING_ENABLED라는 설정이 새로 추가되었다. 환경 변수에서 ..

    [백준 2470 - Node.js] 두 용액

    [백준 2470 - Node.js] 두 용액

    🔗 문제 링크 https://www.acmicpc.net/problem/2470 2470번: 두 용액 첫째 줄에는 전체 용액의 수 N이 입력된다. N은 2 이상 100,000 이하이다. 둘째 줄에는 용액의 특성값을 나타내는 N개의 정수가 빈칸을 사이에 두고 주어진다. 이 수들은 모두 -1,000,000,000 이상 1,000,00 www.acmicpc.net ✏️ 풀이 const [N, input] = require('fs') .readFileSync('/dev/stdin') .toString() .trim() .split('\n'); const solutions = input .split(' ') .map(Number) .sort((a, b) => a - b); let i = 0; let j = N -..

    [CSS] position: fixed가 깨지는 현상 (feat. transform)

    [CSS] position: fixed가 깨지는 현상 (feat. transform)

    position: fixed는 뷰포트를 기준으로 요소를 배치하는 속성이다. 따라서, 상대적이지 않고 항상 동일한 위치에 배치된다. 그런데 position: fixed를 사용했음에도 불구하고 지정한 위치에 배치되지 않는 경우가 있다. 부모 또는 조상 요소의 transform 속성에 translate, translateX, translateY, translate3d 등을 사용하면 영향을 받아 position: fixed 된 자손 요소도 위치가 바뀌게 된다. 따라서 올바르게 position: fixed 요소를 배치하려면 transform 속성을 사용하지 않은 조상 요소의 하위 요소로 옮겨야 한다. 참고자료 https://blog.pumpkin-raccoon.com/120 position fixed 깨지는 이슈..

    [Vite/React] Vite HMR 에러 (feat. ContextAPI)

    [Vite/React] Vite HMR 에러 (feat. ContextAPI)

    에러 메시지 [hmr] Failed to reload {파일 경로}. This could be due to syntax errors or importing non-existent modules. (see errors above) 모든 파일이 아닌 일부 파일에서 변경 사항이 발생할 때마다 이런 에러가 발생했다. 단순히 HMR 문제라서 새로고침하면 되긴 하지만 너무 불편했다. 원인을 찾아보니 Vite에서 ContextAPI 관련한 이슈가 있는 것 같다. React에서 Context와 Context의 Provider를 같은 파일 내에서 작성하면 해당 에러가 발생한다. 따라서, Context를 별도의 파일에서 작성 후, import해서 Provider를 사용하면 해결된다. 해당 이슈는 비교적 최근에 해결이 된 ..

    [VSCode/ESLint] ESLint 자동 수정이 적용되지 않을 때

    [VSCode/ESLint] ESLint 자동 수정이 적용되지 않을 때

    vscode에서 eslintrc 설정 후 저장을 하면 eslint fix가 가능한 부분은 자동으로 수정이 된다. 만약 되지 않는 다면 아래의 경우 중 하나일 수도 있기 때문에 하나씩 시도해보고 해결되는지 확인해보면 된다. 1. Format On Save VSCode 설정에서 Format On Save를 검색하여 해당 설정을 체크한다. 2. editor.codeActionsOnSave settings.json 설정에서 editor.codeActionsOnSave에 "source.fixAll.eslint"를 true로 설정한다. { "editor.codeActionsOnSave": { "source.fixAll.eslint": true } } 3. eslint.codeActionsOnSave.rules se..