강의 개요

JavaScript 와 jQuery를 활용한 UI 기초부터 실무활용

 강의 특징

• - 이론과 실습을 분리하지 않고 준비된 학습 시나리오를 가지고 다양한 예제와 실습, 설명을 통해 진행
• - UI구현 기술부터 클라이언트 즉 코드를 직접 하드코딩으로 배우는 실무과정
• - Javascript의 기초문법을 이해하고 직접 코드를 만들어서 UI를 제어하는 기술 습득
• - 브라우저의 이벤트 동작 원리 이해
• - 웹 접근성이 준수된 UI 개발 (키보드 등 다양한 입력장치 고려)
• - 모바일 기기에서도 사용가능한 Touch 이벤트 활용
• - 다양한 라이브러리를 활용하여 캘린더, 로컬 스크롤, Chart 등 구현

수강대상

• 프론트엔드 개발자 또는
  웹퍼블리셔로서의 취업, 이직 희망자
  HTML5, 웹 접근성을 포함한 프론트엔드
  기술을 습득하고 싶은 분
• UI 애니메이션을 직접 제작/구현하고 싶은 분
  디자인 영역에서 프론트엔드 기술까지
  영역을 확장하고 싶은 분
• 웹 UI 개발을 배우고자 하는 디자이너
  프리랜서 디자이너 및 기획자
  웹 클라이언트(서버)에 대한 이해를 원하는 분

커리큘럼

• Part01. jQuery & JavaScript 기초

  01강오리엔테이션 및 HTML/CSS 개념 정리
  

  - 강의 준비 및 오리엔테이션
  - HTML 기초 복습
  - CSS 기초 복습 (Box 모델, Position)

             JavsScript 기초
  

  - 프로그래밍 기초
  - UI 개발을 위한 JavaScript 기본
  (문법, 데이터타입, 변수, 함수 등)
  - JavaScript 실습

  Part02. UI 개발 실무

  03강UI 설계 및 구현 기법(I)
  

  - UI 설계 및 개발 기법 (이미지 슬라이드)
  Step 1 : jQuery 기본 기능 활용
  Step 2 : 함수를 활용한 구현

  05강UI 설계 및 구현 기법(III)
  

  - UI 설계 및 개발 기법 (이미지 슬라이드)
  Step 5 : 설계 개념 변경에 따른 구현방식 변경(Swipe 형태)
  Step 6 : 재활용 및 기능설정이 가능한 소스 구현
  Step 7 : jQuery의 사용자 정의 메소드 구현

  07강패턴별 UI 개발 실습(II)
  

  - Banner Slide
  - 디자인에 따른 UI 컨트롤 기법 (좌우이동 min / max 값 계산 등)

  09강패턴별 UI 개발 실습(IV)
  

  - Scroll 기초, Parallax UI
  - scroll 이벤트에 따른 UI 개발 기법
  - 연속적으로 발생하는 이벤트에 대한 컨트롤 기법
  - 접근성을 준수한 패럴랙스 구현하기

  11강모바일 UI 개발 실습(II)
  

  - Multi-touch UI (Zoom, Rotate, Transition 등)
  - 멀티터치 기능을 활용한 UI 구현
  - Device API 소개 (전화걸기, 문자보내기, 사진/동영상 첨부 등)

• 02강jQuery 기초
  

  - 이벤트의 이해
  - UI 개발을 위한 jQuery 기본 (문법)
  - 주요 API 숙달 : Event, Get/Set, Add/Remove
  - jQuery 실습

             JavaScript / jQuery 실습
  

  - 주요 API 숙달 : CSS, Traversing, Dimension, Animation, 기타
  - JSON 기초
  - jQuery 실습

  04강UI 설계 및 구현 기법(II)
  

  - UI 설계 및 개발 기법 (이미지 슬라이드)
  Step 3 : 변수/함수를 활용한 객체 형태 구현
  Step 4 : 애니메이션 / 타이머 등 실무 예제 구현

  06강패턴별 UI 개발 실습(I)
  

  - Navigation (Web, Mobile)
  - 반응형 웹에서의 UI 구현 기법

  08강패턴별 UI 개발 실습(III)
  

  - Drag 기초, Swipe(Mouse) 구현
  - 좌표값을 활용하는 UI 개발 기법

  10강모바일 UI 개발 실습(I)
  

  - Swipe(Touch)
  - 모바일 기기에서의 UI 개발 기법
  (touch 이벤트 활용)
  - 모바일에서의 이벤트 컨트롤 기법
  (스크롤 방지, 좌우/상하 선택 등)

  12강라이브러리 활용
  

  - 주요 라이브러리 활용 방법 소개
  (iScroll, Google Chart, Calendar 등)
  - 실무를 위한 소스 정리 / 재활용 기법

 강사소개

강사
이시영