D.JOUNG

고정폭 글꼴이란?고정폭 글꼴이란 말 그대로 글자의 가로 길이가 일정한 글꼴을 뜻한다. 모노스페이스(mono-space) 글꼴이라고도 부른다. 구글 폰트(Google Fonts)에서 필터링으로 모노 스페이스 글꼴만 검색할 수도 있다. 필터 기능의 Classification 항목을 들여다보면 'Monospace' 버튼이 바로 보일 것이다. 고정폭 글꼴은 결과값을 콘솔에서 출력하는 프로그램을 실행시킬 때 출력 결과의 가독성을 높이는데 많은 도움을 준다. ansi-code와 고정폭 글꼴을 함께 사용하면 눈이 아주 편안한 포멧팅이 가능할 것이다. VS Code 에서 터미널 글꼴 설정그럼 이제 개발자들이 많이들 사용하는 VS Code IDE에서 고정폭 글꼴을 적용해보자. VS Code를 실행한 후 아래 경로로 들어..

작년 말 쯤 자격증을 따둬야겠다는 생각이 들었을 때 쯤 공부를 시작했다. 취업을 준비중인 입장이기에 공부할 시간은 널널한 편이었지만, 몇년 전 공부해보려다가 작심삼일 났던 적이 있어 이떻게하면 그 꼴을 피할 수 있을지부터 고민했던 것 같다.   1. 필기 시험 준비 시험을 위한 공부를 한 적이 까마득한 옛날이었기에 '공부하는 법' 조차 가물가물했던 상황. 일단 정석대로 교재부터 골라보기로 했다.  인터넷에 검색해보니 당시 많은 추천을 받던 교재는 주로 수제비의 문제집들이었다. 하지만 이론서를 구입해 정독하기에는 너무 시간이 오래 걸릴 것 같았고, 다시한번 작심삼일의 길을 갈 것이 뻔해보였다. 그러던 중 내 눈에 들어온 책이 이기적 출판사의 '정보처리기사 필기 핵심이론+문제집' 책이었다.  사실상 내 필기..

동적 타입 언어와 정적 타입 언어의 차이는 다른 코딩 일기 포스팅에서 몇 번 언급한 적이 있다. 하지만 이 둘의 차이를 좀 더 구체적으로 알고싶어 챗지피티의 힘을 빌렸다. 정적 타입 언어인지 동적 타입 언어인지는  변수의 타입이 어느 시점에 결정되느냐에 따라 결정된다. 컴파일 타임(파일 수준)에 결정되면 정적 타입 언어, 런타임(앱 실행)에 결정되면 동적 타입 언어이다.  애초에 프로그래밍에서 정적, 동적 이라는 단어를 사용했을 때의 의미는 대부분 위의 의미와 일맥상통한다.  정적 타입 언어 (Statically Typed Languages) 는 앱 실행 전 모든 변수의 타입이 미리 설정되고, 컴파일러가 타입 체크를 수행해 오류를 미리 잡아낼 수 있어 매우 안정적이다. 하지만 동적 타입 언어에 비해 유연..

즉시 실행 함수란 함수를 정의하고 바로 실행하는 패턴이다. 익명함수를 정의한 후 바로 실행된다. 구조는 다음과 같다. (function (BoardStatus) { ... })(...); (function (BoardStatus) { ... }) 부분에 함수가 정의되고, (...) 부분에서 실행된다. 익명함수이기 때문에 해당 함수는 다시 재활용할 수 없다. 타입스크립트에서는 자료형(타입)을 지정하는 방식으로 enum 자료형을 지원하고 있다.  enum 자료형은 타입 스크립트가 자바 스크립트로 컴파일 될 때 즉시 실행함수 형태로 변환된다. //타입스크립트 표현식export enum BoardStatus { PUBLIC = 'PUBLIC', PRIVATE = 'PRIVATE',}//javascript 컴..

자바스크립트와 파이썬은 C++나 JAVA와 달리 변수 타입이 동적으로 설정된다. 변수 타입이 런타임에서 결정된다는 뜻이다. 때문에 파일 수준이나 멤버 수준에서 정적으로 타입을 지정하는 C++나 JAVA와 달리 함수에서 동적으로 클래스의 멤버를 수정하거나 추가하는게 가능하다. 예를 들면 다음의 예시다.  #동적으로 클래스의 멤버 변수를 추가하는 경우class MyClass: passobj = MyClass()obj.new_attr = "New Attribute"print(obj.new_attr) # 출력: New Attribute#클래스를 함수 안에서 정의하는 경우def create_class(): class InnerClass: def __init__(self, value): ..

