SBS아카데미컴퓨터아트학원 김태운

QUICK
MENU

JQuery

제이쿼리

J-Query를 이용하여 웹사이트 문서상의 모션작업을 구현합니다. 기초적인 JAVASCRIPT의 문법과 메서드등을 이용하여 슬라이드, 네비게이션등의 역동적인 사이트를 구현하는 수업입니다.

기초디자인-디자인툴- UIUX-웹퍼블리싱으로 진행되는 기본 웹사이트 제작과정에 따라 커리큘럼이 진행되면서 홈페이지 제작의 각 단계를 이해하게 하고 난이도별 실습을 통해 기술과 실력을 키웁니다.

취업분야웹에이전시, 쇼핑몰, 광고, 이벤트 회사(홍보물, 배너 제작), 기업체 홈페이지 관리, 이러닝 업체(홈페이지, 컨텐츠 제작)

01

취업을 위한 1:1 맞춤형 멘토링

교육과정 설계
02

사전 등록시 역대급 할인혜택

최대 30%할인
03

복습할 수 있는 온라인 강의

시스템 구축
04

취준생 필수 이력서 & 자소서 첨삭

취업상담 및 취업처 연계

교육과정 상세정보

2개월(8주)
입문 ~ 고급
15명 내외 인터뷰 및 레벨 테스트 후 입학
02-312-9602 주말·공휴일 상담 및 접수가 가능

평일반 (월~금): 1교시 09:00~11:00 2교시 11:00~13:00 3교시 14:00~16:00 4교시 16:00~18:00 5교시 18:00~20:00 6교시 20:00~22:00

주말반 (토~일): 1교시 09:00~12:00 2교시 12:00~15:00 3교시 15:00~18:00

제이쿼리 문의하기

개원 17년의 역사 꾸준한 성장과 취업생 배출

· 누적 수강생 544,409명

· 소통하고 공감하는 취업 지원 프로그램

· 개인별 최적 업체 선정

교육 컨텐츠 투자비용 매년 8억원 이상

· 교육과정 만족도 및 직무능력 향상 솔루션 제공

· 수강생 역량 수준에 따른 맞춤형 학습

· 차별화 된 강점요소 함양을 위한 커리큘럼 제공

SBS아카데미는 결과로 증명합니다.
학력, 경력, 경험이 없어도 취업에 성공합니다.

카페 매니저에서 웹디자이너로 취업
광고 디자이너에서 웹 사이트 제작, 관리자로 이직
공무원 준비생에서 웹 기획자로 취업
비전공자에서 프론트엔드 개발자로 취업!

팀팩토리

이한솔 취업생: 제 생각보다 더 체계적으로 수업들이 진행되었고 무엇보다 팀원들과 함께 작업을 했던 것이 정말 좋았습니다. 선생님 또한 열정적으로 중간중간 보충수업까지 해주시고 너무 감사합니다!

(주)엔유비즈

이수현 취업생: 저도 웹디자이너를 늦은 나이에 새로운 도전이라고 생각해서 뛰어들었지만 전혀 후회하지 않습니다. 취업담당자 선생님이 계시니 너무 성급하게 생각하지 말고 천천히 하고 있으면 언젠가 좋은 기회가 찾아 올거라 생각합니다.

로빈ICT

박원휘 취업생: 친한 동기가 생겨서 같이 서로 도와주면서 자격증 준비도 많이 하고, 멘토나 선생님들이 칭찬과 격려 따로 문자로 도움을 많이 주시기도 해서 잘 준비하였습니다!

㈜JOYFULSOFT

김연희 취업생: 학원 내부도 엄청나게 깨끗했고, 교육을 받으면서 제가 모르고 있던 팁 같은 걸 알게 되어 엄청나게 좋았습니다. 내가 몰랐던 팁을 아는 그 순간이 제일 즐거웠습니다. 머릿속에 전구가 팟! 하고 켜지는 느낌이었달까요.

(주)아이텍씨앤씨

고지현 취업생: 이력서와 자소서, 포트폴리오를 컨펌해 줌으로서 제가 가진 부족한 부분을 말씀해주시며 보완할 기회를 주셨고, 취업관련 공고와 면접질문, 채용사이트에서 확인해야 할 점 등 필요한 정보들을 다루며 같이 상의해 주시는 친절한 상담이 정말 많은 도움이 됐다 생각합니다.

온메이커스

송창현 취업생: 취업지원해주시는 선생님께서 항상 자기 일처럼 취업 자리를 알아봐주셔서 취업에 성공할 수 있었던 것 같습니다. 또한 수업을 해주시는 선생님께서 단순한 강의가 아닌 다양한 이야기와 여러가지를 도와주셔서 취업에 성공할 수 있었던 것 같습니다.

(주)데이타이음

