Expression and Statement

이번 글은 표현식과 문에 대한 글이다.
용어를 익혀두면 공부할때나 협업할때 이해하기 더 수월하다.
앞으로 자바스크립트를 설멍핼 때, 문과 표현식 이라는 용어가 자주 등장할 것이다.
용어의 이해는 코드의 품질과 연관이 있다. 확실하게 이해하고 가자.

Read More

Variable

변수

변수란?

변수란 메모리 셀 안의 공간 그 자체, 혹은 메모리 주소에 붙여진 이름을 뜻한다.

Read More

Start Git

Git에 관련한 모든 것들

Git의 시작

1.1 Git이란?
“버전 관리”
git이 무엇인지 한번이라도 들어본 사람은 버전 관리라는 말을 들어봤을 것이다.
그렇다면 버전 관리란 무엇일까?

Read More

SMACSS & OOCSS & BEM

OOCSS(Object Oriented CSS)

OOCSS의 2가지 원칙

oocss는 객체 지향에 따라 고안된 설계 방식이다.

Read More

Responsive website

반응형 웹사이트 구현


1일차

반응형 웹사이트를 구현할때는 가장 작은 모바일부터 구현한 후 큰 브라우저 순으로 구현하는게 좋다.
현업에서는 이미 데스크탑 기준 웹사이트를 구현한 후 모바일 모델을 구현하는 경우도 많다.

Read More

Flex

Flex

  1. Flex란?
    지금까지 설명한 float,position은 레이아웃을 만들기 위한 속성이 아니다. 그래서 레이아웃을 잡는 것이 다소 까다로웠는데 이것을 해소시켜주는 것이 바로 flex이다. 어떤 요소들을 수평정렬 해준다고 생각해보자.
    float를 사용한다면 {float:left;}를 하고 부모요소에 clearfix를 추가로 작성해줘야 한다. 그러나 flex 속성을 사용한다면 정렬하려는 아이템의 부모요소에 {display:flex;}만 추가해주면 된다.

Read More

Collapsing margins

마진 병합

CSS에서, A 상자의 margin-top과 B 상자의 margin-bottom이 하나의 마진으로 합쳐질 수 있다. 이렇게 합쳐진 마진은 병합된다고 한다.

Read More

CSS Attribute Selector

속성 선택자 정리

  1. 태그의 속성을 선택
    [attribute] : a[target] {color: blue;}
    a 태그에 target 이라는 속성을 가진 요소를 선택한다.(“target”이라는 속성을 가지고 있으면 전부 선택)

Read More

Float

Float

float란?

요소를 좌, 우 방향으로 띄운다. 가장 오래된 방법이고 번거롭지만 아직도 실무에서 많이 쓰이는 방법이니 잘 숙지해두자.

Read More

Grid

Grid

그리드는 flex와 마찬가지로 container와 item 두 가지로 구분되어 있다.
container는 item들을 감싸는 부모 요소이고 그 안에서 각 아이템들을 배치할 수 있다.

Read More