flex display: flex; flex 설정 시, 컨테이너 내의 요소들을 가로나 세로 방향으로 유연하게 배치합니다. inline-flex 설정 시, inline 레벨의 flexBox 생성 flex-container의 옵션 flex-direction : 배치 방향 row, row-rever...
display 속성
display 속성 CSS의 display 속성은 요소가 어떻게 보여질지, 요소의 레이아웃 박스 유형을 지정합니다. none display: none; none 설정 시, 요소가 화면에서 보이지 않습니다. visibility: hidden; 과 다른 점은 요소가 차지하는 공간도 같이 사라집니다. block display: b...
UI 디자인 패턴
Modal Modal은 기존에 화면 위에 오버레이 되는 창을 말합니다. 팝업 창과는 다른 개념으로 팝업은 브라우저에 의해 강제로 막힐 수 있으므로, 꼭 보여줄 내용은 Modal을 사용하는 것이 좋습니다. 닫기 버튼을 따로 두거나 Modal의 범위 밖을 클릭하면 닫히는 식으로 구현합니다. TIP 토글의 상태를 직관적 토글 Togg...
파싱이란?
파싱에 대해 알아보자. 파싱 (Parsing) 문서 파싱은 브라우저가 코드를 이해하기 쉽고, 사용하기 쉬운 구조로 변환하는 것을 말합니다. 파싱 결과는 보통 문서 구조를 나타내는 노드 트리입니다. (파싱 트리, 문법 트리) 예를 들면, 2 + 3 - 1 을 파싱해보면 다음과 같은 노드 트리가 됩니다. 어휘 분석, 구분 분석 파싱은...
객체의 프로퍼티 접근
object.key, object[‘key’], object[key] 차이점을 알아보자. object[key] 는 변수로 접근하지만, object[‘key’]와 object.key는 객체의 프로퍼티에 접근합니다. let num = { one: 1, two: 2, }; let one = "two"; console.log(num.one)...
CS 정리 - 01
백엔드 면접 질문 대비 Javascript Javasciprt란? 타입을 명시할 필요없는 동적 타입 언어로 프로토타입 기반의 객체 지향 프로그래밍 언어입니다. 기본적으로 웹 브라우저에서 해석되는 인터프리터 언어이지만 Node.js를 사용하여 서버 프로그래밍도 가능합니다. 타입을 명시할 필요없는 동적 타입...
프로그래머스 SQL 문제 - 07
흉부외과 또는 일반외과 의사 목록 출력하기 문제 링크 DOCTOR 테이블에서 진료과가 흉부외과(CS)이거나 일반외과(GS)인 의사의 이름, 의사ID, 진료과, 고용일자를 조회하는 SQL문을 작성해주세요. 이때 결과는 고용일자를 기준으로 내림차순 정렬하고, 고용일자가 같다면 이름을 기준으로 오름차순 정렬해주세요. SELECT DR_NAME, ...
백준 - 10
2225번 - 합분해 0부터 N까지의 정수 K개를 더해서 그 합이 N이 되는 경우의 수를 구하는 프로그램을 작성하시오. 덧셈의 순서가 바뀐 경우는 다른 경우로 센다(1+2와 2+1은 서로 다른 경우). 또한 한 개의 수를 여러 번 쓸 수도 있다. 풀이 2차원배열을 생각 못해서 점화식을 찾는데 오래 걸렸습니다. N, K를 2차원 배열로 ...
백준 - 09
10844번 - 쉬운 계단 수 45656이란 수를 보자. 이 수는 인접한 모든 자리의 차이가 1이다. 이런 수를 계단 수라고 한다. N이 주어질 때, 길이가 N인 계단 수가 총 몇 개 있는지 구해보자. 0으로 시작하는 수는 계단수가 아니다. 풀이 배열로 자리수를 구별해서 저장하면 쉽게 해결할 수 있습니다. 0은 1만 가능하며 9는 9...
백준 - 08
11726번 - 2 X n 타일링 2×n 크기의 직사각형을 1×2, 2×1 타일로 채우는 방법의 수를 구하는 프로그램을 작성하시오. 아래 그림은 2×5 크기의 직사각형을 채운 한 가지 방법의 예이다. 풀이 for문을 이용해서 Bottom-Up 방식으로 풀어보겠습니다. N이 주어졌을 때 채우는 방법은 N-1에서 세로로 긴 1x2 타일을 하나...
Recent Update