송지민 취업생: 학원 등록 전에는 학원에 반신반의하면서 등록했는데 학생의 의지만 있다면 멘토님과 선생님들 모두가 한 명의 취업에 진심으로 대해주셔서 놀라웠고 감사했습니다.

Cross Shock

장소영 취업생: 비전공자이지만, 학원을 믿고 따라와서 결국 IT분야에 원하는 직종으로 취업할 수 있었습니다. 마지막으로 허지훈 강사님, 박진수 멘토님, 취업담당자 차지연 선생님께 감사 말씀 전하고 싶습니다.

델타인덱스

김도영 취업생: 학원에서 배웠던 HTML과 CSS 기술 덕분에 업무에 빠르게 적응할 수 있었습니다. 후에 디자인 작업에도 투입될 예정인데, 포토샵과 일러스트레이터 프로그램을 배운 것이 큰 도움이 될 것 같습니다.

케이앤제이 컴퍼니

채지안 취업생: 디자인 업계에서는 창의성을 많이 발휘해야 하는데 강사님께서 색감을 잘 활용할 수 있는 방법을 제시해주시고 다양한 포트폴리오를 볼 수 있는 사이트를 제공해 주셨습니다.

이런 분들이 배우시면 좋아요!: · 홈페이지 기획, 디자인, 제작에 관심이 있는 분
· 웹사이트에 관심이 있는 분
· 웹파트 진로 고민자
· 코딩입문자(비전공자)
· 홈페이지 제작 방식이 궁금하신 분
· 자신만의 홈페이지를 만들고 싶으신 분
· 나만의 포트폴리오 홈페이지를 만들고 싶으신 분

JQuery

제이쿼리 과정소개

J-Query (이하 제이쿼리)는 자바스크립트의 라이브러리 입니다. 자바스크립트의 코드들을 간결한 상태로 개발이 가능하도록 도와줌으로써 HTML내의 요소들을 손쉽게 표현/사용이 가능하게 되었으며, 크로스브라우저 지원등 많은 장점을 가지게 되어 차세대 웹 개발 환경에 각광받고 있는 분야 입니다. J-Query를 이용하여 웹사이트 문서상의 모션작업을 구현합니다. 기초적인 JAVASCRIPT의 문법과 J-Query의 메서드등을 이용하여 슬라이드, 네비게이션등의 역동적인 사이트를 구현하는 수업입니다.

JQUERY기본 개념 및 다양한 선택자 유형: jQuery는 자바스크립트 라이브러리로, HTML 문서를 쉽게 조작하고 상호작용할 수 있도록 도와주는 도구입니다.
jQuery는 간편한 문법과 다양한 기능으로 웹 개발을 편리하게 만들어 줍니다.
선택자 (Selectors): jQuery의 핵심은 선택자를 사용하여 문서의 요소를 선택하는 것입니다. CSS 선택자와 유사하게 사용되며, $()로 표현됩니다.

JQEURY의 명령 메서드: jQuery는 다양한 명령 메서드를 제공하여 HTML 문서를 조작하고 상호작용하는 데 사용됩니다. 여기에는 몇 가지 주요 명령 메서드가 있습니다.
.html() 메서드: 선택한 요소의 HTML 내용을 가져오거나 설정합니다.
.text() 메서드: 선택한 요소의 텍스트 내용을 가져오거나 설정합니다.
val() 메서드: 폼 요소의 값을 가져오거나 설정합니다. 주로 입력 상자와 관련이 있습니다.
등의 명령 메서드들을 적절히 조합하여 jQuery를 사용하면 웹 페이지의 동적인 부분을 효과적으로 다룰 수 있습니다.

함수, 메서드, 객체: jQuery에서도 JavaScript의 기본 개념인 함수, 메서드, 객체가 그대로 적용됩니다.
함수 (Function): jQuery에서도 함수는 일련의 코드를 나타내는 데 사용됩니다.
메서드 (Method):jQuery에서 메서드는 주로 선택자를 사용하여 HTML 요소를 조작하고 상호작용하는 데 활용됩니다.
객체 (Object): jQuery 객체는 문서 객체 모델(DOM) 요소를 나타냅니다.
jQuery에서는 다양한 메서드를 사용하여 선택한 요소를 조작하고, 이러한 메서드는 jQuery 객체에 속합니다. jQuery 객체는 JavaScript의 기본 객체를 기반으로 하며, 여러 유용한 메서드와 함수를 제공하여 웹 페이지 상에서 동적인 상호작용을 쉽게 구현할 수 있도록 도와줍니다.

