sohyeon kim

📝 문제직사각형 형태의 그림 파일이 있고, 이 그림 파일은 1 × 1 크기의 정사각형 크기의 픽셀로 이루어져 있습니다. 이 그림 파일을 나타낸 문자열 배열 picture과 정수 k가 매개변수로 주어질 때, 이 그림 파일을 가로 세로로 k배 늘린 그림 파일을 나타내도록 문자열 배열을 return 하는 solution 함수를 작성해 주세요. 🫠 나의 풀이def solution(picture, k): result = [] for i in range(len(picture)): paint = "" for j in range(len(picture[i])): paint += picture[i][j] * k for _ in range..

📝 문제랜덤으로 서로 다른 k개의 수를 저장한 배열을 만드려고 합니다. 적절한 방법이 떠오르지 않기 때문에 일정한 범위 내에서 무작위로 수를 뽑은 후, 지금까지 나온적이 없는 수이면 배열 맨 뒤에 추가하는 방식으로 만들기로 합니다.이미 어떤 수가 무작위로 주어질지 알고 있다고 가정하고, 실제 만들어질 길이 k의 배열을 예상해봅시다.정수 배열 arr가 주어집니다. 문제에서의 무작위의 수는 arr에 저장된 순서대로 주어질 예정이라고 했을 때, 완성될 배열을 return 하는 solution 함수를 완성해 주세요.단, 완성될 배열의 길이가 k보다 작으면 나머지 값을 전부 -1로 채워서 return 합니다. 🫠 나의 풀이def solution(arr, k): answer = [] for i in ..

📝 문제문자열 my_string과 이차원 정수 배열 queries가 매개변수로 주어집니다. queries의 원소는 [s, e] 형태로, my_string의 인덱스 s부터 인덱스 e까지를 뒤집으라는 의미입니다. my_string에 queries의 명령을 순서대로 처리한 후의 문자열을 return 하는 solution 함수를 작성해 주세요. 🫠 나의 풀이def solution(my_string, queries): for s, e in queries: my_string = my_string[:s] + my_string[s:e+1][::-1] + my_string[e+1:] return my_string (계속 자르는 기만 하고.. 뒤집는 걸 생각 못하고 있었다. [::-1] 잊지 말..

📝 문제선분 세 개로 삼각형을 만들기 위해서는 다음과 같은 조건을 만족해야 합니다.가장 긴 변의 길이는 다른 두 변의 길이의 합보다 작아야 합니다.삼각형의 두 변의 길이가 담긴 배열 sides이 매개변수로 주어집니다. 나머지 한 변이 될 수 있는 정수의 개수를 return하도록 solution 함수를 완성해주세요. 🫠 나의 풀이def solution(sides): result = 0 min_num = min(sides) max_num = max(sides) for i in range(max_num - min_num + 1, max_num + 1): result += 1 for j in range(max_num + 1, min_num + max_num): ..

💡 리액트 폭죽 효과를 넣어보자! yarn add react-canvas-confetti or npm install react-canvas-confetti  🎉 전체 코드page.tsx - confetti 실행 버튼을 넣은 위치import confetti, { Options as ConfettiOptions } from 'canvas-confetti';import tailwindColors from '../../../../tailwind.config'; const handleConfetti = () => { const duration = 3000; const animationEnd = Date.now() + duration; // 지금 시간부터 5초동안 폭죽 효과 // tailwind..

💡 폰트 최적화를 해보자!  Next.js 에서 제공되는 구글 폰트를 쓰고 있었는데.. 가끔 dev 나 build 시에 터미널에 위와 같은 문구가 뜨고 로딩이 백 년이 걸릴 때가 있었다. 찾아보니.. next 버전을 바꾸꺼나.. 직접 다운로드한 폰트를 넣거나.. 많은 방법이 있었는데다운로드한 폰트로 css 에 적용을 해보려 한다!  👀 FOIT? FOUT?Flash Of Invisible Text폰트 다운로드 전까지 아무 글자도 안보임다운 완료 되면 폰트 적용된 글자 보여줌Flash Of Unstyled Text폰트 다운로드 전까지 기본 폰트 글자 보여줌다운 완료 되면 폰트 적용된 글자 보여줌 👀  font - display 속성    swap웹폰트 중요 ❌, 빠른 글자 노출 중요 ⭕️기본 폰트 보..

📝 문제머쓱이는 구슬을 친구들에게 나누어주려고 합니다. 구슬은 모두 다르게 생겼습니다. 머쓱이가 갖고 있는 구슬의 개수 balls와 친구들에게 나누어 줄 구슬 개수 share이 매개변수로 주어질 때, balls개의 구슬 중 share개의 구슬을 고르는 가능한 모든 경우의 수를 return 하는 solution 함수를 완성해주세요. 🫠 나의 풀이def solution(balls, share): answer = factorial(balls) / (factorial(balls-share) * factorial(share)) return answer def factorial(n): result = 1 for i in range(1, n + 1): result *= i ..

📝 문제2차원 좌표 평면에 변이 축과 평행한 직사각형이 있습니다. 직사각형 네 꼭짓점의 좌표 [[x1, y1], [x2, y2], [x3, y3], [x4, y4]]가 담겨있는 배열 dots가 매개변수로 주어질 때, 직사각형의 넓이를 return 하도록 solution 함수를 완성해보세요. 🫠 나의 풀이def solution(dots): list = sorted(dots) side1= abs(list[0][1] - list[1][1]) side2= abs(list[0][0] - list[2][0]) return side1 * side2 🧞‍♂️ 다른 사람의 풀이def solution(dots): return (max(dots)[0] - min(dots)[0])*(max(d..

💡 tailwind.. 조건에 따라 스타일링이 가능했다.. 문제 풀기 기능 구현 중 채점 후에 사용자의 답이 정답이라면 파란색으로, 오답이라면 빨간색으로 표시를 해줘야 했다! 그래서 같은 태그(컬러만 다르게 준)를 두 개 두고 정답/오답에 따라 보이게 해야 하나? 하다가 tailwind 조건부를 검색했더니.. 바로 나왔다 🥹 ! 사용법은 className 을 벡틱으로 감싸고 조건을 걸어주면 된다! ⭕️ 주관식 답 사용자가 입력한 답 === 정답 이라면 파란색으로! {usersAnswer?.answer} ⭕️ 객관식 답 사용자가 입력한 선택지 === 이 선택지(map 을 돌려서 선택지를 표시했기에 같은 옵션인지 id 로 구분)이고 is_answer true 값을 갖고 있다면 파란색으로! 처음엔 보더로만 구..

💡 간단한 input 입력 제한과 input 안에 입력값 길이 표시! input 의 onInput 에 함수를 부르고 이벤트와 제한할 글자수를 보내준다! { handleMaxLength(e, 30); }}/> handler 에선 value 값이 maxLength 값이 넘는다면 substr 로 잘라준다! export const handleMaxLength = (e: FormEvent, maxLength: number) => { const inputElement = e.target as HTMLInputElement; const { value } = inputElement; if (value.length > maxLength) { inputElement.value = value.substr(0, maxLeng..