hr0513 님의 블로그

문제 설명 당신은 폰켓몬을 잡기 위한 오랜 여행 끝에, 홍 박사님의 연구실에 도착했습니다. 홍 박사님은 당신에게 자신의 연구실에 있는 총 N 마리의 폰켓몬 중에서 N/2마리를 가져가도 좋다고 했습니다. 홍 박사님 연구실의 폰켓몬은 종류에 따라 번호를 붙여 구분합니다. 따라서 같은 종류의 폰켓몬은 같은 번호를 가지고 있습니다. 예를 들어 연구실에 총 4마리의 폰켓몬이 있고, 각 폰켓몬의 종류 번호가 [3번, 1번, 2번, 3번]이라면 이는 3번 폰켓몬 두 마리, 1번 폰켓몬 한 마리, 2번 폰켓몬 한 마리가 있음을 나타냅니다. 이때, 4마리의 폰켓몬 중 2마리를 고르는 방법은 다음과 같이 6가지가 있습니다. 첫 번째(3번), 두 번째(1번) 폰켓몬을 선택 첫 번째(3번), 세 번째(2번) 폰켓몬을 선택 첫..

안녕하세요, hr0513입니다! 🥰 오늘은 html2canvas와 jsPDF 라이브러리를 사용하여HTML 콘텐츠를 PDF 변환하는 방법에 대해 소개해 드릴게요! ✨1. 패키지 설치html2canvas와 jsPDF 패키지를 설치해 주세요.npm install html2canvas jspdf2. HTML 콘텐츠 캡처하기html2canvas를 사용하면 특정 HTML 요소를 캡처해서 이미지로 변환할 수 있어요.이렇게 만들어진 이미지를 jsPDF로 PDF로 변환하고 저장하는 코드예요!"use client";import React from "react";import html2canvas from "html2canvas";import jsPDF from "jspdf";const Page = () => { cons..

문제 설명 수많은 마라톤 선수들이 마라톤에 참여하였습니다. 단 한 명의 선수를 제외하고는 모든 선수가 마라톤을 완주하였습니다. 마라톤에 참여한 선수들의 이름이 담긴 배열 participant와 완주한 선수들의 이름이 담긴 배열 completion이 주어질 때, 완주하지 못한 선수의 이름을 return 하도록 solution 함수를 작성해주세요. 제한사항 마라톤 경기에 참여한 선수의 수는 1명 이상 100,000명 이하입니다. completion의 길이는 participant의 길이보다 1 작습니다. 참가자의 이름은 1개 이상 20개 이하의 알파벳 소문자로 이루어져 있습니다. 참가자 중에는 동명이인이 있을 수 있습니다.입출력 예participantcompletionreturn["leo", "kiki", "..

안녕하세요, hr0513입니다! 🥰 React에서 IntersectionObserver를 사용하여 요소가 화면에 보일 때 애니메이션을 실행하는 두 가지 방법을 소개하려고 합니다. IntersectionObserver는 특정 요소가 viewport 내에 들어왔을 때,또는 화면에서 벗어날 때 이를 감지하여 애니메이션 효과 작업을 수행할 때 사용할 수 있어요.1. 애니메이션을 한 번만 실행하는 코드import React, { useEffect, useRef, useState } from 'react';import styles from '../styles/ProjectCard.module.scss';const ProjectCard = ({ title }) => { const [isVisible, setIsV..

안녕하세요, hr0513입니다! 🥰 오늘은 Next.js 프로젝트를 설치하고, Github에 배포하는 방법에 대해 포스팅해보려고 해요.간단하게 따라 하실 수 있도록 하나하나 정리해 볼게요!1. 프로젝트 폴더 생성바탕화면에 프로젝트용 폴더를 만듭니다.2. 리액트 앱 생성Next.js 프로젝트를 생성합니다.npx create-next-app ./3. Github Pages 준비하기 3-1. gh-pages 패키지 설치배포를 위해 Github Pages용 패키지를 설치해 줍니다.yarn add -D gh-pages# ornpm i --save-dev gh-pages 3-2. package.json 수정프로젝트를 Github Pages에 배포하려면 package.json 파일에 다음과 같은 설정을 추가해줘야 ..

안녕하세요! 😊 hr0513입니다. VS Code에서 사용하면 유용한 단축키와 플러그인을 소개해드리려고 해요!코딩 작업을 더 빠르고 효율적으로 만들어 줄 꿀팁들이니, 한 번씩 활용해 보세요.1. 자주 사용하는 VS Code 단축키 탭 이동하기WindowsMacCtrl + TabCmd + Tab 열려 있는 탭 간에 빠르게 이동할 수 있어요. 파일을 여러 개 열어 놓고 작업할 때 시간을 절약할 수 있습니다. 현재 라인 복사WindowsMacShift + Alt + ↓Shift + Option + ↓ 현재 라인을 복사해서 아래에 바로 붙여 넣습니다. 같은 코드를 반복해서 쓸 때 유용해요. 코드 포맷팅WindowsMacShift + Alt + FShift + Option + F 코드 스타일을 일관성 있게 유지..

안녕하세요! hr0513입니다. 😊 혹시 블로그에 글 올릴 때 화면을 녹화해서 GIF로 변환하고 싶었던 적 있으신가요?저도 최근 블로그 포스팅 준비하다가 간단하게 화면을 녹화해서 GIF로 만들 수 있는 방법을 찾았는데요,바로바로 ScreenToGif라는 프로그램을 알게 됐어요! ✨ 이 프로그램은 화면, 웹캠, 그림판 등을 녹화하고,GIF나 비디오 파일로 저장할 수 있는 무료 프로그램이에요~!ScreenToGif 다운로드 방법 https://www.screentogif.com/ ScreenToGif - Record your screen, edit and save as a gif or videoFree screen recorder tool. Record, edit and save as a gif or vi..

문제 설명 길이가 같은 두 1차원 정수 배열 a, b가 매개변수로 주어집니다. a와 b의 내적을 return 하도록 solution 함수를 완성해주세요. 이때, a와 b의 내적은 a[0]*b[0] + a[1]*b[1] + ... + a[n-1]*b[n-1] 입니다. (n은 a, b의 길이) 제한사항 a, b의 길이는 1 이상 1,000 이하입니다. a, b의 모든 수는 -1,000 이상 1,000 이하입니다.입출력 예abresult[1,2,3,4][-3,-1,0,2]3[-1,0,1][1,0,-1]-2 solution.jsfunction solution(a, b) { return a.reduce((acc, _, i) => acc + a[i] * b[i], 0);}