본문 바로가기

분류 전체보기105

[Programmers] Lv.2 _ [PCCP 기출문제] 2번 / 퍼즐 게임 챌린지 https://school.programmers.co.kr/learn/courses/30/lessons/340212풀이퍼즐 난이도: diffs소요 시간: times제한 시간: limit숙련도: level 퍼즐 난이도가 숙련도보다 낮거나 같으면 (diffs[i] 해당 퍼즐의 소요 시간 (times[i]) 만큼만 소요. 퍼즐 난이도가 숙련도보다 높으면 (diffs[i] > level)해당 퍼즐의 이전 소요 시간 + 현재 소요 시간 을 난이도 - 숙련도 만큼 수행 후 현재 소요 시간 추가 소요. 퍼즐의 모든 소요 시간의 합이 limit보다 작은 숙련도 최솟값 구하기. 퍼즐의 숙련도는 최소: 1, 최대: max(diffs) 로 범위가 정해져있으며,수행 가능한 숙련도의 경계값을 찾는 문제이기 때문에 이분탐색 문제.. 2025. 1. 5.
[Refactor] 번들링 최적화 Introduction여러가지 리팩토링 기법이 있지만 가장 먼저 번들링 최적화 를 통한 리팩토링을 하려합니다.다른 리팩토링들은 이후에 다뤄볼 예정입니다. 먼저 번들의 기본인 모듈이 무엇인지, 번들링 최적화가 왜 필요하고, 어떤 방식이 있는지 알아보겠습니다.모듈이란?번들의 개념을 알아보기 전에 번들의 기본이 되는 모듈에 대해서 알아보려 합니다. 모듈 은 특정 기능을 수행하는 코드 묶음으로 다른 코드와 독립적으로 재사용 및 관리할 수 있는 단위를 의미합니다. 즉, 우리가 개발할 때 보는 파일 하나하나의 단위가 모듈이라고 할 수 있겠습니다. 모듈 개념이 등장하기 전에는 하나의 파일에 모든 코드가 포함되어 네이밍 충돌, 가독성 저하, 의존성 관리 어려움, 재사용성 부족 등의 문제가 있었습니다.이러한 문제를 해결.. 2024. 7. 27.
[HTML & CSS] CSS Grid minmax로 내부 요소 비율 유지하기 (feat. text 말줄임표 처리) 문제 발생 CSS Grid를 사용한 반응형 페이지에서 내부 요소의 width가 길어지면 grid의 비율이 깨지는 현상이 발생했습니다..lectureCardWrapper { display: grid; gap: var(--margin-size-lg); grid-template-columns: 1fr 1fr 1fr; grid-template-rows: auto auto;}@media screen and (max-width: 880px) { .lectureCardWrapper { grid-template-columns: 1fr 1fr; grid-template-rows: auto auto auto; }}@media screen and (max-width: 530px) { .lectur.. 2024. 6. 23.
[JavaScript] 웹팩 웹팩이란?자바스크립트 애플리케이션의 모듈 번들을 위해 사용되는 오픈 소스 모듈 번들러 모듈모듈은 자바스크립트 애플리케이션을 구성하는 개별 단위 파일종류에는 자바스크립트 모듈, CSS 모듈, 이미지 파일 / 폰트 파일, 라이브러리 모듈 등이 있습니다. 모듈의 장점유지보수성네임스페이스화재사용성 모듈 시스템자바스크립트의 모듈들을 독립적으로 분리하고 의존성을 정의하는 시스템을 말합니다.종류CommonJS주로 Node.js 환경에서 사용다른 모듈을 사용할때 require을, 모듈을 해당 스코프 밖으로 보낼 때에는 module.exports를 사용// math.jsmodule.exports.add = function(a, b) { return a + b;};// app.jsconst math = require.. 2024. 6. 15.
[React] 합성 컴포넌트 패턴으로 모달 만들기 Introduction 토이 프로젝트 중 위와 같은 다양한 형태의 모달을 제작해야 할 상황이 생겼고, 예전부터 사용해보고 싶었던 합성 컴포넌트 패턴으로 모달을 제작해보기로 했습니다. 합성 컴포넌트 패턴(Compound Component Pattern) 이란?합성 컴포넌트 패턴은 여러 작은 컴포넌트들을 조합하여 하나의 컴포넌트를 만드는 React 디자인 패턴입니다.이 패턴을 사용하여 컴포넌트를 구현한다면 높은 재사용성을 갖습니다.또한 한 컴포넌트에 무지막지한 양의 props가 주입되는 대신 상위 컴포넌트에서 각 컴포넌트에 필요한 props만 주입할 수 있기 때문에 관심사 / 책임 분리, props drilling 방지 등의 장점을 갖습니다. 예시로는 아코디언 컴포넌트가 있습니다. 아코디언 컴포넌트는 제목,.. 2024. 6. 12.
[Programmers] Lv.1 _ 가장 많이 받은 선물 조건기록을 비교하여1. 기록이 존재할 경우 => 더 많이 준 사람의 선물 개수 +12. 기록이 존재하지 않는 경우 or 주고 받은 선물의 개수가 같은 경우 => 선물 지수가 더 큰 사람의 선물 개수 +13. 선물 지수까지 동일한 경우 => 선물을 주고 받지 않음 풀이입출력 예시에 친절하게 표가 나와있어 쉬운 문제긴 했다.먼저 주고 받은 선물 2차원 표, 선물 지수 1차원 리스트를 선언한다.선물 기록 리스트인 gifts를 돌며 준 사람, 받은 사람의 idx를 찾아 1) 준 사람은 선물 지수 + 12) 받은 사람은 선물 지수 - 13) 선물 2차원 표에 기록 ([준 사람 인덱스][받은 사람 인덱스])를 기록한다. 이후 2차원 표를 이중 for문으로 돌며 조건에 맞는 경우를 따져 최댓값을 찾는다. def so.. 2024. 6. 11.

티스토리툴바