인프런 영문 브랜드 로고
인프런 영문 브랜드 로고
개발 · 프로그래밍

/

웹 개발

30분 요약강좌 시즌5 : 알잘딱깔센 flex & grid

알아서! 잘! 딱! 깔끔하고! 센스있게! 정리하는 flex & grid 책의 무료 강의입니다. 오픈소스 링크, 해당 책과 Notion 링크도 무료로 이용하실 수 있습니다. 비영리 프로젝트로 교재 활용도 허락 없이 가능합니다.

(4.9) 수강평 29개

수강생 1,353명

Thumbnail

초급자를 위해 준비한
[웹 개발, 프론트엔드] 강의입니다.

이런 걸
배워요!

  • Flex

  • Grid

  • 성배 레이아웃

  • 녹화 환경의 차이로 강의 영상별로 음량 및 음질에 차이가 있을 수 있으니 양해 부탁드립니다.

Flex & Grid 치트시트 웹 서비스

"flex&grid 실습, 치트시트, PDF 자료까지 한 곳에서!"

flexngrid.com

전자책 보러가기 >>

지식공유자 소개 ✒️

지식공유자 | 최수빈

한줄소개 | 주니어 개발자로서 처음 개발에 입문하는 분들도 프론트엔드의 핵심 개념들에 쉽게 접근할 수 있도록, 블로그유튜브를 통해 꾸준히 개발 콘텐츠를 제작하고 있습니다.

지식공유자 | 김예지

한줄소개 | 다양하고 새로운 지식을 습득하는 것에 재미를 느끼며 기록하는 과정을 즐깁니다. 주니어 개발자로서 탄탄한 기본기를 위해 같이 배워나가고 소통하며 부지런히 성장해 봅시다.

지식공유자 | 장효순

한줄소개 | 문서화와 지식공유에 관심이 많은 프론트엔드 개발자입니다. 글로 말하는 것을 좋아하는 기록덕후로, 블로그를 운영중입니다.

지식공유자 | 류재준

한줄소개 | 세상과 사람에 관심이 많은 주니어 개발자 입니다. 제가 사랑스럽게 어루만진 코드가 공공의 이익을 위해 널리널리 사용되었으면 하는 바람을 가지고 있습니다. 블로그와 미묘한 코드잔디밭, SNS로 함께 소통을 나누었으면 합니다.

지식공유자 | 허지현

한줄소개 | 코햄의 프론트앤드 유치원 원장 허지현입니다. 프론트앤드 개발자가 되고 싶은 모든 분들에게 도움이 되는 영상을 제작합니다.

지식공유자 | 임홍렬

한줄소개 | 빠르게 변화하는 세상에서 언제든 변화 할 준비가 된 주니어개발자입니다. 앞으로 많은 분들과 소통하며 긍정적인 영향력을 널리 퍼뜨리고 싶습니다.

지식공유자 | 여소희

한줄소개 | 메타인지를 통해 성장의 방향성에 대해 늘 고민하는 주니어 개발자입니다. 블로그를 통해 지식을 공유하고 소통하며 함께 성장하고 싶습니다.

지식공유자 | 임다현

한줄소개 | 모두에게 좀 더 편리한 세상을 만들고자 노력하는 주니어 개발자입니다. 함께 성장하는 즐거움을 널리 알리고 싶습니다.

코딩 입문, 필수 시청 
알아서 잘 딱 깔끔하고 센스있게!

웹 서비스, 무료 전자책, 영상 강의 3단 콤보를 무료 오픈소스로 제공합니다.

Flex? Grid?

flex와 grid는 CSS에서 사용하는 레이아웃을 위한 최신 기법입니다. 
flex는 1차원(X 또는 Y축의 한 방향) 레이아웃을, grid는 2차원(X, Y축 양쪽 방향) 레이아웃을 잡는 데 많이 활용합니다.

  • ✅ flex와 grid의 대표적인 구성요소들을 웹 페이지 레이아웃을 예시로 쉽게 파악해 봅시다.
  • ✅ 기본 활용법뿐만 아니라 다양한 레이아웃을 그려볼 수 있는 성배 레이아웃 튜토리얼을 제공합니다.
  • ✅ 필요한 부분만 인쇄해서 보고 싶으신 분들에게도 추천해 드립니다. PDF를 제공합니다. (강의 자료는 자유롭게 사용 가능합니다.)

Q&A를 확인해보세요! ✍️

Q. 지식공유자가 여러 명인데, 수업마다 강사가 다른가요? 

해당 영상은 오픈소스 프로젝트 "Flex & Grid" 기여자 분들께서 직접 찍어주신 강의입니다. 녹화 환경의 차이로 음량 및 음질의 차이가 있을 수 있으니 양해 부탁드립니다.

Q. Flex/Grid를 아예 모르는 초보자는 아닌데, 강의를 어떻게 활용하면 좋을까요?

원하는 부분만 보실 수 있습니다. Flex & Grid 웹 서비스에 접속하시면 CheetSheet를 제공해드립니다. 이것저것 클릭해보고 잘 모르겠다 하는 부분만 강의로 보시면 좋습니다. (수업 챕터마다 강사가 다르기 때문에 위에서부터 아래로 쭉 한 흐름에 시청하는 것을 권해드리지는 않습니다.)

제주코딩베이스캠프 
30분 요약 강좌 시리즈 📺

이런 분들께
추천드려요!

학습 대상은
누구일까요?

  • Flex와 Grid를 처음 접하는 분

  • 레이아웃 공부를 하고 있으신 분

선수 지식,
필요할까요?

  • HTML

  • CSS

안녕하세요
제주코딩베이스캠프입니다.

수강생 수

89,567

수강평 수

2,018

강의 평점

4.8

강의 수

69

소개 이미지.png.webp

 

🧙‍♂ 안녕하세요. 제주코딩베이스캠프입니다.

제주코딩베이스캠프란?

 

 

제주에서 가장 핫한 개발자들이 모여 작당한 부트캠프! 열정있는 청년들에게 열정만큼 성장할 수 있는 기회를 제공합니다!

제주코딩베이스캠프는 제주에서 가장 큰 ICT 교육 행사로 카카오, 구름, 제주산학융합원 등 기업 지자체와 함께 진행하고 있습니다.


서비스 구축 성공
경험을 통해 이 취업난 시대에 자신감, 자존감, 성취감, 그리고 자립할 수 있는 능력을 배양해 보세요!

으라차차 청춘 화이팅입니다! 😀

 


 

︎ 제주코딩베이스캠프 로드맵

제코베 로드맵.png.webp

 

︎ 제주코딩베이스캠프 수료증 제도

 

- 1.png.webp

 

커리큘럼

전체

25개 ∙ (1시간 55분)

수업 자료

가 제공되는 강의입니다.

강의 게시일: 
마지막 업데이트일: 

수강평

아직 충분한 평가를 받지 못한 강의입니다.
모두에게 도움이 되는 수강평의 주인공이 되어주세요!