프로퍼티 어트리뷰트

1. 내부 슬롯과 내부 메서드

프로퍼티 어트리뷰트를 이해하기 위해 먼저 내부 슬롯(internal slot)과 내부 메서드(internal method)의 개념에 대해 알아보자.

전역 변수의 문제점

전역 변수의 무분별한 사용은 위험하다. 전역 변수를 반드시 사용해야 할 이유를 찾지 못한다면 지역 변수를 사용해야 한다. 이번 글에서는 전역 변수의 문제점과 전역 변수의 사용을 억제할 수 있는 방법을 살펴보자.

let, const와 블록 레벨 스코프

1. var 키워드로 선언한 변수의 문제점

ES5까지 변수를 선언할 수 있는 유일한 방법은 var 키워드를 사용하는 것이었다. var 키워드로 선언된 변수는 다음과 같은 특징이 있다. 이러한 특징들은 주의를 기울이지 않으면 심각한 문제를 발생시킬 수 있다.

1. 변수 x가 10보다 크고 20보다 작을 때 변수 x를 출력하는 조건식을 완성하라

1
2
3

var x = 15;

if ( 10 < x && x < 20) console.log(x);

Clearance

마진 병합에 대해서 W3C 레퍼런스를 찾아보다가 등장한 단어 “Clearance”
CSS에 대해서 다 알진 못하더라도 대부분의 단어에 대해서 들어보긴 했다고 생각했는데 이 단어는 정말 처음 들어봤다.
처음 들어보는 단어다 보니, 당연히 W3C에 있는 문장들을 이해할 수 없었다.
도대체 clearance가 뭐야??

Block Formattion Context

BFC는 normal flow에서 블록 상자들이 배치됐을 때 웹 페이지를 렌더링하는 시각적 CSS의 일부이다.
추가적인 설명 페이지 : 박스 모델과 BFC의 이해

스코프

1. 스코프란?

스코프는 자바스크립트를 포함한 모든 프로그래밍 언어의 기본적이며 중요한 개념이다. 스코프의 이해가 부족하면 다른 개념을 이해하기 어려울 수 있다. 더욱이 자바스크립트의 스코프는 다른 언어의 스코프와 구별되는 특징이 있으므로 주의가 필요하다. 그리고 var 키워드로 선언한 변수와 let 또는 const 키워드로 선언한 변수의 스코프도 다르게 동작한다. 스코프는 변수 그리고 함수와 깊은 관련이 있다.

클론코딩을 하려고 웹사이트의 코드를 뜯어보면 처음 보는 :root 가상선택자와 알 수 없는 속성들 --font-family-roboto 같은 것들이 종종 보여 이에 대해 정리하려고 합니다.

전처리기 변수와 CSS 커스텀 속성

CSS 전처리기는 웹 개발에서 중요한 역할을 하고 있다. (Sass, Stylus, Less 등)
전처리기의 주요 장점 중 하나는 변수를 사용할 수 있다는 것이다. 변수를 사용하면 복사 붙여넣기를 피할 수 있고 개발과 리펙토링이 간단해진다.
그러나, 전처리기 변수에는 몇 가지 한계가 있다.

주석

Web font

오늘은 web font에 대해 알아보겠습니다.
그동안 아무 생각없이 구글 폰트에서 복사 붙여넣기 하던 폰트였는데 문득 font-family로 적용하는 방법과 @font-face로 적용하는 것 두 가지가 어떤 차이가 있는지 궁금해져 작성합니다.