본문 바로가기

Til226

[TIL] 2023.07.03 Programmers_배열의 원소만큼 추가하기 배열의 원소만큼 추가하기 문제 설명 아무 원소도 들어있지 않은 빈 배열 X가 있습니다. 양의 정수 배열 arr가 매개변수로 주어질 때, arr의 앞에서부터 차례대로 원소를 보면서 원소가 a라면 X의 맨 뒤에 a를 a번 추가하는 일을 반복한 뒤의 배열 X를 return 하는 solution 함수를 작성해 주세요. 입출력 예 arr result [5, 1, 4] [5, 5, 5, 5, 5, 1, 4, 4, 4, 4] [6, 6] [6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6] [1] [1] 나의 풀이 function solution(arr) { let answer = []; for (const num of arr) { answer = [...answer, ...Array(num).fill(.. 2023. 7. 4.
[TIL] 2023.07.01 Next.js_router.push와 router.replace의 차이점 useRouter import { useRouter } from 'next/navigation'; Next.js 13부터는 `useRouter`를 'next/router'가 아닌 'next/navigation'에서 import 해서 사용해야 한다! 만약 `useRouter`를 'next/router'에서 import하면 이미지와 같은 에러가 발생한다. 잠시 router 관련 Next.js 13에서 달라진 점을 살펴보자. Migrating from the pages directory: The new useRouter hook should be imported from `next/navigation` and not `next/router` The pathname string has been removed a.. 2023. 7. 1.
[TIL] 2023.06.30 Programmers_간단한 식 계산하기 간단한 식 계산하기 문제 설명 문자열 binomial이 매개변수로 주어집니다. binomial은 "a op b" 형태의 이항식이고 a와 b는 음이 아닌 정수, op는 '+', '-', '*' 중 하나입니다. 주어진 식을 계산한 정수를 return 하는 solution 함수를 작성해 주세요. 입출력 예 binomial result "43 + 12" 55 "0 - 7777" -7777 "40000 * 40000" 1600000000 입출력 예 #1 예제 1번의 binomial은 "43 + 12"로 이 식을 계산한 결과인 43 + 12 = 55를 return 합니다. 입출력 예 #2 예제 2번의 binomial은 "0 - 7777"로 이 식을 계산한 결과인 0 - 7777 = -7777을 return 합니다... 2023. 6. 30.
[TIL] 2023.06.27 'StaticImageData' 형식은 'string' 형식에 할당할 수 없습니다 '{ img: StaticImageData; category: string; title: string; }' 형식은 'CardType' 형식에 할당할 수 없습니다. 'img' 속성의 형식이 호환되지 않습니다. 'StaticImageData' 형식은 'string' 형식에 할당할 수 없습니다.ts(2322) import 한 jpg 파일의 타입을 지정하는 과정에서 상단의 error가 발생했다. type CardType = { img: string; category: string; title: string; }; type CardProps = { CardInfo: CardType; }; 전달받은 props의 `type` 구조는 다음과 같다. CardType의 `img: string`에서 error가 발생한 것.. 2023. 6. 27.
[TIL] 2023.06.22 Programmers_A 강조하기 A 강조하기 문제 설명 문자열 myString이 주어집니다. myString에서 알파벳 "a"가 등장하면 전부 "A"로 변환하고, "A"가 아닌 모든 대문자 알파벳은 소문자 알파벳으로 변환하여 return 하는 solution 함수를 완성하세요. 입출력 예 myString result "abstract algebra" "AbstrAct AlgebrA" "PrOgRaMmErS" "progrAmmers" 입출력 예 #1 0번, 5번, 9번, 15번 인덱스의 "a"는 소문자이므로 전부 대문자로 고쳐줍니다. 다른 문자들은 전부 "a"가 아닌 소문자이므로 바꾸지 않습니다. 따라서 "AbstrAct AlgebrA"를 return 합니다. 입출력 예 #2 0번, 2번, 4번, 6번, 8번, 10번 인덱스의 문자들은 .. 2023. 6. 22.
[TIL] 2023.06.13 Programmers_수열과 구간 쿼리 1 수열과 구간 쿼리 1 문제 설명 정수 배열 arr와 2차원 정수 배열 queries이 주어집니다. queries의 원소는 각각 하나의 query를 나타내며, [s, e] 꼴입니다. 각 query마다 순서대로 s ≤ i ≤ e인 모든 i에 대해 arr[i]에 1을 더합니다. 위 규칙에 따라 queries를 처리한 이후의 arr를 return 하는 solution 함수를 완성해 주세요. 입출력 예 arr queries result [0, 1, 2, 3, 4] [[0, 1],[1, 2],[2, 3]] [1, 3, 4, 4, 4] 입출력 예 #1 각 쿼리에 따라 arr가 다음과 같이 변합니다. i queries[i] arr - - [0, 1, 2, 3, 4] 0 [0,1] [1, 2, 2, 3, 4] 1 [1,.. 2023. 6. 13.
[TIL] 2023.06.10 Programmers_왼쪽 오른쪽 왼쪽 오른쪽 문제 설명 문자열 리스트 str_list에는 "u", "d", "l", "r" 네 개의 문자열이 여러 개 저장되어 있습니다. str_list에서 "l"과 "r" 중 먼저 나오는 문자열이 "l"이라면 해당 문자열을 기준으로 왼쪽에 있는 문자열들을 순서대로 담은 리스트를, 먼저 나오는 문자열이 "r"이라면 해당 문자열을 기준으로 오른쪽에 있는 문자열들을 순서대로 담은 리스트를 return 하도록 solution 함수를 완성해 주세요. "l"이나 "r"이 없다면 빈 리스트를 return 합니다. 입출력 예 str_list result ["u", "u", "l", "r"] ["u", "u"] ["l"] [] 입출력 예 #1 "r"보다 "l"이 먼저 나왔기 때문에 "l"의 왼쪽에 있는 문자열들을 담은.. 2023. 6. 10.
[TIL] 2023.06.07 word-break로 문자열 줄바꿈하기 table body에 띄어쓰기 없이 영어로 텍스트를 입력했을 때 줄 바꿈이 되지 않고 테이블 레이아웃이 깨지면서 가로 스크롤이 생기는 문제가 발생했다. 테스트 삼아 일반적인 영어 텍스트를 작성했을 때는 아무 문제없는 것을 알아냈다. 그래서 띄어쓰기 없이 작성한 것이 문제인가 싶어서 관련 키워드로 검색을 해봤다. word-break: break-all; 이것저것 검색해 보다가 알게된 것이 css word-wrap 속성. word-wrap: break-all을 적용했더니 내가 원하는 대로 띄어쓰기 없이 글을 작성했을 때에도 줄 바꿈이 잘 되는 것을 확인할 수 있다. +) 근데 `word-break: break-all` 속성을 지정했더니 단어가 깨지면서 개행되는 문제가 있었다. 나는 테스트 용으로 띄어쓰기 없.. 2023. 6. 7.
[TIL] 2023.06.06 Programmers_순서 바꾸기 순서 바꾸기 문제 설명 정수 리스트 num_list와 정수 n이 주어질 때, num_list를 n 번째 원소 이후의 원소들과 n 번째까지의 원소들로 나눠 n 번째 원소 이후의 원소들을 n 번째까지의 원소들 앞에 붙인 리스트를 return하도록 solution 함수를 완성해주세요. 입출력 예 num_list n result [2, 1, 6] 1 [1, 6, 2] [5, 2, 1, 7, 5] 3 [7, 5, 5, 2, 1] 입출력 예 #1 [2, 1, 6]에서 첫 번째 이후의 원소는 [1, 6]이고 첫 번째까지의 원소는 [2]입니다. 두 리스트를 이어 붙이면 [1, 6, 2]가 됩니다. 입출력 예 #2 [5, 2, 1, 7, 5]에서 세 번째 이후의 원소는 [7, 5]이고 세 번째까지의 원소는 [5, 2, .. 2023. 6. 6.
[Recoil] 새로고침해도 유지되는 state_Recoil Persist 결제 기능을 구현하는 과정에서 결제창이 넘어가며 state가 초기화되어 결제 승인 페이지에 도착하기 전에 사용자가 입력한 예약 정보가 모두 날아가는 문제가 발생했다. 그래서 사용자가 입력한 예약 정보를 임시로 저장하기 위해 Recoil Persist 기능을 이용하여 구현했다. Recoil Persist란? Recoil과 함께 사용할 수 있는 별도의 라이브러리로, Recoil로 생성한 global state를 localStorage 혹은 sessionStorage에 저장하여 새로고침해도 state가 유지되도록 사용할 수 있다. 기존 Recoil 사용 방법과 동일하게 useRecoilState 등의 훅을 이용하여 쉽게 Storage에 상태를 저장할 수 있다. Recoil Persist 사용 방법 npm in.. 2023. 6. 6.