https://cskime.github.io/css-flexbox-preview/

(1) 자기소개

안녕하세요. 프론트엔드 개발자로 전향하기 위해 이제 막 공부를 시작한 취준생입니다.

지난달부터 노마드코더 강의와 챌린지를 하면서 HTML/CSS/JS를 공부하고 있어요.

(2) 서비스 소개

Flex layout을 만들 때 사용하는 property들의 값을 변경하면 바로 layout이 변경된 결과를 확인해 볼 수 있는 단순한 웹페이지 입니다.

(3) 시작하게된 계기

CSS Layout 마스터클래스에서 grid까지 듣고 나니 flexbox와 겹치는 속성들이 몇 가지 있는 것 같아서 햇갈리더라구요. 그런데 flexbox를 공부하면서 제일 어려운게 어떤 속성을 바꿨을 때 어떤 결과가 나오는지 바로 연상하기 어렵다는 점이었어요. 그래서 flexbox에서 어떤 속성들에 어떤 값을 넣으면 layout이 어떻게 변하는지 눈으로 확인하면서 공부할 수 있는 서비스가 필요해서 만들어 봤습니다.

(4) 개발

아주 단순하지만, 개념들을 복습하면서 만드느라 1주일 정도 걸린 것 같습니다.

HTML/CSS/JS로 만들었습니다.

(5) 바라는 것은?

제가 쓰려고 만들었지만, CSS 공부하시는 다른 분들에게도 도움이 됐으면 좋겠습니다~