49,500원
입문자를 위해 준비한
[웹 개발, 웹 퍼블리싱] 강의입니다.
이 강의를 통해서 HTML, CSS 기본을 다질 수 있습니다.
✍️
이런 걸
배워요!
이런 걸
배워요!
HTML
CSS
웹 개발자 필수 지식 HTML, CSS!
이 강의로 웹 개발 기초를 꽉 잡아봐요 🔥
HTML/CSS의 기초부터 실무까지 🗂️
HTML과 CSS. 개발에 관심이 있거나 현재 개발을 하는 분들이라면 누구나 들어보셨을 거예요. HTML과 CSS는 웹 개발의 가장 기본이라고 하죠. 웹 개발을 시작하는 분들은 물론, 이미 실무에 있는 현직 개발자분들께도 중요한 기초지식이에요. 실무에 있는 개발자도 HTML, CSS의 구체적인 부분을 간과하고 지나가는 경우가 생각보다 많거든요. 저와 함께 웹 개발의 기초를 튼튼하게 다져봐요! 💪
이 강의를 통해서 HTML, CSS의 기초부터 실무에서 쓰이는 대부분의 기술까지 익혀보세요. 개발 자체를 처음 접하는 사람들도 이 강의로 웹 개발의 기본적인 지식을 습득하실 수 있습니다.
이 강의는 개념을 학습한 후 바로 실습해보면서 HTML CSS의 대부분의 지식을 한 번에 습득할 수 있도록 만들었습니다. 기초부터 하나씩 배워서 좀 더 다양한 HTML, CSS 기술을 사용할 수 있게 도와드릴게요. 웹 개발자로서는 필수인 HTML과 CSS를 배워서 취업에도 많은 도움이 되었으면 좋겠습니다.
이런 분들께 추천해요 🙋
입문자
"개발을 공부하고 싶은데
뭐부터 해야 할지 모르겠어요."
실무자
"개발자로 일하고 있는데
HTML과 CSS를 항상 쓰던 것만 쓰게 돼요."
이 강의만의 특장점 ✨
구조적 이해를 돕는
도표 중심의
쉽고 자세한 설명
직접 소스 코드를
작성하면서
자연스럽게 반복 학습
실제 애플리케이션을
만들어볼 수 있는
실습 중심의 강의
1-2. 도표를 통한 시각적 설명 + 직접 코드 작성의 2단계!
도표를 통해서 시각적으로 봤을 때 그냥 설명을 듣기만 했을 때보다 이해가 더 잘 되기 때문입니다. 또한 이렇게 도표를 통해서 학습한 후 소스 코드를 작성하므로 자연스럽게 복습하는 효과가 나타난다고 생각합니다.
3. 따라 하며 배우세요, 실습 중심 강의
먼저 필요한 개념을 익힌 후에 실습으로 개념을 더욱 확실하게 해줍니다.
이런 걸 배워요 📚
#전체 내용
#1 HTML Basics
#2 CSS Basics
#3 간단한 버튼을 만들며 CSS 배우기
#4 Flexbox, Grid, Display
#5 유튜브 사이트 만들기
#6 인스타그램 사이트 만들기
예상 질문 Q&A 💬
Q. 비전공자도 들을 수 있는 강의인가요?
기초부터 자세하게 강의하기 때문에 비전공자도 들을 수 있습니다.
Q. 왜 HTML, CSS를 배워야 하나요?
웹 개발자라면 무조건 사용하기 때문에 가장 기본이 되는 부분이라 생각해주시면 됩니다.
Q. 강의를 듣기 전 준비해야 할 것이 있나요?
입문 강의이기 때문에 사전 지식 없이도 들을 수 있습니다.
지식공유자의
다른 강의가 궁금하다면?
누적 수강생 55,000+명, 따라하며 배우는 웹 개발 시리즈 📖
이런 분들께 추천드려요!
🎓
학습 대상은
누구일까요?
학습 대상은
누구일까요?
코딩을 처음 접하는 사람
HTML 기본을 다지고 싶은 사람
CSS 기본을 다지고 싶은 사람
안녕하세요
John Ahn 입니다.
John Ahn 입니다.
안녕하세요.
즐겁게 개발하고 있는 개발자입니다.
앞으로 많은 도움을 드릴 수 있었으면 좋겠습니다.
- 따라하며 배우는 도커와 CI환경 저자
- 카카오 기업 신입 공채 FE 교수자
- 패스트캠퍼스, 구름 강사
- 현대자동차 개발 기업 교육
- 신한은행 메타버스, 코빗 타운 풀스택 개발
- 여러 공공기관 SNS 풀스택 개발
커리큘럼
총 56 개
˙ 8시간 26분의 수업
이 강의는 영상, 수업 노트, 첨부 파일이 제공됩니다. 미리보기를 통해 콘텐츠를 확인해보세요.
섹션 0. 강의 자료
2 강
소스 코드 자료
강의 도표 자료
섹션 1. HTML Basics
6 강
∙ 45분
강의 소개
미리보기
01:26
학습을 위해 필요한 프로그램들
01:37
HTML(Hyper Text Markup Language) 개념 및 구성요소
18:10
시맨틱 요소(Semantic Elements) 에 대해서
05:06
HTML 문서 기본 구조
05:10
HTML 기본 태그와 역할
13:57
섹션 2. CSS Basics
4 강
∙ 24분
CSS 란 무엇인가요?
미리보기
06:07
CSS 속성들
06:15
색을 표현하는 방법
04:08
수치 값을 표현하는 방법
07:58
섹션 3. 간단한 버튼을 만들면서 HTML CSS 배우기
14 강
∙ 1시간 47분
A 버튼 만들기(class 속성, transition)
15:01
가상 클래스(의사 클래스)
13:16
가상 요소(의사 요소)
05:36
Float CSS
06:42
Clear CSS
05:59
B 버튼 만들기
04:22
C 버튼 만들기(box-shadow)
05:04
크롬 개발자 도구
01:47
Margin, Padding, Border(CSS Box Model)
04:46
Text 스타일링하기
09:00
Image, Input 요소
10:14
Transform
08:49
animation CSS
09:58
background-clip
06:52
섹션 4. Flexbox, Grid, Display
13 강
∙ 2시간 1분
Flexbox
05:37
flex-direction, flex-wrap
12:16
flex-flow, justify-content, align-items
11:08
align-content, align-self
08:02
flex item order
04:40
flex-grow, flex-shrink
12:01
flex-basis, flex
03:29
Grid CSS
15:44
display: table
08:46
Position CSS
19:26
Z-index
12:41
Media Query
05:53
CSS 적용 우선순위
02:02
섹션 5. 유튜브 사이트 만들기
6 강
∙ 1시간 2분
유튜브 사이트 기본 구조 생성하기
미리보기
06:26
Header 생성하기
14:37
Header 중간 부분 생성하기
17:35
Header 오른쪽 부분 생성하기
03:45
Sidebar 생성하기
06:29
비디오 생성하기
13:57
섹션 6. 인스타그램 사이트 만들기
11 강
∙ 2시간 24분
만들게 될 인스타 앱 소개하기
미리보기
00:46
기본 구조 생성하기
05:09
Header 생성하기
16:45
메인 컨테이너 구조 잡기
15:30
스토리 생성하기
13:26
포스트 생성하기
19:56
사이드 생성하기
17:09
Box Sizing 속성
07:05
사용자 지정 속성(CSS Variable)
10:59
Dark Mode
22:18
SVG(Scalable Vector Graphics)
미리보기
15:21
강의 게시일 : 2022년 12월 09일
(마지막 업데이트일 : 2023년 01월 21일)
수강평
총 28개
수강생분들이 직접 작성하신 수강평입니다.
4.9
28개의 수강평
5점
4점
3점
2점
1점
VIEW
추천 순
최신 순
높은 평점 순
낮은 평점 순
평점 순
높은 평점 순
낮은 평점 순
내용을 구체적으로 전달하시기보다는 계속 읽으시고 특히 마지막 프로젝트는 코드를 읽으면서 치기만 하셔서 크게 도움이 되었다는 느낌은 많이 안 들었습니다 ㅠ 보통 앞에 기초 하고 뒤에 프로젝트 하면 기존에 배운 것들을 어떻게 응용하고 어떻게 활용하는지도 알려주시면서 이런 기능에서 함께 다루면 좋은 다른 코드도 함께 알려주시는데 이 프로젝트는 정말 코드 줄줄 읊으면서 받아적기 뿐이네요. 그리고 생기초가 알아듣기에는 힘든 내용인 것 같아요. 저도 어느 정도 기반이 있는 상태에서 들어서 다행이지 생기초인 상태에서 이거 들으면 힘들겠어요
2023-11-28
수강들으면서 제 디자인의 꿈을 키우고있어여, 개발과정에만 집중하다 이런 강의도 배우니, 커리어가 상승하는 느낌과 동시에 디자인적인 재미까지 더해가는 것같아 즐겁네요!
2022-12-23
독학으로 혼자 공부했고 추가적으로 릴스나 유튜브를 활요하여 많이 공했었지만, 기본적으로 사용가능한 구도나 밸런스를 잘 모르고 있었던 것 같습니다. 그래서 이번 계기로 재대로 배워서 마음을 놓았습니다.
2024-02-06
html css 기초지식이 부족했었는데 이 강의 듣고나니까 이해가 잘됩니다. 어떤 요소들이 있고 각자 스타일링을 어떻게 해야하는지 폭넓게 강의해주십니다.
2023-01-13
초심자에게도 어울리는 강의 였습니다.
2024-02-07
연관 로드맵
이 강의가 포함된 잘 짜여진 로드맵을 따라 학습해 보세요!
