분류 전체보기

overview (react 에서는 2020년 12월에 React Server Components가 소개되었습니다. ) (즉, RSC은 react 팀이 설계한 새로운 애플리케이션 아키텍처이고 이것을 next.js 에서도 사용할 수있도록 업데이트 한것입니다.) 이 모든것은 필자가 Next.js 13 버전으로 새롭게 프로젝트를 시작하는데 라우팅 방식을 조금 더 향상시킬 수 있는 `app/` 이라는 디렉토리를 사용하다가 아래와 같은 에러를 만나면서 시작되었습니다. 이 에러를 해결하는 법은 정말 간단하지만 "왜? 그렇게 해야할까?"에 대해 정리가 필요하다 느꼈고 그러던 와중 `서버 컴포넌트`에 대해 자세히 몰라서 정리하게 되었습니다. 1. What are Server Components 서버 컴포넌트는 애플리케..

프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 나의 풀이 문제가 길어서 어려운 문제인가 싶었는데 다 읽고나니 괜히 겁먹었던 것 같다. 결론적으로 파일을 삭제하기 위해 드래그를 해야하는데 최소 사각형으로 드래그했을 때의 좌표값을 구하면 된다. 모든 #의 좌표를 구해서 최적의 lux,rdx luy,rdy를 구해도된다. 굳이 모든 좌표를 구해야 하나 싶어서 조금 더 생각해보았다. 상하좌우 각 끝점을 구하면 조금 더 쉽게 풀수 있을 것 같았다. 예를 들면 아래와 같다. 1. 맨 왼쪽에있는 파란색 파일의 luy = 3 2. 맨 위쪽에있는 하늘색 파일의 lux = ..

프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 나의 풀이 처음에는 targets을 반목문을 돌리면서 각 keymap를 돌아다니며 해당 알파벳에대해 최소로 누를 수 있는 횟수를 구할려고 했으나 시간이 오래걸릴 것 같아서 다른방법을 고민해보았다. 문자열을 작성하고자 할때 A는 최소 n번 B는 최소 m번 등 이런식으로 keymap에서 각 최소 횟수를 파악해서 객체안에 알파벳별로 넣으면 될 것 같았다. 1. keymap을 반복문을 사용해서 알파벳 별로 최소누를 수 있는 횟수를 저장한다. 2. targets에 있는 문자열을 for문을 통해서 해당 알파벳이 keym..

나의 풀이 각 트럭마다 위치를 지정해줘서 1초가 지날때마다 위치를 한칸씩 움직여줘서 다리 길이랑 위치가 같을때 도착을 카운트하면 되겠다 싶었다. function solution(bridge_length, weight, truck_weights) { const trucksCrossingBridge = [] let currentBridgeWeight = 0 let second = 0 while(true) { // 현재 다리의 무게가 0이고 대기중인 트럭이 없을 때 '초' return if(!currentBridgeWeight && !truck_weights.length) return second // 다리를 지나가고있는 트럭이 있을 때 if(trucksCrossingBridge.length) { // 트럭 ..

나의 풀이 queue로 풀지만 index가 필요하기에 배열을 이중배열로 만들어서 풀어야겠다 싶었다. 위 예제로 보자면 priorities = [ [2,0] , [1, 1], [3, 2], [2, 3] ] 이런식으로 [[priority, index], ....] 이렇게 구성이 된다. 이것을 기준으로 더 높은 우선순위가 없다면 queue에 들어간다 즉 처리된다는 뜻이다. 그런데 이때 index === location 이면 바로 결과값을 return 한다. 더 높은 우선순위가 있다면 다시 priorities 배열에 넣어준다. function solution(priorities, location) { const queue = [] priorities = priorities.map((priority, index)..

나의 풀이 문제의 난이도보다 문제를 풀다 실수를 했는데 그것 때문에 시간을 너무 많이 잡아먹었다. 평소에는 처음 풀때는 좋은 변수명이 생각나지않아 대충 변수명을 하고 코테문제를 풀고 문제를 다시 리팩터링하면서 변수명을 고친다. 하지만 오늘 이렇게 하다가 변수명이 중복이 되어서 맞게 풀었는데 계속 틀린답이 나왔다. for문을 작성할때 조건문에 var가아닌 let으로 선언하면 지역변수가 되기때문에 외부에 있는 변수와 같은이름을 할수있는데 이부분에서 문제가 발생하였다. 이제 처음 문제풀때부터 변수명을 고민하고 제대로 작성하자 1. 풀이 딱 보고 아 for문과 slice를 사용해서 10일단위로 끊으면서 want 제품과 할인 제품을 비교하면 될 것 같다 생각했다. 1) want 와 number을 하나의 객체로 만..

프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 나의 풀이 이 문제를 3번째 풀면서 복습하고 있다 매번 풀때마다 풀이가 바뀐다는게 신기하다. 풀이 1 function solution(progresses, speeds) { let countBox = []; let completeBox = []; for (k = 1; k < 100; k++) { let complete = []; for (i = 0; i < progresses.length; i++) { if (typeof progresses[i] == 'number') progresses[i] += speed..

프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 나의 풀이 상당히 어려웠다. 커서 왼쪽이동이 없으면 쉬운데 왼쪽이동 때문에 생각해야될 부분이 많다. 나는 두 부분으로 나누었다. 1. 알파벳을 수정하는 위 or 아래 조작의 최소값을 각 문자마다 구한다. 2. 알파벳을 수정하기위해 현재 커서 위치를 이동 해야하는데 이때 왼쪽 or 오른쪽 조작의 최단경로를 구한다. 1번 + 2번을 하면 답이나온다 . 1. name에서 각 문자별로 최소한의 조이스틱 조작 const getCharMin = () => { const first = 65; const last = 90 ..

나의 풀이 아 이거 스택문제이구나 싶어서 바로 풀었는데 처음에는 시간초과가 났다. 배열의 크기가 1,00,000이하이기 때문에 가독성 조금 더 좋은 forEach로 충분히 커버가능할 것 같았지만 결과는 시간초과 그래서 결국 아래처럼 for문으로 바꾸고 나니 통과 여기서 의문이 들었다. for과 forEach의 속도 차이가 그렇게 크지 않기 때문에 크기 1,000,000정도는 간단한코드이기에 괜찮을 것 같았는데 이런결과가 나오다니 내가 둘의 차이를 제대로 모르는 것 같았다. 그래서 아래와 같은 글을 작성했다. https://html-jc.tistory.com/648 [JS] for vs forEach 코딩테스트 문제를 풀다가 간단한 코드인데 for문으로 하면 통과인데 forEach문으로 하면 실패하는 문제..