No video

CSS Flexbox 완전 정리. 포트폴리오 만드는 날까지! | 프론트엔드 개발자 입문편: HTML, CSS, Javascript

  Рет қаралды 199,498

드림코딩

드림코딩

Күн бұрын

Flexbox만 잘 이해하셔도 이제 본격적으로 웹사이트의 구조를 만들 수 있어요 ❤️
(↙ 자세한 내용)
___________________________
💡 풀스택 개발 로드맵 ⇢ academy.dream-...
🚀 엘리와 더 체계적으로 배우고 싶다면 ⇢ 드림코딩 아카데미:
academy.dream-c...
.....................................................
영상 끝까지 다 보시구 나오는 숙제도 다 한번씩 해보세요 :) ⬇️ 아래 더보기에 링크 확인해보세요
Flexbox Froggy 게임: flexboxfroggy....
🔗 Resources:
Material Design Color Tool:
material.io/re...
CSS Tricks for Flexbox:
css-tricks.com...
MDN Float:
developer.mozi...
MDN Flexbox:
developer.mozi...
.....................................................
☀️ 드림코딩 엘리
모든 드림코더분들이 개발자로 성장해 나가고 꿈을 이루는 여정에 함께 할 채널입니다 :)
❝Don't forget to code your dream
여러분들의 멋진 꿈을 코딩하세요 ⭐️
.....................................................
🌐 프론트엔드 개발자 되기 입문자편 영상 목록:
• 프론트엔드 강의 - 프론트엔드 개발자 되...
📒 자바스크립트 기초 강의 영상 목록:
• 자바스크립트 기초 강의 (ES5+): 같...
💻 개발자라면 누구나 알고 있으면 좋은 지식 💡
• 개발자라면 누구나 알고 있으면 좋은 지식 💡
💰 개발자 경력 관리 영상 목록:
• 승승장구 커리어 관리 🚀
📄 이력서 작성 방법
• 취업 보장 이력서 작성 🙌
📈 IT 트렌드
• IT 트렌드 📈
📷 개발자 브이로그
• 개발자 브이로그 📷
🤗 생산력 향상 팁
• Tech & Tools ❤️
🎵Music
Title: Serenity by JayJen
Genre and Mood: Dance & Electronic · Calm
License: Royalty free music for KZbin, Facebook and Instagram videos giving the appropriate credit.
#CSS#Flexbox#프론트엔드