의사결정과 루프: jQuery에서 의사 결정(조건문)과 루프(반복문)은 JavaScript의 기본 구조를 따릅니다.
jQuery 자체에는 새로운 의사 결정 또는 루프 구조가 특별히 내장되어 있지 않습니다. 따라서 jQuery를 사용하여 의사 결정과 루프를 구현할 때는 JavaScript의 일반적인 문법을 따라야 합니다. jQuery에서도 JavaScript의 의사 결정과 루프를 사용할 수 있습니다.
jQuery는 주로 HTML 요소를 선택하고 조작하는 데에 중점을 두고 있으므로, 주로 이러한 제어 구조를 사용하여 선택된 요소에 대한 동작을 결정하거나 반복 작업을 수행합니다.

문서객체모델: 문서 객체 모델(Document Object Model, DOM)은 HTML 문서의 구조를 표현하고, 그 구조에 접근하고 조작하기 위한 인터페이스를 제공하는 프로그래밍 인터페이스입니다.
jQuery 역시 DOM에 기반하여 HTML 문서의 요소들을 선택하고 다루는데에 사용됩니다.
jQuery는 DOM을 간소화하고 효율적으로 다룰 수 있도록 도와주는 라이브러리 중 하나입니다. jQuery를 사용하면 브라우저 간의 호환성 문제를 해결하고, 코드를 간결하게 작성할 수 있습니다.

이벤트: jQuery 이벤트는 웹 페이지에서 발생하는 사용자의 행동이나 브라우저 상태의 변화를 감지하고 처리하는 기능을 말합니다.
이벤트는 사용자의 상호작용에 응답하여 웹 페이지를 동적으로 만들거나 변경하는 데에 주로 사용됩니다.
click() 메서드: 클릭 이벤트에 대한 핸들러를 등록합니다.
hover() 메서드: 마우스가 요소에 진입하거나 빠져나갈 때 각각에 대한 핸들러를 등록합니다.
submit() 메서드: 폼이 제출될 때의 이벤트에 대한 핸들러를 등록합니다.
등의 jQuery 이벤트 함수들을 사용하여 웹 페이지의 다양한 상호작용을 감지하고 처리할 수 있습니다.

애니메이션 및 플러그인: jQuery는 애니메이션 효과를 쉽게 구현하고 플러그인을 통해 더 다양한 기능을 확장할 수 있는 라이브러리입니다.
애니메이션: jQuery는 애니메이션 효과를 적용하는 메서드를 제공합니다.
hide() 및 show() 메서드: 요소를 숨기거나 보이게 하는 간단한 애니메이션을 수행합니다.
fadeIn() 및 fadeOut() 메서드: 요소를 서서히 나타나게 하거나 서서히 사라지게 하는 애니메이션을 수행합니다.
slideDown() 및 slideUp() 메서드: 요소를 아래로 나타나게 하거나 위로 사라지게 하는 애니메이션을 수행합니다.
플러그인: jQuery 플러그인은 jQuery의 핵심 기능을 확장하고 더 많은 기능을 추가할 수 있게 하는 외부 확장 모듈입니다.
이러한 플러그인은 다양한 용도로 사용되며, 그래픽 처리, 폼 처리, 데이터 시각화 등 다양한 작업에 활용됩니다.
jQuery를 사용하면 내장된 애니메이션 효과를 쉽게 사용하고, 플러그인을 통해 기능을 확장할 수 있습니다.

이미지슬라이드등 응용예제: jQuery를 사용하여 이미지 슬라이드쇼를 만들거나 다른 응용 예제를 구현할 수 있습니다.
image-slider: horizontal, vertical, fade, Layer pop-up / Modal pop-up / aside 등의 예제가 사용되며,
애니메이션 효과: fadeIn, fadeOut, slideUp, slideDown 등과 같은 애니메이션 효과를 적용하여 웹 요소를 부드럽게 나타나게 하거나 사라지게 할 수 있습니다.
요소 조작: HTML 요소의 내용 변경, 속성 수정, 클래스 추가/제거 등의 조작을 통해 동적으로 페이지를 조작할 수 있습니다.
CSS 스타일 변경: CSS 속성을 동적으로 변경하여 요소의 스타일을 조작할 수 있습니다.
애플리케이션 상태 관리: 클라이언트 측에서 간단한 상태 관리를 구현하고, 쿠키나 로컬 스토리지를 활용할 수 있습니다.
동적인 HTML 생성: HTML 요소를 동적으로 생성하고 추가하여 페이지를 동적으로 구성할 수 있습니다.
이미지 슬라이드쇼 및 갤러리: 이미지 슬라이드쇼나 갤러리를 생성하여 사용자에게 시각적인 경험을 제공할 수 있습니다.
jQuery는 많은 유용한 함수와 메서드를 제공하여 웹 개발을 효과적으로 지원합니다.

자주묻는질문

더 궁금한점이 있으시면 고객상담센터(02-312-9602)로 문의해 주시면 전문 상담사가 자세히 안내해 드리겠습니다.

