WORKSHOP | 워크샵

워크샵 과정은 다양한 디자인 분야에서도 독자적인 영역을 확보하고 있는 스페셜 교육에 주목합니다.
전문가의 축적된 노하우와 메이킹 스타일을 통해 새로운 크리에이티브의 세계를 경험할 수 있는 스페셜 코스 입니다.

HOME > 워크샵 > 과정소개

jQuery & JavaScript : 프론트엔드 UI 개발 실무 워크샵 (29기)

내용 타이틀 이미지
기  간 2019-08-26 - 2019-10-16
시  간 (월/수) 19:00 - 21:50
강  사 이시영
장  소 아카데미정글(강남 신사)
모집인원 20명 [결재선착순 모집]
수강료
총 840,000원  [온라인카드 2~6개월 무이자할부 가능]
월 420,000원, 2개월 분할납부 가능 * 계좌이체, 방문(내사카드) 결제

안내 : * 본 강의는 월,수 평일반으로 총 14강이 진행됩니다.
휴강안내 :9월 11일(수)

 강의 개요

line 이미지
JavaScript 와 jQuery를 활용한 UI 기초부터 실무활용
JavaScript와 jQuery를 이용하여 웹/모바일 사이트를 설계, 개발할 수 있는 UI구현 실무과정

최근 미니멀한 디자인이 트렌드가 되면서 동적으로
인터렉티브한 효과를 줄 수 있는 UI개발의 필요성은 더욱 높아지고 있습니다.
플러그인 활용으로만 jquery를 사용하셨던 분들이라면,
javascript의 원리를 이해하고 스스로 UI를 제작하여
마음대로 수정/활용하는 것에 많은 갈증을 느끼셨을 것입니다.


이 과정은 Query/javascript의 기본 원리부터 학습하여 UI를 원하는 대로 만들어내고 구현하는 훈련을 통해 웹접근성이 준수된 UI개발 및 모바일 기기에서도
사용가능한 UI제작을 가능하게 해줍니다.

크로스 브라우징, 크로스 디바이스를 고려한 UI 스타일링,
클라이언트 서버와 연동하는 기술 구현까지 막힘이 없도록
최적화된 내용으로 커리큘럼이 구성되어 있습니다.



jquery 이미지
강의 수강을 위한 사전 지식이 필요합니다

- HTML / CSS를 이용한 웹사이트 퍼블리싱 가능자
- CSS3의 기본 명령 및 Transition / Animation 등의 Animation 기능 이해
- 프로그래밍에 대한 기본 지식 (변수, 함수, 제어문 등 기본 내용)

jquery 이미지

 강의 특징

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

수강대상

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

커리큘럼

line 이미지
  • Part01. jQuery & JavaScript 기초

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

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

    03강jQuery 기초

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

    Part02. UI 개발 실무

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

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

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

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

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

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

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

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

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

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

  • 02강JavsScript 기초

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

    04강JavaScript / jQuery 실습

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

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

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

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

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

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

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

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

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

    14강라이브러리 활용

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

 강사소개

line 이미지
이시영 선생님 이미지

강사
이시영


현) 디노웍스㈜ 대표
방위사업청 사업관리본부 운영 아키텍트
웹표준솔루션 포럼 회원사
KAIST 산업공학과 (석사)


주요프로젝트


주요 금융사 및 대기업 웹 접근성 개선 컨설팅 및 구축 사업
현대건설, CJ 그룹, 기아자동차, IBK 기업은행, 국민카드 등

  • ※ 본 강의는 강사, 커리큘럼이 일부 변경되거나 사정으로 인하여 폐강될 수 있습니다.
  • ※ 본 강의 내용은 교육기획자 및 강사와의 협의없이 무단으로 사용될 수 없습니다.
  • ※ 무단사용시 저작권 침해로 인해 처벌받을 수 있음을 알려 드립니다.

포인트안내

  • 포인트는 과정 종료후 마이스터디에 있는 강의평가 버튼을 누른 후 설문조사에 참여하시면, 포인트가 가용 포인트로 전환됩니다.
    (참고로 실제 사용할 수 있는 포인트를 가용 포인트라고 칭합니다.)
    또한, 강의평가 설문조사 사항은 앞으로의 교육 운영에 적극 반영 하도록 하겠습니다. 마이스터디 페이지 바로가기

등록안내

  • - 과정 등록은 온라인으로 신청하시면 됩니다. 결제는 직접 방문, 무통장입금 또는 카드결제가 가능합니다.
  • - 무통장 입금으로 결제를 하실 경우 반드시 신청자 이름으로 입금하셔야지만 확인이 가능합니다.
  • - 등록확인과 취소는 마이스터디에서 확인 하실 수 있습니다.
  • - 계산서가 필요하신 분은 발급 신청란에 내용을 정확하게 기입해 주셔야 하며, 사업자 등록을 하신 분은 회사 찾기로 쉽게 입력하실 수 있습니다.
  • - 환불 규정은 해당 페이지를 참고하시기 바랍니다. 환불규정 보기
  • - 기타 문의 사항은 전화 02-3673-1721 메일 info@ejungle.co.kr
목록으로