html 구조가 복잡해지다보면 marin 영역끼리 겹치는 마진 상쇄 현상과 심심찮게 마주한다. 마진 상쇄가 발생하는 경우는 대략 다음과 같다.1. 형제 노드끼리 맞닿는 영역에 각자 마진영역이 설정되어있을 경우 (더 넓은 쪽이 작은 쪽을 상쇄한다.)2. 부모 요소의 상단 마진 과 자식 요소의 상단 마진이 맞닿았을 경우 (부모 요소의 마진만 적용되고, 자식 요소의 마진은 상쇄된다.) - 개인적으로 가장 짜증난다. chat-gpt한테 물어보면 몇가지 경우 더 있지만, 난 주로 위 두 가지 경우를 많이 마주쳤다. 짜증나긴 하지만 오류는 아니라고 하고, 브라우저가 레이아웃을 더 깔끔하게 관리하기 위한 규칙이라는 모양이다. 마진 상쇄는 블록 요소에서만 발생하기 때문에, 요소를 인라인 속성(inline, inline..

Next(React)에서는 HTML img 태그 대신 Image라는 자체 태그를 따로 제공하고 있다. Image 태그는 서버에서 이미지를 미리 받아와 화면에 더 빠르고 최적화된 방식으로 이미지를 표시할 수 있게 해준다.  보통 컨테이너(div) 크기에 맞게 반응형으로 이미지를 조절하고 싶을 때는 이미지를 div 백그라운드 속성으로 지정하거나 div 태그를 중복해서 작성한 다음 안쪽 div에 absolute 속성을 먹여 적용한다.  하지만 Image 태그를 사용하면 위와 같은 복잡한 방식 필요 없이 간단하게 부모 크기에 이미지를 맞출 수 있다. 일반적으로 구글링을 검색했을 때 나오는 방법은 다음과 같다.  layout 속성에 fill 값을 주어 이미지를 컨테이너에 꽉 채우고, objectFit 속성에 co..

해당 에러는 주로 map 함수를 이용해 반복적인 컴포넌트를 생성했을 때 발생한다. 편집기에서 빨간줄 긋고 안내해주는 대로 반복되는 컴포넌트에 key 속성을 추가해주면 문제없이 작동한다. 하지만 key 속성을 제대로 추가해줬는데도 자꾸 경고문이 발생해서 잠깐 골치가 아팠다.  경고문 발생 이유는 단순했다. 컴포넌트를 안에 넣고 까지 포함하여 반복 생성했던 것...컴파일러가 까지 자식 컴포넌트로 인식해 key 프롭스가 없다는 경고문을 자꾸 뱉었던 것이었다.

문제 : https://www.acmicpc.net/problem/2573 시간 제한메모리 제한난이도알고리즘 분류1초256 MBGold 4BFS  문제  풀이 보자마자 bfs를 사용해야겠다고 생각하게되는 나름 직관적인 문제다. 하지만 풀이법이 대강 생각나도, 실제 구현하는 부분에서 자잘한 오류가 발생하는 등 어려움이 있었다. 막막함을 조금이라도 줄여보고자 문제 풀이를 글로 작성하는 것 부터 시작했다.  1. 1년 후의 빙산 상태를 계산하여 저장한다.2. 1년 후 빙산들이 두 조각 이상으로 분리되었는 지, 완전히 녹아 없어졌는 지, 아직 한 덩이인 상태인 지 체크한다.3-1. 완전히 녹아 없어졌거나 두 조각 이상으로 분리되었다면 반복문을 탈출한다.3-2. 아직 한 덩이인 상태라면 1-3번을 다시 실행한다...

문제 : https://www.acmicpc.net/problem/12852 시간 제한메모리 제한난이도알고리즘 분류0.5초512 MBSilver 1다이나믹 프로그래밍  문제  풀이0.5초의 시간제한이 있는 문제다. N의 범위는 1부터 10의 6승까지이므로 반복문 중첩을 피할 수 있는 방법으로 풀이를 생각해봐야 한다. 특정 숫자 N이 주워졌을 때 최단 횟수로 1로 만들어지는 과정을 직접 샤프로 써가며 정리해본다. N = 1010 → 9 → 3 → 1 N = 99 → 3 → 1  N = 88 → 4 → 2 → 1 N = 77 → 6 → 3 → 1 (이하 생략..) 숫자 네 개를 정리했을 뿐인데도 벌써 규칙이 보인다. 예를 들어 10의 경우, N이 9인 경우에서 맨 앞에 10이 붙었을 뿐이다. 이처럼 각 숫자..