Q웹디자인(기획)/프론트엔드(개발)/퍼블리싱 간의 차이점은 무엇인가요?

A 현재 우리나라에서 구분 지어지는 웹디자인과 퍼블리싱은 단순히 디자인기획 및 제작을 하는 디자인 파트와 제작된 디자인을 (html css java script를 활용하여 수정 및 배포하여 웹상에 구현화 시키는 퍼블리싱으로 구분 지어질 수 있습니다. 본래 해외에서는 웹디자인+퍼블리싱이 가능한 직업을 웹디자이너라고 통칭하나, 우리나라에서만 특이하게 나뉘어진 케이스 입니다. 나아가 프론트앤드는 단순히 UI개발뿐만 아니라 백엔드 API 데이터와 상호작용 및 웹사이트의 프로그래밍적 배치와 디자인적 영역 전반의 운영을 이해하고 클라이언트 사이드를 담당하는 웹개발자 분야로서 앞서 표현한 디자인과 프론트앤드와는 다른 영역입니다.
Q쇼핑몰이나 개인 사이트를 직접 만들 수 있는가?

A 가능합니다! 디자인부터, 서버셋팅포함 가능한수업으로 진행중에 있습니다. 그러나 개발 or 유지에 따라서 교육과정이 달라지기때문에 어떤 홈페이지를 제작하는지에 따라서 공부기간 및 과정이 달라 질 수 있습니다
Q최소 어디까지 배워야 실무에 활용 가능한가?

A 포토샵, 일러스트, UXUI , HTML , CSS까지는 할수있어야, 디자인파트와 개발자 파트와 소통이 가능합니다. 즉, 개발자여도 디자인을 알아야 디자이너와 소동이 가능하며, 디자이너라도 코딩을 알아야 개발자와 소통이 가능합니다, 실무에서 제일 중요한것은 실무디자인 능력도 있지만, 부서간의 소통 또한 중요한 실무 능력 중 하나입니다
Q퍼블리싱을 하지 않고 웹디자이너 취업이 가능할까요?

A 퍼블리싱을 하지 않고서도 취업은 가능합니다. 단, 퍼블리싱을 하지 않고 취업을 했을 시 우리가 원하는 대우와 급여를 받기는 어렵습니다. 웹디자이너란 본인의 디자인 작업물을 웹이라는 매체를 토대로 전달하는 디자이너입니다. 디자인 작업물을 웹으로 전달하기 위해서는 퍼블리싱 역량이 필요한데, 퍼블리싱을 할줄 모른다면 단순 콘텐츠를 제작하는 오퍼레이터이뿐 웹디자이너라고 할 수 없습니다.
QJ-query를 꼭 배워야 하는 이유가 있을까요?

A 제이쿼리는 자바스크립트의 라이브러리 언어로써 웹상에 그래픽적인 표현을 자유롭게 해주는 언어입니다. 제이쿼리를 다룰 줄 모르는 경우 일반적인 사진이나 이미지와 같은 정적인 디자인 작업물만 표현이 가능하지만, 제이쿼리를 다룰줄 알면 웹모션, 웹드로잉과 같은 동적인 디자인 작업물도 표현이 가능해지기에 범위가 매우 넓어지겠지요? 디자이너에게 표현의 범위는 매우 중요한 요소이기에 제이쿼리는 웹디자이너가 되기 위해서 필수적으로 배워야 합니다.
Q웹디자인과 퍼블리셔의 차이가 어떻게 될까요?

A 웹디자인은 제작된 페이지를 수정 및 디자인하는 과정이며, 퍼블리셔는 하나부터 열까지 상세페이지를 제작하는 과정입니다.
Q취업은 어디로 많이 하나요?

A 웹학과의 경우 웹퍼블리셔, 웹디자이너, HTML컨텐츠관리자, 웹사이트운영, 온라인사보, 웹기획, 인터뷰, 웹진 제작 등 웹 관련 분야로의 취업이 가능합니다.
Q자격증은 꼭 취득해야하나요 ?

A 필수는 아니지만 적극권장 추천합니다. 국가기술자격증은 종류에 따라 차이가 조금씩 있지만, 공공기관이나 공기업등에서 입찰시 평가기준이되기때문에 취업시 유리합니다.
Q웹디자이너나 퍼블리셔로 취업하기는 어렵지 않은지?

A 요즘에 대부분 회사들은 웹사이트가 있고, 당연히 해당 사이트를 유지 보수할 수 있는 인력이 필요합니다! 보통 웹사이트는 분기당 혹은 매달 변경사항이 생기기 때문에 관련 업무를 할 줄 아는 사람이 필요하고, 아예 웹사이트만 만드는 에이전시도 많이 늘어난 상황입니다! 실제로 학원 수강생들 중 취업율도 높은 과정이라고 보시면 됩니다.