일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 | 31 |
- 정규표현식
- 코딩테스트
- 기술면접
- useState
- Node
- 알고리즘
- 백준
- CSS
- 최소공배수
- BOJ
- state
- JavaScript
- 자료구조
- react
- 정렬
- sort
- 딥다이브
- 합병 정렬
- 리액트
- 프로그래머스
- 브루트포스
- node.js
- 자바스크립트
- 연결리스트
- JS
- hash
- 완전탐색
- 병합 정렬
- 해시
- 코테
- Today
- Total
목록Programming (20)
가치투자자
선택자 (Selector) 이 글은 선택자와 연장선에 있는 글이다. 선택자에 대해 아직 잘 모르겠다면, 아래의 글을 먼저 읽고 오자. https://valueengine.tistory.com/40 [CSS] 선택자 선택자 (Selector) 우리가 원하는 UI를 만들기 위해 HTML에 스타일(디자인, 레이아웃 등)을 적용해줘야 한다. 이때 HTML 문서에서 우리가 원하는 요소에만 CSS를 적용하기 위해 선택자(selector) 가 필요하 valueengine.tistory.com 3. 가상 클래스 선택자 (Pseudo-Class Selector) 우리가 어떤 요소에 스타일을 적용하기 위해 클래스를 만들 수 있다. 그러나 우리가 따로 만들지 않아도 존재하는 클래스가 바로 가상 클래스다. 가상 클래스 는 어..
선택자 (Selector) 우리가 원하는 UI를 만들기 위해 HTML에 스타일(디자인, 레이아웃 등)을 적용해줘야 한다. 이때 HTML 문서에서 우리가 원하는 요소에만 CSS를 적용하기 위해 선택자(selector) 가 필요하다. 먼저, 선택자에 CSS를 적용하는 방법부터 살펴보겠다. 예를 들어, h1 태그에 12px 크기의 빨간색 글씨로 CSS를 적용하고 싶을 때, 아래처럼 선택자 뒤에 {}를 써주고, 그 안에 우리가 원하는 스타일을 객체 형태(프로퍼티와 값)로 적어주면 된다. 1. 기본 선택자 1-1. 전체 선택자 (Universal Selector) HTML 문서 내의 모든 요소를 선택하는 선택자다. 별표(*) 로 모든 HTML를 선택할 수 있다. 아래 예시처럼 head 태그를 포함해 모든 요소에 ..
Flex (플렉스) 프론트엔드가 되기 위해선 레이아웃 배치를 잘 구현할 수 있어야 한다. 어떻게 요소들을 배치, 정렬하느냐에 따라 사용자가 보는 UI의 직관적인 느낌과 기능의 효율성이 달라지기 때문에 레이아웃 방식에 대해 제대로 공부해둘 필요가 있다. 1. Flex란? 이전에는 float나 inline-block 등을 이용해 레이아웃을 만들었지만, UI를 구성할 요소들의 사이즈가 불명확하거나 화면이 동적으로 변할 때도 유연하게 대응할 수 있는 기능을 제공하는 레이아웃 방식이 Flex다 Flex는 Flexible Box 또는 Flexbox 라고 불리기도 한다. 1-1. 부모 요소 flex container와 자식 요소 flex item 1 2 3 Flexbox 레이아웃은 flex item 이라 불리는 자식..
* 기술면접 질문은 맨 아래에 적혀 있습니다 이벤트 (Event) 1. 이벤트란? 이벤트 (Event) 는 사전적 의미처럼 어떤 "사건"을 말한다. 예를 들어, 버튼 클릭, 마우스 이동, 키보드 입력 등 브라우저창에서 어떤 상황이 발생했을 때 나타나는 사건을 이벤트라 한다. 그리고 어떤 이벤트가 발생했을 때 어떤 결과물을 호출할지 그 내용을 담은 함수가 이벤트 핸들러 (event handler) 이며, 브라우저에 의해 호출된다. 이때 브라우저에게 특정 이벤트 핸들러(특정 함수)를 호출하도록 권한을 위임해주는데 이를 이벤트 핸들러 등록 이라 한다. 아래의 예시를 살펴보면, loginButton이란 클래스명을 가진 로그인 버튼이 있다. 저 버튼을 클릭하면 "로그인이 되었습니다!"라는 알람창이 뜨도록 하는 함..
스코프 (scope) 변수와 더불어 모든 프로그래밍 언어에서 가장 기본적인 개념 중 하나가 스코프(scope)이다. 그만큼 중요하기에 완벽하게 자신의 것으로 만들 필요가 있다. * 기술면접 질문은 맨 아래에 적혀 있습니다 1. 스코프란? 공식 문서를 살펴보면, 스코프는 '변수와 표현식을 식별하거나 참조할 수 있는 현재 실행 컨텍스트'를 의미한다고 나와있다. 좀 더 쉽게 설명해보자면, 스코프 (scope) 는 식별자(identifier, 변수, 함수, 클래스의 이름)가 유효한 범위를 말한다. 서울에 A라는 사람이 살고 있을 때, 서울이라는 범위 내에선 A의 존재를 찾을 수 있고, 서울 밖에서는 A를 찾을 수 없다. 이때 서울이 스코프인 것이다. 만약 서울 외 지역에서 A를 찾게되면, A를 찾을 수 없다며 ..
객체지향 프로그래밍 지금 자바스크립트를 공부하고 있거나, 혹은 자바스크립트를 공부할까 고민하고 있지만, 과연 자바스크립트가 어떤 특징의 언어인지 제대로 알고 있을까? 자바스크립트(JavaScript) 는 명령형, 함수형, 프로토타입 기반 객체지향 프로그래밍을 지원하는 프로그래밍 언어이다. 하지만 객체지향이 무엇인지, 프로토타입은 또 무엇인지 제대로 알지 못하고 공부를 시작하는 사람이 많다. * 기술면접 질문은 맨 아래에 적혀 있습니다 1. 객체지향 프로그래밍 프로그램을 명령어 또는 함수의 목록으로 보는 전통적인 명령형 프로그래밍의 절차지향적 관점에서 벗어나 여러 개의 독립적 단위, 즉 객체의 집합으로 프로그램을 표현하는 프로그래밍을 말한다. 좀 더 쉽게 설명하자면, 하나의 상자가 있다. 그리고 그 상자는..