230127 Codeforces Round #847 (Div. 3) Review
·
✏️ Study/⚙️ 알고리즘 & 자료구조
📍코드포스 첫 도전 후기 처음으로 도전해본 코드포스 라운드 Div.3 기업 코딩테스트와 형식이 비슷했고 7문제 중에 a,b,c 3문제를 풀었다 내가 푼 문제들은 백준 기준으로 브론즈~실버 정도 난이도였던 것 같다 문제가 영어로 되어 있어서 문제를 해석하는데 애를 먹었다 📍테스트 정보 ✅라운드 이름 : Codeforces Round #847 (Div. 3) ✅대회 시간 : 230107 23:35 ~ 230128 01:50 (2시간 30분 정도) ✅7문제 📍문제 A. Polycarp and the Day of Pi https://codeforces.com/contest/1790/problem/A Problem - A - Codeforces codeforces.com 파이를 나열한 수를 input으로 주고 얼..
Next.js 을 사용하는 이유
·
✏️ Study/🔭 Next.js
Next.js 공식문서 읽기 📍Next.js 란? 1️⃣어플리케이션을 구조화하기 위한 프레임워크를 제공 2️⃣개발 프로세스 및 어플리케이션 속도를 최적화 - Development Env. 와 Production Env. 모두에 도움 🛠️개발 환경(+DX)에 도움을 제공 - TypeScript - ESLint 통합 - Fast Refresh 등등 👨‍💻Production 환경에 도움을 제공 - 성능 최적화 - Minifying(tree shaking 과 비슷) 등등 Rust와 SWC로 작성된 컴파일러를 통해 빠르게 번들링, 컴파일 등을 실행 📍컴파일이 필요한 이유 - JSX는 브라우저가 이해할 수 없기 때문에, 브라우저가 이해할 수 있는 JavaScript 버전으로 변환되어야 함 📍Minifying - 불..
백준 1107 < 리모컨 > JavaScript
·
✏️ Study/⚙️ 알고리즘 & 자료구조
📍문제 링크 https://www.acmicpc.net/problem/1107 1107번: 리모컨 첫째 줄에 수빈이가 이동하려고 하는 채널 N (0 ≤ N ≤ 500,000)이 주어진다. 둘째 줄에는 고장난 버튼의 개수 M (0 ≤ M ≤ 10)이 주어진다. 고장난 버튼이 있는 경우에는 셋째 줄에는 고장난 버튼 www.acmicpc.net 📍알고리즘 분류 - 브루트포스 📍문제 풀이 아직 완전탐색(브루트포스) 이외의 풀이법은 못찾았다. N이 주어질 때, N이 가능한 범위를 최대한 줄여서 완전탐색을 실행하면 된다. 코너 케이스가 매우 많아서 정답률이 매우 낮다. 📍코드 (JavaScript) const [in1, in2, in3] = require("fs") .readFileSync("/dev/stdin")..
#17 변경 관련된 오류 방지를 위해 readonly 사용하기
·
✏️ Study/🧽 JS & TS
이펙티브 타입스크립트 (댄 밴더캄 지음) 를 읽고 정리 📍요약 ✅readonly를 사용하면 의도치 않은 변경으로 인한 에러를 방지하고, 런타임 이전에 확인할 수 있다 ✅readonly와 const는 차이가 있다 ✅readonly는 shallow하게 동작한다 📍readonly 타입으로 문제 해결하기 1 0 0 + 1 0 + 1 + 2 ... 같은 삼각수를 출력하는 함수를 만들었는데, 코드가 의도한 대로 동작하지 않는다 // 배열의 합을 계산하는 헬퍼 함수 function arraySum(arr: number[]) { let sum = 0, num; while ((num = arr.pop()) !== undefined) { // 여기서 pop 메서드가 실행되어 원본 배열이 수정됨 sum += num; } r..
[CSS Battle - 8] 1-8. Forking Crazy
·
✏️ Study/🖼️ HTML & CSS
📍타겟 이미지 📍문제 풀이 - 포크의 날카로운 부분은 7개의 div로 구현하여 홀수 번째 부분은 윗부분에 border-radius를 주고 짝수 번째 부분은 아랫부분에 border-radius를 준다 - 그런데 간단할 줄 알았는데 까다로운 부분이 생긴다 container 부분의 컬러에 따라, 이렇게 모서리를 깎아내도 적용되지 않는 문제가 생긴다 - 이를 해결하기 위해 홀수번째 날카로운 부분에만 div를 하나 더 생성해줘야 한다 (배경 layer 추가하여 배경색을 바꿔줘야 함) 📍코드 📍결과 100% match
[Python] sys.stdin.readline() 으로 빠르게 입력받기
·
✏️ Study/🐍 Python
📍사용 이유여러 줄의 입력을 받을 때에는 input() 대신 sys.stdin.readline() 을 사용하는 것이 빠르다 📍사용 예시 (백준 1371 가장 많은 글자)https://www.acmicpc.net/problem/1371 1371번: 가장 많은 글자첫째 줄부터 글의 문장이 주어진다. 글은 최대 50개의 줄로 이루어져 있고, 각 줄은 최대 50개의 글자로 이루어져 있다. 각 줄에는 공백과 알파벳 소문자만 있다. 문장에 알파벳은 적어도 하나 이www.acmicpc.net 여러 줄의 입력을 받는 경우, 문장 뒤에 개행 문자 (\n)가 있기때문에, rstrip() 으로 제거해줘야 한다import sys# 50줄의 입력을 받아 리스트에 저장data = [sys.stdin.readline().rst..
#16 number 인덱스 시그니처 보다는 Array, 튜플, ArrayLike를 사용하기
·
✏️ Study/🧽 JS & TS
이펙티브 타입스크립트 (댄 밴더캄 지음) 를 읽고 정리 📍요약 ✅배열은 객체이므로 키(배열에서는 인덱스)는 숫자가 아닌 문자열이다 ✅인덱스 시그니처로 사용되는 number 타입은 버그를 잡기 위한 타입스크립트 코드이다 ✅인덱스 시그니처에 number를 사용하기보다 Array나 튜플, ArrayLike 타입을 사용하는 것이 좋다 📍number 인덱스 시그니처 - Array 타입 선언의 일부 interface Array { // ... [n: number]: T; // 숫자 키가 허용됨 } 📍타입스크립트는 숫자 키를 허용 자바스크립트에서는 키값으로 문자열과 심벌만 가능하다. 따라서 이외의 값이 오면 자동으로 toString 메서드가 호출되어 문자열로 변환된다. ⭐반면 타입스크립트는 숫자 키를 허용하며 문자열..
#15 동적 데이터에 인덱스 시그니처 사용하기
·
✏️ Study/🧽 JS & TS
이펙티브 타입스크립트 (댄 밴더캄 지음) 를 읽고 정리 📍요약 ✅런타임 때까지 객체의 속성을 알 수 없을 때에만 인덱스 시그니처를 사용 (안전한 접근을 위해 undefined를 유니온 타입으로 추가 고려 ✅가능한 인터페이스, Record 타입, 매핑된 타입 처럼 정확한 타입을 사용하는 것이 좋다 📍인덱스 시그니처는 부정확하다 // 인덱스 시그니처 type Rocket = {[property: string]: string}; const rocket: Rocket = { namme: 'Falcon 9', variant: 'v1.0', thrust: '4,940 kN', }; // OK const temp: Rocket = {}; // OK 1️⃣오타를 바로잡아주지 못함 2️⃣빈 객체도 허용 3️⃣키 마다 다..