현재, 그리고 미래의 표준이 될 CSS 레이아웃 작성 방식인 Flex와 Grid에 대해 배울 수 있습니다.

아직도 Flex, Grid 안쓰시나요?
때가 되었습니다. 이제는 하셔야 합니다!

웹퍼블리셔/프론트엔드개발자/코딩하는디자이너 이신가요?
때가 되었습니다. 이제는 하셔야 합니다.

여전히 많은 환경에서 Flex 와 Grid 대신 Float..등등 으로 화면을 구성하고 있죠.
하지만 이렇게 짜여진 코드는 많은 문제를 야기합니다.

왜 Flex, Grid 를 배워야 하나요??

🌟 Flex 와 Grid 는 앞으로 CSS 의 표준이자 기반이 될 기술입니다.

수많은 서비스들이 Grid 기반으로 디자인 되고 있고, 그것을 그대로 적용시키기 위해서 필연적이니까요.

😄 간단하고 쉬워요.

이전의 기술들로 표현하기 위해서 온갖 꼼수를 써야했다면, Flex, Grid 로는 아주 간단하고 쉽게 많은것들이 해결됩니다.

💪🏼 실무에서 바로 활용 가능한 기술이에요!

Flex와 Grid는, "인터넷 익스플로러에서 안되니까 실무에서 못 쓰는 기술"이 아니에요.
최신 버전의(MS에서도 버린 마당에 최신이라고 하기도 좀 이상하지만) 인터넷 익스플로러(10 이상)를 지원하는 프로젝트라면 사용할 수 있습니다. 저도 상용 서비스들에 유용하게 써오고 있거든요.

이 강의에선 어떤것들을 배우나요?

이해하기 쉽게 정리한 핵심 개념 정리

새로운 개념이라 익혀야 할 것들이 꽤나 많습니다. 처음 하는 분들은 정리된 문서를 읽어보아도 헷갈리고 어려운 부분들이 있을 거에요.
여러분들이 앞으로 할 CSS 레이아웃 코딩의 기반 기술인 만큼, 확실히 이해할 수 있도록 개념 설명에도 시간을 많이 할애 했습니다.

개념을 바탕으로 간단한 UI 만들기

기본 핵심 개념을 익힌 후, 필수적이고 자주 사용하는 패턴의 UI들과 반응형 페이지를 직접 만들어보며
기본기를 탄탄하게 다듬고 자연스럽게 익숙해질 수 있도록 강의를 구성했습니다.

Flex, Grid 로 각각 반응형 페이지 만들기 실습

최근 만들어지는 서비스의 99% 는 반응형 페이지죠. float, inline-box 가 아닌 Flex 와 Grid 를 활용해 실무적 페이지를 만들어 볼 수 있어요. 훨씬 쉽고 간변하고 강력하게 반응형 페이지를 만들어 보세요!

디자인한 대로, 상상한 대로

3D 게임판을 만들어보며 배운 내용들로 우리가 어떤 상상력을 현실화 할지 감을 잡아보도록 하죠!

인터넷 익스플로러에서 Grid 사용하기

Flex와 Grid는, "인터넷 익스플로러에서 안되니까 실무에서 못 쓰는 기술"이 아니에요. 속성을 비교해보고IE 에서는 Grid 를 어떻게 사용하나 배워봅니다.

지금 배워야 합니다!

언젠가는 해야할 것, 지금 시작해서 우리의 서비스에 적용하고, 남들보다 빨리 익숙해집시다!
그럼 연봉과 인정은 당연히 뒤따라 오겠죠?