Thumbnail
개발 · 프로그래밍 웹 퍼블리싱

순수하게 html/css/js만을 활용한 반응형 웹 제작 [실전편] 대시보드

(5)
1개의 수강평 ∙  21명의 수강생

59,400원

지식공유자: 영코디 킴쌤
총 14개 수업 (5시간 10분)
수강기한: 
12개월
수료증: 발급
난이도: 
입문
-
초급
-
중급이상
지식공유자 답변: 미제공
폴더에 추가 공유

초급자를 위해 준비한
[웹 퍼블리싱, 웹 개발] 강의입니다.

부트스트랩(BOOTSTRAP)을 사용하지 않고 순수하게 html/css/js 만을 활용하여 디바이스별로 다양한 레이아웃을 구현할 수 있는 반응형 웹페이지 만들기[2024년 최신판] 수업의 실전 제작수업입니다.

✍️
이런 걸
배워요!
html을 활용하여 웹의 구조 생성하기
css3를 활용하여 구조에 스타일 입히기
js를 활용하여 클릭이나 스크롤같은 사용자의 이벤트시 동작하는 요소 만들기
@mediaquery를 이용하여 디바이스별로 스타일 다르게 변경하기
HTML/CSS/jQuery를 활용한 반응형 웹페이지 / 웹앱 / 웹 디자인 실제 제작하기
디바이스 장치에 따라 레이아웃이 바뀌는 반응형 웹 실무 메인 페이지를 clonning 해요
부트스트랩의 최대의 단점인 판박이처럼 찍어내는 비슷한 디자인과 구성요소를 활용하는 것이 아닌, 본인이 원하는 유니크한 반응형 웹 실무 사이트 싱글 페이지를 직접 코딩을 하여 제작해봐요

이런 분들께 추천드려요!

🎓
학습 대상은
누구일까요?
HTML/CSS를 활용한 반응형 웹페이지/웹앱 개발에 관심있는 분
직접 실전 페이지를 만들면서 코딩공부를 시작하려는 분
직접 자유롭게 기획한 스타일의 웹페이지를 만들고자 하는 분
부트스트랩 사용은 가능하나 원하는 스타일이나 동적인 구현의 커스터마이징에 어려움이 있는 분
부트스트랩(BOOTSTRAP)을 활용한 반응형 웹페이지 만들기[2024년 개정판]을 수강하고 실전편으로 넘어가고 싶은 분
프론트 엔드 분야로 취업을 하기위해 반응형 포트폴리오를 제작하려는 취업 준비생
📚
선수 지식,
필요할까요?
html5, css3, js 이론에 대한 기본지식

안녕하세요
영코디 킴쌤 입니다.
영코디 킴쌤의 썸네일

안녕하세요. [ 비전공자도 쉽고 재미있게 배우는 코딩! ] 을 목표로 15년 넘게 풀스택[백엔드, 프론트엔드], 빅데이터, 머신러닝 수업 및 영상, 코딩, 디자인을 강의하며 개발자 인력양성에 진심인 현직 직업훈련교사 김세지 입니다.

부트스트랩3(BOOTSTRAP)를 활용한 반응형 웹페이지 만들기 구독자 약 10만명 구독을 기념으로, 그동안 DM으로 [BOOTSTRAP4 강의]와 [부트스트랩을 활용한 실무 웹페이지 만들기 실습강의]에 추가 강의 요청 주셨던 많은 분들에 감사드리며 새로운 강의들을 기획 제작 및 업로드 예정입니다.

느리지만 차근차근 질좋은 강의로 한걸음씩 여러분과 함께하겠습니다.

image

커리큘럼 총 14 개 ˙ 5시간 10분의 수업
이 강의는 영상, 첨부 파일이 제공됩니다. 미리보기를 통해 콘텐츠를 확인해보세요.
섹션 0. 순수하게 html/css/jQuery만을 활용한 반응형 웹페이지 만들기 실전편[2024년 최신판]
step01 @미디어쿼리를 활용한 초간단 반응형 레이아웃 맛보기 미리보기 43:08
step02 반응형 사이트 클론코딩의 html 구조 만들기 25:52
step03 공통된 스타일부터 먼저 스타일링하기 18:10
step04 상단 네비게이션 스타일 만들기 15:56
step05 스크롤시 네비게이션의 종류 동적으로 변경하기 33:03
step06 회전목마처럼 컨텐츠가 돌아가는 캐로셀 제작하기 22:57
step07 자동으로 변경되는 캐로셀 활성화 버튼과 버튼 클릭시 캐로셀 동작이 충돌하는 부분 해결하기 19:30
step08 디바이스 사이즈에 따라 사이즈가 줄어드는 메뉴 컨텐츠 미리보기 15:54
step09 디바이스 사이즈에 따라 레이아웃의 위치가 바뀌는 [스토리] 컨텐츠 19:53
step10 디바이스 사이즈에 따라 레이아웃의 모양이 바뀌는 [브랜드 철학] 컨텐츠 13:11
step11 디바이스 사이즈에 따라 사진의 위치가 바뀌는 [성분] 컨텐츠 14:53
step12 디바이스 사이즈에 따라 보이고 숨겨지는 [more] 컨텐츠 16:23
step13 스마트폰에서는 토글 컨텐츠로 바뀌는 [footer] 컨텐츠 24:03
step14 클릭시 혹은 스크롤시 활성화되는 네브바의 동적 메뉴를 스크립트로 완성하기 28:02
강의 게시일 : 2024년 02월 29일 (마지막 업데이트일 : 2024년 03월 06일)
수강평 총 1개
수강생분들이 직접 작성하신 수강평입니다.
VIEW 추천 순 최신 순 높은 평점 순 낮은 평점 순 평점 순 높은 평점 순 낮은 평점 순
코린이 thumbnail
5
로드맵에 따라 1.부트스트랩의 이해 2.부트스트랩 실습 3.부트스트랩 없이 반응형 만들기까지 모두 듣길 잘한 것 같습니다 웹제작을 하려는데 요즘엔 다 반응형으로 웹을 만든다고 해서 마음먹고 시작했는데 기본개념도 없던 제가 일주일 정도 만에 반응형 웹 제작에 대해 완벽하게 이해했습니다 특히 실습부분을 따라하며 웹페이지를 만들어가면서 강의를 들으니 반응형 웹을 만드는 스킬과 노하우가 나도 모르게 생깁니다 한번 더 들으면서 복습해보려고 합니다 웹페이지 제작을 위해서 추천하는 강의 중 가성비 가 가장 좋은 강의입니다
2024-03-21