Пікірлер: 895
@dream-coding
@dream-coding 4 жыл бұрын
여러부운~ 잘 따라오고 계시나요? CSS로 갈수록 조회수가 떨어져서 걱정이예요 🤣 들으시구 계신다면 출석체크 부탁드려요 ❤️ 이제 CSS 이론은 여기서 마무리 하고 이제 실전편으로 넘어가서 HTML과 CSS로 간단한 UI Component, 모바일 웹사이트, 반응형 정적 웹사이트 몇가지를 만들어보고여태까지 배운 아이들을 연습해 볼꺼예요. 자세히 다루지 못한 CSS내용들은 실전을 하면서 조금씩 더 정리해 드릴께요 :) 혹시, 제가 다루지 못했거나 아직 헷갈리시거나 부족한 내용들이 있었다면 꼭 알려주세요 🙏🏼 참고해서 실전 영상 만들때 반영해서 만들어 보도록 할께요 🤗
@hoo_chuchu_0901
@hoo_chuchu_0901 4 жыл бұрын
출첵~_~ 💥 잘보고있습니다.
@dream-coding
@dream-coding 4 жыл бұрын
우앗! 저희 코멘트에서는 처음 뵙는것 같은데, 너무 감사합니다 🙌
@user-rl8lv7kq6n
@user-rl8lv7kq6n 4 жыл бұрын
출첵입니다~~~~
@user-qs6dw8sg3p
@user-qs6dw8sg3p 4 жыл бұрын
출석체크는 여기서 하는건가요? ㅋㅋ ;;
@dream-coding
@dream-coding 4 жыл бұрын
하하 이 영상에서는 다들 여기에 해주시네요 하하
@user-mc9np1bk4u
@user-mc9np1bk4u 2 жыл бұрын
6:25 한꺼번에 작성하기 7:08 vh 와 %(부모 지정 필요) 차이 8:10 color tool - 색조합및 색코드참고 8:50 아이템 크기 조정 9:10 container (display/flex-direction/flex-wrap/flex-flow) 11:54 item(justify-content) 중심축 13:45 item(align-items) 반대축 14:30 item(align-content) 반대축의 아이템 지정 16:00 참고사이트소개 16:48 item 속성값들(order,flex-grow,flex-shrink,flex-basis,align-self)
@user-tz9ov9lh8z
@user-tz9ov9lh8z 3 жыл бұрын
레알 플잘알 이시네, 진짜 flex 설명 영상 중 젤 이해가 잘됨 하버드 flex 설명 학과 나오셨슴 flex-direction : main 축 지정 flex-wrap: 컨텐츠 두줄 표시 여부 justify-content: main 축 아이탬 배치 간격 지정 align-item: 반대축 배치 지정 align-item: 반대축 배치 아이탬 간격 지정
@lionsama-w2t
@lionsama-w2t 3 жыл бұрын
강의 수준 실화냐.. 가슴이 웅장해진다🙌
@user-jh6id5rk5z
@user-jh6id5rk5z 3 жыл бұрын
강의를 너무잘하시는군요,귀에 쏙쏙 들어옵니다. 강의에 따라서 실제로 코드를 만들어 보니까 쉽게 이해되군요. 57년생인데도 충분히 이해가 됩니다. 감사합니다.
@dream-coding
@dream-coding 3 жыл бұрын
와, 도전을 멈추지 않는 그 열정 너무 멋있어요 🙆‍♀️
@jinsolkim6648
@jinsolkim6648 8 ай бұрын
9번까지 확인. 백엔드 위주로 해서 개인 프로젝트로 구현하는데 시간이 많이 걸렸는데 기초 개념으로 공부 많이되고 있습니다. 감사합니다.
@mangguuum
@mangguuum 3 жыл бұрын
선생님.. 강의가 정말 기가 맥힙니다..!!!! 진짜 강의 그대로 외울 때까지 봐도 아깝지 않은 명강의 입니다!!!!! 엄지척과 기립박수를 보냅니다!!
@user-bm8vz6qc9s
@user-bm8vz6qc9s 4 жыл бұрын
꺄아악 ㅠㅠㅠ엘리님... float와 display를 울면서 배웠던 입장에서 flex...쉬워봤자 편해봣짜 그게 얼마나 편하겠나... 최신에 나온 기술이랬으니 천천히 배우자... 나중에 배워도 안 늦겠지... 이랬는데 진작... 배울걸 그랬어요ㅠㅠ 너무 편하구 쉽고... 얼른 응용해서 이것저것 만들어보고 싶어요! 졸리지만 이거 하나만 더 보다가 중간에 졸리면 자야지...했는데 넘 흥미로워서 노션에 온라인 필기까지하며 들었네요ㅠ-ㅠ 감사합니다. 매번 강의를 볼 때마다 너무 좋은 팁들을 알려주셔서 저에게 정말 큰 도움이 돼요! 오늘은 일찍 자구 내일 일어나서 복습할게요 오늘도 출석!
@dream-coding
@dream-coding 4 жыл бұрын
우와 노션에 정리까지 하시면서 들으셨다니 ❤️ 열심히 해주셔서 정말 감사해요. 영상을 만든 입장에서 이렇게 열심히 들어주시면 정말 뿌듯하답니다. 네 그리구 flex 너무 유용해요~ㅋㅋㅋ 이거 없이 예전에 어떻게 만들었나 싶어욬ㅋ
@nini_509
@nini_509 3 жыл бұрын
저도ㅎㅎ 국비학원 다녔는데 flex를 안알려줘서 알고가요
@ottootto2907
@ottootto2907 3 жыл бұрын
24번 푸느라고 혼났내요 ㅋㅋㅋㅋㅋ wrap-reverse도 있다니.. ㅋㅋㅋㅋ오늘도 감사합니다!!! 1. flex-direction: row-reverse; 2. justify-content: center; 3. justify-content: space-around; 4. justify-content: space-between; 5. align-items: flex-end; 6. justify-content: center; align-items: center; 7. justify-content: space-around; align-items: flex-end; 8. flex-direction: row-reverse; 9. flex-direction: column; 10. flex-direction: row-reverse; justify-content: flex-end; 11. flex-direction: column; justify-content: flex-end; 12. flex-direction: column-reverse; justify-content: space-between; 13. flex-direction: row-reverse; justify-content: center; align-items: flex-end; 14. order:2; 15. order:-4; 16. align-self: flex-end; 17. order:2; align-self:flex-end; 18. flex-wrap: wrap; 19. flex-direction: column; flex-wrap: wrap; 20. flex-flow: column wrap; 21. align-content: flex-start; 22. align-content: flex-end; 23. flex-direction: column-reverse; align-content: center; 24. flex-flow: column-reverse wrap-reverse; justify-content: center; align-content: space-between;
@dream-coding
@dream-coding 3 жыл бұрын
와, 이렇게 다 푸신거예요? 👍🙌
@ottootto2907
@ottootto2907 3 жыл бұрын
@@dream-coding 이렇게 답글 주실주 몰랐어요 ㅠㅠㅠㅠ 1년전 영상이라 ㅠㅠㅠ 열심히 하겠습니다!!! 감사해요 정말
@wisdombrave
@wisdombrave 2 жыл бұрын
프로젝트에서 버튼 위치를 변경 못해서 반나절을 보냈고 영상을 몇번 보니까 이제 해결 가능할 것 같네요 일정에 대한 푸쉬로 스트레스 받아서 잠을 설치다가 이제 공부 마치고 자야겠네요 정말 감사드립니다.
@yeolmaelog
@yeolmaelog Жыл бұрын
221110 수강완료 비전공자라 그런지 20분짜리 강의를 2시간동안 반복하면서 들었네요 ㅠㅠㅠ 최고의 강의 감사합니다. 앞으로도 쉽고 재밌게 강의 제작 부탁드려요 정말 한줄기 빛!
@haribo._.2
@haribo._.2 2 жыл бұрын
2022.02.08 출석체크😃 HTML, CSS 개념 정리 다시 하고, 선물도 마스터했습니다!ㅎㅎ
@haeunjeong7564
@haeunjeong7564 4 жыл бұрын
강의 듣기 전에는 개구리 게임 3단계까밖에 못했는데, 강의 다 듣고 나서는 마지막 24단계까지 성공했어요! 감사합니다 :)
@dream-coding
@dream-coding 4 жыл бұрын
어멋 정말요? excellent 👍
@stella179
@stella179 3 жыл бұрын
정말 감사합니다 엘리님만큼 잘 가르치시는 분은 없을 것 같아요 강의 퀄리티도 너무 좋아서 감동이에요ㅠㅠㅠㅠ
@ydkim108
@ydkim108 2 жыл бұрын
실제 개발시 난관에 부딪혀서 여러 번 보다 보니 이제 이해가 좀 가네요. 설명은 짱인데 이해하는 건 개인의 몫이군요. 이해가 된 다음에 보니 정말 설명은 잘하시네요^^
@SeanPark7
@SeanPark7 2 жыл бұрын
지금까지 본 Flex 영상 중 최고네요.
@crocochat2733
@crocochat2733 3 жыл бұрын
다른데서 돈내고 강의들은거 진짜 후회돼요. 기억하기 너무 쉽게 잘 가르쳐주셔서 머리에 쏙쏙 잘 들어와요 ㅜㅜ 이런 컨텐츠 빛과 소금이에요 너무 감사합니다 ㅜㅜ
@snacksfordogs
@snacksfordogs 3 жыл бұрын
HTML, CSS강의 드디어 다 들었어요 ㅠㅠㅠ 깨알같은 선물들 주셔서 노션에다 따로 정리하느라 시간이 좀 오래 걸렸어요 흡흡..😭 근데 강의 다 들으니까 엘리님 구독자 10만명 되셨네요!! 너무 너무 축하드려요!!! 100만까지 오래오래 함께 공부하고 싶어요!!❤️
@dream-coding
@dream-coding 3 жыл бұрын
축하해 주셔서 감사합니다 😍
@TV-yp9hx
@TV-yp9hx 2 жыл бұрын
flexbox 맨날 아리송했는데 이거 보고 완전 이해했어요! 항상 감사합니다 엘리님!! 👍😀
@cromerang
@cromerang 2 жыл бұрын
아니… 블로그만 보고 글로만 연습하니 계속 막혀서 영상으로 보자.. 싶어서 보게 됐는데 너무 속시원하게 알려주셨어요…🥹🥹🥹🥹
@user-zg1sf9tm9g
@user-zg1sf9tm9g 3 жыл бұрын
쉽게 설명 잘들었습니다...이제 float 에 손을 뗄때가 됐네요 감사합니다!!!!
@dream-coding
@dream-coding 3 жыл бұрын
출첵해 주셔서 감사해요 🙌
@user-yi9pm8ks9f
@user-yi9pm8ks9f 2 жыл бұрын
오늘도 덕분에 많이 배웠습니다. 천공세대로 10년은 개발자로 이후 10여년은 개발부서 관리자를 살다보니 프로그래밍은 멀리하게 되었습니다. 곧 60인데 프로그램 개발에 대한 애정이 아직 남아있어 다시 시작해보려니 쉽지는 않군요. 그저 즐기면서 공부하고 있습니다. 감사합니다.
@user-yl2cf7xz4b
@user-yl2cf7xz4b 2 жыл бұрын
flexbox를 배워도 잘 이해가 되지 않았는데 이 영상에서 단번에 이해됐어요 감사합니다
@Aaa-dc3bk
@Aaa-dc3bk 2 жыл бұрын
와... 진짜 인턴하면서 급하게 프론트엔드를 하게되었는데 css를 거의 안해봐서 너무 오래걸리더라구요. Flex가 먼지 어떻게 사용하는지 전혀 몰랐는데 덕분에 큰 도움이 되었습니다! 강의만 봤는데 생산성 2배는 될거 같네요!! 감사드립니다!
@hinoko58
@hinoko58 4 жыл бұрын
불필요한말 한마디도 없는 멋진 강의 감사합니다. 강의 목소리도 아주 듣기 좋네요.
@dream-coding
@dream-coding 4 жыл бұрын
좋은 피드백 감사합니다 ❤️
@mischief_maker
@mischief_maker 2 жыл бұрын
출첵🙌 디너에 이어서 개구리 과제 좋습니다 ㅋㅋ 밤이 늦어 내일 퇴근 후에 다시 찾아뵐게욥
@user-kt8ny4qf8b
@user-kt8ny4qf8b 3 жыл бұрын
출석체크!! CSS Flexbox 강의 잘 봤습니다!!!! 1. 컨테이너와 아이템에 정의 되는 속성 값 2. Flexbox 중심축과 반대축 복습 하고 익히겠습니다!!
@user-py3uv8hu7l
@user-py3uv8hu7l 2 жыл бұрын
position을 오래 붙잡고 있다가 드디어 flexbox로 넘어오게 됐어요! 오늘 수업도 감사합니당
@ChooHealing
@ChooHealing 4 жыл бұрын
명쾌한 강의 잘 들었습니다. 오늘은 Flexbox라는 강의를 처음 들었는데 반응형 홈페이지라는 것에 대한 이해를 높일 수 있었습니다. 감사합니다.
@dream-coding
@dream-coding 4 жыл бұрын
우와 정말 열심히 해주시고 이렇게 항상 코멘트 남겨 주셔서 감사합니다 ❤️
@sjstory966
@sjstory966 Жыл бұрын
감사합니다 , html /css 수업을 듣게 된지 1주일 정도 되었는데 , 과제 할 때 많이 도움이 되었습니다
@JM-il8cg
@JM-il8cg 4 жыл бұрын
HTML+CSS 5개 강의 다 들었어요💛 엘리님 영상들 보면서 노션으로 스터디허브도 만들었고, 차근차근 따라하는 중인데 막막한 독학의 길에 등대가 되어 주시고 있어요! 늘 좋은 강의와 영상 감사드립니다 :)
@kangmunjung5483
@kangmunjung5483 2 жыл бұрын
스터디허브는 어떻게 하는건지 알려주세요.. 저같은 초보에게도 필수인것 같사옵니다~
@user-vc5eo9ir9d
@user-vc5eo9ir9d 5 ай бұрын
노션 어디다가써요?
@user-hz1dl5tw2p
@user-hz1dl5tw2p 2 жыл бұрын
세 번 돌려보고 Notion에 정리 하는 시간이 1시간 44분 걸렸네요 ㅎ 아주 잘 보고 있습니다.. 얼렁 입문자 강의 다 듣고 아카데미 강의 들어야 하는데... ㅎ 일단 slack에 가입은 했습니다유...
@user-wb8ri5fb9o
@user-wb8ri5fb9o 2 жыл бұрын
이번 강의는 처음 보는 개념들이 많았네요.. item 속성값이라는건 완전 처음 알았고 컨테이너에 대해도 잘 이해하지 못하고 있었어요. 제가 이렇게 개념이 비어있는데 바로 프로젝트를 했다니.. ㅠ 어쩐지 프로젝트 하는데 자꾸 제멋대로 배치가 안되더라고요… 그래서 적성이 안맞는건가 생각했는데 개념이 안잡혀 있던 것… 정말 좋은 강의 감사합니다.. 지금이라도 듣게돼서 너무 다행이예요!! Html css는 다들었구 이제 복습하면서 js강의 들어야겠어요 ㅎㅎ 정말정말 좋은강의 감사합니다ㅜㅜ👍
@sskccho
@sskccho Жыл бұрын
책을 봐도 진도가 잘 안나갔는데.. ..드림코딩님 덕분에 속성으로 그 동안 궁금했던 flexbox가 완벽히 정리 및 이해가 되었어요. 정말 감사드려요~
@user-fj2wd9ql4k
@user-fj2wd9ql4k 2 жыл бұрын
Flexbox Froggy 게임이 한글번역 되어 진행하기 더 편해졌네요 항상 좋은 강의 감사합니다!
@user-xt4jn4gy2i
@user-xt4jn4gy2i 3 жыл бұрын
ui/ux디자이너 공부하는 학생입니다 학원에서 수업듣고 집에서 드림코딩님 강의 듣으니 이해가 쉬워서 잘 듣고 있습니다
@jnova2766
@jnova2766 3 жыл бұрын
Flexbox 설명중에 제일 자세하고 좋아요! 감사합니다
@kungkungttali
@kungkungttali 3 жыл бұрын
말 하나하나가 너무 깔끔하고 명확하게 설명해 주셔서 이해하기가 한결 수월해졌네요..한줄기의 빛 같달까.. 영상 집중 잘 못하는데 엘리님 영상은 달라요 ㅠㅠㅠ 감사합니다. 이 채널의 존재에 정말 감사해요❤❤
@kevinkj2011
@kevinkj2011 4 жыл бұрын
좋은 강의 감사합니다 많은 코딩강좌를 보기만 하면서 몇년 동안 막연하게 코딩을 알앗습니다 엘리 님 영상보면서 많은 도움이 됩니다 고맙습니다
@git_mn83
@git_mn83 2 жыл бұрын
flex 이해가 쏙쏚 되네요! 좋은 강의 감사드립니다
@mom1st_946
@mom1st_946 4 жыл бұрын
엘리님 너무 걱정하지 마세요. 꾸준히 올리시다보면 10만, 20만 금방입니다. ^ ^
@dream-coding
@dream-coding 4 жыл бұрын
응원 감사합니다 ❤️
@instantcoffee1589
@instantcoffee1589 3 жыл бұрын
최고의강의.flexbox 이해가 하나도 안되었는데 영상보고 바로 이해가 가버렸습니다. ㅎㅎㅎ 이제는 많이써보고 친숙해지는 수밖에 없네요. 추천을 100개이상 박을수있으면 좋겠네요
@junghyun614
@junghyun614 2 жыл бұрын
다음 강의가 알고리즘에 안뜨네요 ㅠㅠㅠㅠㅠ 다음 강의도 듣고싶어요 일단 개구리들 살려주고 오겠습니다~ 강의 감사합니다!!!
@user-mx9gc2ok8y
@user-mx9gc2ok8y 4 жыл бұрын
게임 소개 너무 좋아요!! 기본적인 설명 쉽고 자세하게 해주시고 게임으로 적용도 해볼 수 있게 해주셔서 감사합니다 😘
@user-wh4up2cj6y
@user-wh4up2cj6y 2 жыл бұрын
Flexbox에 대해 잘 이해했습니다. 감사합니다. ^^
@user-vk9kz1re3q
@user-vk9kz1re3q 3 жыл бұрын
강의 몇개 들어보니, 얼굴 80점 목소리 100점 강의내용 100점 이였습니다. . 지금은? . . . . . . . . . 얼굴 100점 목소리 100점 강의내용 100점 입니다. 너무 감사드려요. 돈이 넉넉하면 엘리님 유료강의로 시작해보고 싶지만... 올려주신 정보만으로도 너무나 큰 도움이 되었네요.
@dream-coding
@dream-coding 3 жыл бұрын
ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ 코멘트 100점 입니다
@starriet
@starriet 2 жыл бұрын
아무생각없이 들어왓다가 계속봣네.. 우와우 나도이제 프론트엔드개발자!! 영상최고!!
@호야호야
@호야호야 3 жыл бұрын
flex-grow 속성 설명을 아무리 읽어도 제대로 이해가 안 갔는데 강의를 봤더니 이제야 뭔지 알 것 같아요! flex 너무 편해보이는데 속성이 많아서 헷갈리네요ㅋㅋ 그리고 제가 맨날 height 값에 % 쓸 때마다 값이 제대로 안 들어가서 헤맸었는데 오늘 그 이유를 확실히 이해하게 되었습니다!!! 늘 명쾌한 설명에 감동하고 가요...❤️
@dream-coding
@dream-coding 3 жыл бұрын
Code your Dream ✨
@junginkang4365
@junginkang4365 2 жыл бұрын
UI/UX 디자이너입니다. CSS의 개념에 대해 좀 더 알고 싶어서 보고 있는데 너무 이해하기 쉬워요 업무가 바빠서 생각 날때만 가끔 보고 있어요ㅠ 언젠가 마무리할 수 있도록 ...ㅠ
@user-mh7is1op6b
@user-mh7is1op6b 3 жыл бұрын
이태까지 맨날 힘들게 table로 만들었는데 flexbox 인제 알았네요 정말 감사합니다!!
@user-dm4td1tw7s
@user-dm4td1tw7s 4 жыл бұрын
대박... basis라든가 grow라든가.... 처음 접했을때 이해안가던게 탁 이해가네요ㅠㅠ 감삽합니다!
@codired_4716
@codired_4716 4 жыл бұрын
출석체크 ! 집중력 짧아서 ㅠㅠ 강의들으며 의자 빙빙 돌리기 시작할때 거의 다왔어요 여러분 힘내세요 ! 이러서셔 ㅋㅋㅋ 엌 타이밍 너무 잘 맞추셨어용 힘내서 다시 집중해서 들었습니당 ㅎㅎ 다음영상도 챙겨보겠습니당
@GGCKnights
@GGCKnights Жыл бұрын
오늘도 도움많이됐어요. 항상감사합니다. :)
@csjeong2003
@csjeong2003 4 жыл бұрын
CSS Flexbox 강의를 정말 잘하시네요 알아듣기 정말 쉽네요 감사합니다
@dream-coding
@dream-coding 4 жыл бұрын
좋은 피드백 정말 감사합니다 🤗
@user-px8gs8fl4c
@user-px8gs8fl4c 3 жыл бұрын
영상 끝날때마다 게임으로 감을 잡을수 있게 선물 주셔서 좋아요.
@muvw8342
@muvw8342 Жыл бұрын
엘리님의 html css 강의 듣고 듣고 있어요 이 강의를 좀 더 일찍 만났다면 얼마나 좋았을까 하는 아쉬움이 너무 큰 좋은 강의에요 이렇게나 멋진 강의를 만들어주서수 감사합니다 got it? 하고 말하실 때 마다 got it!!! 하고 수줍게 답하며 듣는 학생입니다 헤햇
@chap_mycat
@chap_mycat 2 жыл бұрын
드림코딩은..찐이다 좋은 강의 정말 감사합니다 이해가 쏙쏙 돼서 공부하는 게 즐거워요!!!!!
@eunchullee6207
@eunchullee6207 4 жыл бұрын
출석이요. 개념을 머리속에 집어 넣어 주는 영상 감사합니다.
@dream-coding
@dream-coding 4 жыл бұрын
하하 센스 코멘트 감사합니다 ❤️
@kangmunjung5483
@kangmunjung5483 2 жыл бұрын
Flexbox 개구리 게임... 대박이네요!... 이거 하다가 막히면 (저 같은 초보에게는 어렵긴 하지만,) 엘리멘토님 강의 다시보고, MDN 확인하면 공부됩니다. 또 감사감사해요~ 복 많이 받으실꺼에요^^
@jollyholy620
@jollyholy620 2 жыл бұрын
flex 봐도 잘 모르겠더니 제가 큰 그림을 이해하지 못했었네요 ㅠㅠ... 삽질만하다가 엘리님 덕분에 저도 잘 정리할 수 있었어요! 감사합니다 ㅎㅎㅎ
@user-yw7vw3nv6m
@user-yw7vw3nv6m 4 жыл бұрын
CSS 강의도 완강했습니다. CSS도 정리가 잘 되었고 새로 알게된 것들도 많아서 도움이 많이 되었습니다. 선물로 주신 게임 2가지도 틈틈히 해서 익숙해질 수 있도록 해야겠어요. 좋은 강의 정말 감사드립니다.
@dream-coding
@dream-coding 4 жыл бұрын
항상 코멘트 감사드려요 ❤️ 선물 받으신거 꼭 열어 보시고 형준님껄로 만들어 보세요 🙌
@user-jf7ud1xk5n
@user-jf7ud1xk5n 2 жыл бұрын
html css 편 다 봤습니다. 이젠 실습이 많이 필요하겠네요 감사합니다 !
@Blue-bx9lh
@Blue-bx9lh 4 жыл бұрын
쏙쏙 이해가 잘 되네요. 어려운 부분은 더 찾아봐야겠어요. 좋은 영상 감사합니다💙
@coxld010
@coxld010 4 жыл бұрын
클론코딩 강의 들어가기 전에 유튜브 강의 듣고 있는데 너무너무 유익하고 재밌어요
@dream-coding
@dream-coding 4 жыл бұрын
보시는 영상마다 출석 체크 감사해요 ❤️
@hahnyg5148
@hahnyg5148 Жыл бұрын
좋은 강의 정말감사드려요~!!
@shp7408
@shp7408 3 жыл бұрын
flexbox 완전 깡패네요~~ 다 들었습니다!!
@user-nw7pm2lw7i
@user-nw7pm2lw7i 4 жыл бұрын
flex-grow로 세 개 div를 2, 1, 1해줄경우 사실상 2대1대1비율 아니라는 부분 설명이 없어서 조금 아쉽네요.. flex-basis: 50%, 25%, 25%로 해주면 2대1대1비율이 되지만.. grow로 적용이 되려면 셋다 basis:0으로 맞춰줘야 하더라구요.
@dream-coding
@dream-coding 4 жыл бұрын
오 좋은 포인트예요 🙌 안그래도 이전 영상 positio에서도 relative와 absolute를 설명할때 원래 박스에서 나오는걸 조금 강요해서 설명할걸.. 이번영상은 카두룩치님께서 말씀하신 grow와 basis를 조금더 깊에 다뤄볼껄 아쉽더라구요 🤣 아쉽게도 유튜브에 이미 올라온 연상이 수정이 안되어서 대신 카두룩치님의 코멘트를 Pin해 놓을께요 🤗 앞으로도 이렇게 피드백 정말 부탁드려요 🙌
@soook3645
@soook3645 4 жыл бұрын
flex-grow로 세 개 div를 2, 1, 1해줄경우 사실상 2대1대1비율 아닌 이유는 div안의 컨텐츠를 제외한 여백을 2:1:1로 나누어 가지기 때문이라고 알고 있습니다. 그래서 님 말씀대로 basis를 0으로 맞춰야 div자체의 크키가 2:1:1로 맞춰지는 이유이죠!
@user-mv5ev8pe5p
@user-mv5ev8pe5p 4 жыл бұрын
덕분에 하나 더 배워갑니다. 감사합니다 :)
@user-it3vp6lp3s
@user-it3vp6lp3s 3 жыл бұрын
강의 잘 들었습니다, flex 다시 한번 정리하는데 많은 도움이 되었습니다. 손에 익혀야 겠네요, 좋은 강의 감사드립니다. 새해 복 많이 받으세요 ^^
@user-vq2wn6nt9d
@user-vq2wn6nt9d 2 жыл бұрын
뒤에 게임으로 배우는 복습이 유익하네요~ 기억안나면 엠디엠인가보면서합니다~~ 요령을 가르쳐줘서고마워요~
@gindesign5496
@gindesign5496 2 жыл бұрын
예시까지 화면으로 세세히 볼 수 있다니,, 정말 최고... 구독 눌렀습니다!
@불닭비빔면
@불닭비빔면 4 жыл бұрын
좋은 내용 감사합니다. 개구리들을 모두 수련에 잘 보내줬어요!
@dream-coding
@dream-coding 4 жыл бұрын
하하 수련에 잘 갔나요 🐸
@goodwon593
@goodwon593 3 жыл бұрын
항상 궁금했던 내용인데, 감사합니다 ^^
@michaeloh3728
@michaeloh3728 4 жыл бұрын
엘리 전에도, 다른 강의를 통해 flex박스에 대한 이론적인 것들은 학습했었는데 잘 이해가 가지 않았었어요. 그런데 오늘 2가지 container/item 꾸며주는 값, 그리고 메인축과 반대축, row/ column 으로 크게 이해하고 나니 이해가 쉽네요! 개구리들과 재미있게 flex 공부하고 있네요~ ㅎㅎ 고맙습니다. :0
@dream-coding
@dream-coding 4 жыл бұрын
오웃! 이제 이해가 되신다니 ❤️ 중요 포인트만 이해하시면 나머지는 개구리 게임이나 직접 실습하시면 더 감이 많이 오실거예요 🙌
@hogoonlee8391
@hogoonlee8391 2 жыл бұрын
숙제라고 하셨지만 저에게는 아주 큰 선물이 된 것 같습니다! 선물을 잘 쓸 수 있도록 계속 공부해야겠어요!!! 항상 좋은강의 감사합니다!
@user-py3uv8hu7l
@user-py3uv8hu7l 2 жыл бұрын
오랜만에 flex를 사용하게 되었는데 또 헷갈려서 또 복습하러 왔어요... 헤헤... 너무 좋은 강의예요
@user-rc4tb7ej4m
@user-rc4tb7ej4m 3 жыл бұрын
정말 감사합니다. 정말로 도움이 많이 되는 영상입니다.
@funppun4234
@funppun4234 4 жыл бұрын
역시, 설명을 참 이해되기 쉽게 이쁜 목소리로 잘 하시네요..
@dream-coding
@dream-coding 4 жыл бұрын
아잇 :) 좋은 피드백 감사합니다 ❤️
@ping_5848
@ping_5848 Жыл бұрын
엘리님 강의 너무 잘 들었습니당 ㅠ 가려운곳 계속 긁어주셔서 너무 시원해요 연습도 열심히 할게요!!
@chanmigracelee8892
@chanmigracelee8892 3 жыл бұрын
채널 구독했어요! 이제막 공부시작했는데 도움이 많이 됩니다. 감사합니다 :)
@jia639
@jia639 4 жыл бұрын
CSS강의 모두 잘 봤어요! 내용도 유익하고 설명도 쏙쏙 이해가 가게 잘 해주셔서 강의가 지루할 틈이 없습니다. 감사해요 ㅎㅅㅎ
@dream-coding
@dream-coding 4 жыл бұрын
좋은 피드백 남겨 주셔서 정말 감사합니다 ❤️
@user-eh5mj3sg4f
@user-eh5mj3sg4f 3 жыл бұрын
출첵!! 갓엘리♥ 개구리 귀여워요
@jongtaekpark2606
@jongtaekpark2606 4 жыл бұрын
좋은 강의 감사합니다. 주변 동료에게도 꼭 추천 하겠습니다.
@dream-coding
@dream-coding 4 жыл бұрын
추천해주신다니 ❤️
@whiteseal5775
@whiteseal5775 4 жыл бұрын
아이고 엘리님 영상 다 봐야겠어요 아는거겠지 해도 꿀팁이 상당하고 배울게 많다는걸 느끼네요 ㅎㅎ고맙습니다!
@dream-coding
@dream-coding 4 жыл бұрын
ㅇ ㅏ 그런가요? 🥰 감사합니다
@humors_storage
@humors_storage 4 жыл бұрын
justify-content와 align-items 이 두가지를 구별되지 않았는데 강의 듣고 구별되어 기뻐요 출석체크 합니다. 🙏
@dream-coding
@dream-coding 4 жыл бұрын
오웃! 이제 구분 하실 수 있으시다니 ❤️
@user-bz9ul7ei8b
@user-bz9ul7ei8b 4 жыл бұрын
출석 체크합니다. 코드만 볼 때는 이해가 안 되었는데 이렇게 개념부터 잡아주셔서 너무 좋아요!!
@dream-coding
@dream-coding 4 жыл бұрын
아~ 정말요? 개념부터 설명하길 잘했네요 🤗 좋은 피드백 정말 감사합니다 🙏🏼
@mimisohn
@mimisohn 4 жыл бұрын
정말 개념 하나도 모르는데 너무 쏙쏙 잘들어오게 설명해주셔서 감사해요 ㅠㅠ 강의들 넘나 좋아요..❤️ 첨으로 알람설정도 하게되네요 ㅎㅎ
@nazunamoe
@nazunamoe 4 жыл бұрын
마지막에 소개해준 게임 덕분에 개념 이해가 더 잘되는 것 같아요 너무 고마워요
@dream-coding
@dream-coding 4 жыл бұрын
저두 감사합니다 ❤️
@mshealing68
@mshealing68 4 жыл бұрын
제게 정말 많은 도움이 되었어요. 감사합니다. 특히 게임을 통한 연습은 너무 좋은데요. 반복해서 숙달될때까지 하고 있어요.^_^
@sunny2995
@sunny2995 4 жыл бұрын
출첵입니다~! CSS까지 강의를 들으니까 이제 어떻게 활용하면 좋을지 생각을 하고 있더라구요ㅎㅎ 오늘 강의도 개념이 쏙쏙 들어오는 아주 유익한 시간이었고, 숙제하면서 익숙하게 익히고 다음 강의로 넘어갈게요! 감사합니다❤️
@dream-coding
@dream-coding 4 жыл бұрын
이런 정성스러운 출책 감사해요 ❤️
@Lucky-yc2su
@Lucky-yc2su 4 жыл бұрын
이번 CSS flexbox 영상도 감사히 잘 봤습니다 출첵!
@dream-coding
@dream-coding 4 жыл бұрын
여기서도 코멘트 남겨 주셔서 감사해요 🙌
@yiwon4457
@yiwon4457 2 жыл бұрын
매번 강의마다 적절한 예시와 설명 그리고 유용한 사이트들을 알려주셔서 감사해요!
@yeomkyeokyeo
@yeomkyeokyeo 4 жыл бұрын
너무 대박이네요ㄷㄷ 맨날 flexbox 공부해야지 하다가 찾아봤는데 바로 이해됐어요! 감사합니다 엘리😄
@user-lo3lc6ti3n
@user-lo3lc6ti3n 4 жыл бұрын
대박 제가 찾던 css 입니다! 네비바를 float를 사용해서 정렬했을때 뭔가 부족하고 답답했는데 이거였네요!ㅋㅋ 이제 여기에서 프론트 기본기 다집니다:) 감사합니다!
@user-fx4ie5zi4x
@user-fx4ie5zi4x 3 жыл бұрын
와... 이렇게 은혜롭고 자비로운 강의 감사합니다ㅠㅠㅠㅠㅠ 절 구원해 주셨어요ㅠㅠㅠㅠ
@sanghyeonyoon818
@sanghyeonyoon818 2 жыл бұрын
드디어 백엔드로써 flexbox를 이해하게 되었습니다. 여러 웹사이트에서는 오뎅꼬치를 예로 들고 있는데요. 이해가 되지 않았습니다. ㅜ.ㅜ;;; 중심축과 반대축으로 설명을 들으니 정말 이해가 잘되었습니다. 진심으로 감사합니다.
@choimichelle110
@choimichelle110 2 жыл бұрын
엘리님 설명 듣고나서 플렉스박스 프로기 게임으로 연습하니까 너무너무 머리속에 쏙쏙 들어와요~ 늘 감사드려요~
@mkshingod
@mkshingod 3 жыл бұрын
flexbox froggy의 마지막문제 24번문제 답입니다. justify-content:center; flex-direction:column-reverse; flex-wrap:wrap-reverse; align-content:space-between
@user-hj9zl1xj3j
@user-hj9zl1xj3j 4 жыл бұрын
정말 도움이 되는 강의에요! 문서로 읽었을 때 잘 와닿지 않았는데 설명해 주시는 것 들으면서 읽으니 감이 좀 잡히네요 ㅎㅎ 감사합니다~
@dream-coding
@dream-coding 4 жыл бұрын
제 강의로 감이 잡힌다니 다행이예요 🙌 완전 뿌듯하네요 ㅋㅋㅋㅋㅋ 🥰
@deankho2654
@deankho2654 4 жыл бұрын
항상 강의 퀄리티에 놀라고 감사함을 느껴요!
@dream-coding
@dream-coding 4 жыл бұрын
오웃 저두 항상 코멘트 감사드려요 ❤️
@user-ku7zg2yz2d
@user-ku7zg2yz2d 2 жыл бұрын
다양한 설명 글들과 강의를 봤는데 이 시리즈가 가장 이해도 잘되고 좋네요 ㅠㅠ 진작에 이걸 봤어야했는데!
CSS Grid 완전 정리 끝판왕 😎
21:03
드림코딩
Рет қаралды 64 М.
Challenge matching picture with Alfredo Larin family! 😁
00:21
BigSchool
Рет қаралды 38 МЛН
天使救了路飞!#天使#小丑#路飞#家庭
00:35
家庭搞笑日记
Рет қаралды 80 МЛН
Look at two different videos 😁 @karina-kola
00:11
Andrey Grechka
Рет қаралды 14 МЛН
Learn Flexbox CSS in 8 minutes
8:16
Slaying The Dragon
Рет қаралды 1,5 МЛН
CSS Flexbox와 CSS Grid, 한번에 정리!
35:31
1분코딩
Рет қаралды 81 М.
개발자로 성공할 수 있는 딱 하나의 기술 😆
15:34
드림코딩
Рет қаралды 68 М.
웹개발자면서 이것도 모름? | DOM과 CSSOM, 렌더링 과정
34:02
코딩알려주는누나
Рет қаралды 13 М.
Challenge matching picture with Alfredo Larin family! 😁
00:21
BigSchool
Рет қаралды 38 МЛН