HTML과 CSS, 자바스크립트 기초를 아는 분들은 바로 시작하실 수 있어요. 앞으로의 우리 인터랙티브 웹 개발 여정을, 기본기 탄탄하게 시작할 수 있는 과정입니다.
₩41,250
₩55,000
30% 할인
6개 남음•전체 구매 적용쿠폰 받기
로드맵 코스
크리에이티브 넘치는 인터랙티브 웹 페이지!
1분코딩과 함께 제대로 불태워요 🔥
이 로드맵과 함께라면,
당신도 이런 페이지 개발 가능! 💻
역동적인 인터랙티브 웹 페이지 개발, 먼 이야기가 아닙니다.
1분코딩과 함께 천천히 하나하나 배워볼까요?
.gif)
이 모든 내용을
로드맵으로 한 번에 알려드려요 🔎
1️⃣ 인터랙티브 웹 개발 시작하기
1 CSS 변환과 애니메이션, CSS Flex, 3D
2 인터랙비트 웹 개발을 위한 자바스크립트
3 객체의 정의와 활용
4 스크롤 다루기
5 Transition / Animation 이벤트
6 전진! 3D 스크롤 실습
2️⃣ CSS Flex / Grid 익히기
1 Flex 핵심 정리
2 Flex UI 만들기
3 Flex로 반응형 페이지 만들기
4 Grid 핵심 정리
5 Grid로 반응형 페이지 만들기
6 Grid 활용 예제 실습
3️⃣ SVG (Scalable Vector Graphics) 마스터
1 SVG의 개념과 기본 사용법
2 CSS와 자바스크립트 적용하기
3 그리기, 텍스트, 각종 효과
4 Stroke, SMIL 애니메이션
5 아이콘 폰트 만들기
6 인터랙티브 SVG : 몬스터 애니메이션 만들기
4️⃣ 3D 리플릿 제작
1 프로젝트 소개
2 소스코드
3 템플릿 문자열
4 루프 처리하기
5 자바스크립트 이벤트 위임
6 3D 리플릿 만들기
.gif)
5️⃣ 애플 웹사이트 구현하기
1 스크롤을 이용한 인터랙션 구현
2 고해상도 비디오 인터랙션
3 동적 위치를 고려한 스크롤 인터랙션 구현
4 더 부드럽게 동작하는 고화질 비디오
5 Transition / Animation 이벤트
6 SVG 애니메이션을 이용한 로딩 만들기
안녕하세요. 1분코딩입니다! 😎
제 입으로 이런 말 하기 쑥스럽지만...수강평 790개 ⭐평균 5점 만점 강사랍니다😅
안녕하세요, 페이스북과 유튜브 1분코딩을 운영하고 있는 유준모입니다.
평소에 유튜브 등에서 주로 시각 구현에 관련된 인터랙티브 웹 강의들을 하다보니, 자연스럽게 코딩에 관심이 많은 디자이너분과 디자인에 관심이 많은 개발자분들이 자주 방문합니다.
최근 Awwwards나 FWA같은 해외 웹 어워드의 수상작들을 보면, 한결같이 '이런 건 도대체 어떻게 만드는 거지?'라는 생각이 들 정도로 신기하고 놀랍습니다. 자바스크립트 문법을 잘 안다고, 또는 최근 잘 나가는 프론트엔드 라이브러리를 공부한다고 그런 화려하고 임팩트있는 웹사이트를 만들어낼 수 있는 것은 아니거든요.
웹 인터랙션은 할 줄 아는 사람은 많지만 잘 하는 사람은 정말 드문 분야입니다. 실무에서는 생산성이 중요하므로 좋은 라이브러리를 찾아 잘 쓰는 것도 중요하지만, 원천 기술과 구현 원리에 대한 이해가 중요한 분야 중 하나입니다.
눈에 보이는 동작은 같아도, 바닥부터 직접 만드는 방법을 훈련한 개발자는 숙련도부터 다릅니다.
바닥부터 직접 구현하는 방법을 알려드릴게요! 고급 인터랙티브 엔지니어로 성장하실 수 있도록 도와 드리겠습니다. 강의에서 뵙겠습니다 :)
로드맵 상세보기
총 6개 코스
원하는 형태의 레이아웃을 세밀하게 구현하는 능력은 생산성과 페이지의 완성도에 큰 영향을 미쳐요. 디자인과 구현에 모두 자유와 편리함을 안겨주는 Flex와 Grid를 배우면 아주 강력한 무기가 됩니다.
₩37,120
₩49,500
인프런
SVG 마스터현대의 웹페이지 그래픽 표현에 널리 쓰이는 벡터 그래픽 포맷인 SVG를 처음부터 파헤쳐보는 수업입니다. 기본 SVG의 개념, 사용법부터 애니메이션, 여러가지 효과들, 스크립트 인터랙션까지 다룹니다.
₩20,620
₩27,500
인터랙티브 웹 프로젝트 시리즈는 창의적인 인터랙션의 예제 하나씩, 완전히 파헤치며 여러가지 개념들을 응용하고 확실하게 익힐 수 있는 실전 예제 강의에요.
₩12,370
₩16,500
애플 웹사이트의 화려하고 고급스러운 인터랙션을 표준 웹 기술만을 이용해 한 땀, 한 땀 직접 만들어 봅니다. 난이도가 조금 있지만, 원리부터 이해하고 응용할 수 있도록 최대한 자세히 구성했습니다.
₩57,750
₩77,000
Web Animation API는 CSS로 만들던 웹 애니메이션 기능을 자바스크립트로 파워풀하게 확장한 표준 스펙입니다. 웹 애니메이션의 최신 표준 기술에 남들보다 빨리 익숙해져보세요!
₩49,500
₩66,000