캡틴판교·율무와 함께 정복하는 PWA!

할인마감 D-

Vue로 구현하는
PWA CAMP

Vue.js 정복을 통한
Progressive Web App 프로젝트.

#Vue.js #PWA
#캡틴판교#율무

main_phone

기간 & 일정

2020. 1. 11-2020. 3. 7
(1/25 휴강)
토요일 14:00 – 19:00
주 1회, 총 8회

장소 & 준비물

패스트캠퍼스 강남강의장
강남역 4번 출구, 미왕빌딩
개인 노트북

문의

02-568-9886
help.camp.dev@fastcampus.co.kr
※주차 지원은 불가합니다.

웹 개발 트렌드에 맞춰 PWAVue를 익히고,
다양한 프로젝트 실습으로 프론트엔드 개발 능력을 업그레이드 시키세요!

Web Development Trends

PWA는 이미 2019년 웹 개발 트렌드
중에서도 상위권인 3위를
차지하고 있습니다.

Alibaba.com

쇼핑몰 알리바바는 PWA로 네이티브 앱에서
모바일 웹으로의 전환율을 76%로 이끌었습니다.

Twitter Lite

트위터라이트 PWA는 상당수 사용자들의
재방문을 유도하고, 데이터 사용량을 감소 시켰습니다.

8주 후, 당신도 PWA를 개발할 수 있습니다.

오프라인에서도 사용이 가능하며 실행속도가 충분히 빠르고
네이티브 앱과 같은 기능(GPS, Push 알림 등)을 구현할 수 있는 PWA 기술을 내 것으로 만드세요.

PWA(Progressive Web App), 왜 배워야할까요?

 네이티브 앱 
 PWA 

 Point 1 

네이티브 앱 같은 웹

Push알람, GPS, 블루투스 등
네이티브 앱에서 구현되는 기능을
동일하게 구현할 수 있습니다.

 Point 2 

빠른 로딩 속도

모바일 웹에서도
모바일 앱에 뒤지지 않는
빠른 로딩 속도를 구현합니다.

 Point 3 

연결 독립적

오프라인이나 또는
느린 네트워크에서도
원활하게 동작합니다.

강의에 대해 궁금한 점, 강사님께 직접 물어보자!

수강신청만 해도
무료 강의 설명회의 기회가!

결제여부와 무관하게, 수강신청서를 제출해주신 분들을 대상으로
온라인 강의 설명회 및 오리엔테이션이 진행됩니다.

관련된 내용은 수강신청하신 분에 한하여 추후에 안내드립니다.

pwa로고

네이티브 앱을 뛰어넘는 웹앱

프론트엔드 개발 대세 프레임워크

코스특징.

01

프론트엔드 개발자를 위한
최신 기술과 도구의 총집합

최신 트렌드 기술을 따라가다 보면 Webpack, ES6, Firebase, Github 등 한 번쯤 마주하는 용어들입니다. 하지만 지금까지 익숙하지 않아 효과적으로 사용하지 못했던 분들이라면 강의를 통해 프로젝트에 직접 사용하시면서 체득할 수 있습니다.

02

배워서 바로 쓸 수 있는
실무 밀착형 커리큘럼

Vue.js + Firebase를 이용한 Push 웹 서비스, SPA 기반의 미세먼지 측정 PWA 등을 제작하며 브라우저의 동작원리부터 프로젝트를 진행하며 다루게 될 핵심 기술까지 단계적으로 경험합니다. 단순 이론강의로는 만날 수 없는 실무 노하우를 전달합니다.

03

PWA와 함께 Vue.js까지 학습하는, 1석 2조 코스

최신 웹 트렌드인 PWA와 동일하게 최신 자바스크립트 프레임워크인 Vue를 활용하여 프로젝트를 진행합니다. PWA와 더불어 자바스크립트 활용능력까지 한층 더 성장할 수 있는 기회를 제공합니다.

실습으로 완성하는
Vue.js & PWA 프로젝트

 1 

Vue.js 컴포넌트
설계 방식

통신 방법

 2 

회원 가입, 로그인 등의
인증 처리
API 함수
구조화
방법

 3 

프로그레시브 웹/앱을
제작하며 배우는 Offline 웹과
Push 알람 기능

Vue를 활용한
Todo 앱 제작

패스트캠퍼스_뷰투두앱
[활용 기술 스택]
– Vue.js(ES5) + Vuex
– Vue CLI + Webpack
– Firebase

SPA 기반 미세먼지
측정 PWA 제작

pwa_app_resize
[활용 기술 스택]
– PWA + Vue.js(ES6)
– Open API + GPS + Push 알람
– Firebase + SPA

실무에서 겪은
경험과 지식을 얻어 갈
프로젝트형 커리큘럼!

 1 

PWA와 Vue.js로
서비스를 제작하면서 얻은
전문가의 노하우와 지식

가져갈 기회입니다.

 2 

예전 웹 개발 방식에서 벗어나
프론트엔드 개발 프레임워크를
썼을 때의 업무 절차와
협업 방식
에 대해 알아봅니다.

 3 

최신 프론트엔드 개발
생태계
에 대해 알아보고
Webpack과 같은 빌드 도구
함께 살펴봅니다.

커리큘럼.

프론트엔드 개발 기본과 Vue.js 소개

1주차 자세히 보기

  • 최신 프론트엔드 프레임워크를 이용한 개발 방법과 현대 프론트엔드 개발 생태계 소개
  • Vue.js 소개 및 자바스크립트로 Vue.js 라이브러리 제작하기 실습
  • 입문자를 위한 GitHub 소개와 실무자를 위한 협업 튜토리얼 특강
  • Vue.js 인스턴스와 인스턴스 라이프사이클

Vue.js 기술 요소 학습

2주차 자세히 보기

  • Vue.js 컴포넌트와 컴포넌트 설계 방법
  • Vue.js 컴포넌트 통신 방법과 이벤트 버스
  • REST API를 이용한 데이터 호출 방법과 자바스크립트 비동기 처리
  • 최신 뷰 CLI 및 프론트엔드 빌드 시스템

실전 웹 애플리케이션 제작 1

3주차 자세히 보기

  • Vue CLI 및 싱글 파일 컴포넌트 소개
  • Vue.js 컴포넌트 구조화 및 컴포넌트 통신 방법을 익히기 위한 할 일 관리 앱 제작
  • Vue.js 애니메이션과 트랜지션 실습
  • Vue.js 슬롯과 scoped 슬롯 실습 
  • 할 일 관리 앱 빌드 및 서버에 배포하기 실습

Vue.js 실무 개발

4주차 자세히 보기

  • 프론트엔드 빌드 시스템 Webpack 이해 및 실습
  • 차트, 데이트 피커 등의 외부 라이브러리 모듈화 실습
  • 레거시 프로젝트에 Vue.js를 적용하는 방법
  • 실무에서 흔히 저지르는 5가지 실수 소개 및 실습 

실전 웹 애플리케이션 제작 2

5주차 자세히 보기

  • Vue.js에서 필요한 주요 ES6 문법 7가지
  • Vue.js 라우터 고급 패턴 및 SPA 기반 페이지 설계
  • Vue.js 실전 싱글 페이지 애플리케이션 제작
  • 퍼블리셔와 협업하기 위한 뷰 컴포넌트 스타일링 방법

PWA 기본과 오프라인 웹 앱 제작

6주차 자세히 보기

  • Progressive Web App 소개 및 시연
  • 웹/앱 매니페스트 파일을 이용한 웹 앱 Splash Image 제작과 Install Banner 생성 실습
  • Offline 웹 앱을 구현하기 위한 서비스 워커 특징, 생명 주기, 캐싱 방법 학습
  • 웹/앱 매니페스트 파일과 서비스 워커를 이용한 오프라인 웹 앱 제작

PWA 푸시 알람 웹 앱 제작

7주차 자세히 보기

  • 푸시 알람 서비스를 위한 Firebase CLI, 인증, 데이터베이스, 호스팅, FCM 학습
  • Vue + PWA 기반의 푸시 알람 웹 앱 제작
  • 푸시 서비스 관리자 페이지 제작

Vue.js로 구현하는 Progressive Web App

8주차 자세히 보기

  • 푸시 알람 + 오픈 API를 이용한 실시간 미세먼지 측정 Progressive Web App 제작
  • 향후 학습 로드맵 안내 및 프로젝트 관련 질의 응답

수강대상.

웹개발자

Vue를 비롯해
최신 프론트엔드 기술에
흥미가 있는 분

퍼블리셔

JS입문 이상으로
성장하고 싶은
퍼블리셔

JS

실제 서비스 가능한
앱을 개발해야 하는
웹 개발자

수강 신청 전, 나에게 맞는 강의인지 확인해볼까요?

아래 퀴즈에서 두 문제 이상 맞추셔야 원활한 수강이 가능합니다.

잠깐! 두 문제를 못 맞췄어도 괜찮아요!
아래 학습 자료선행 학습하세요!

수강 전, 아래 학습 자료를 꼼꼼하게 공부하고 오신다면
누구나 [Vue로 구현하는 PWA CAMP] 수강이 가능합니다.

나에게 맞는 강의일까? 아직 고민된다면
강사님께 직접 물어보세요!

수강신청만 해도
무료 강의 설명회의 기회가!

결제여부와 무관하게, 수강신청서를 제출해주신 분들을 대상으로
온라인 강의 설명회 및 오리엔테이션이 진행됩니다.

관련된 내용은 수강신청하신 분에 한하여 추후에 안내드립니다.

Vue.js & PWA 실무 경험과
강의 경험이 풍부한 강사진

 1 

Vue.js 창시자 에반유에게
직접 들은 내용을 전합니다.

 2 

강사님의 실무 경험 및
강의 경험
을 바탕으로 전합니다.

 3 

두 명의 강사님이 함께 해
더욱 면밀한 실습 지도가 가능합니다.

강사소개.

장기효 강사님
[캡틴판교]

“Vue.js의 초점은 더 많은 사람들이 쉽게 웹 앱을 개발하도록 도와주는데에 있다.”
지난 9번의 수업에서 수강생 분들이 빠르게 성장하고 개인 목표를 달성하시는 것을 보며 뿌듯함을 느꼈습니다. 이번 수업은 기존 수업 내용과 함께 새로운 컨텐츠로 8주 안에 더 빠르게 성장하실 수 있도록 준비하였습니다. 국내 어디에서도 찾아보기 힘든 강의를 목표로 수강생 분들의 역량 향상에 집중하겠습니다. – 장기효 강사님

[약력]

현| 프론트엔드 개발자

– 네이버, 이베이 코리아, SK 그룹 Vue.js 강의

– Google PWA 공식 문서 번역자 (문서 바로가기)
– Do it! Vue.js 입문 저자 (책 자세히보기)
– 기술 블로그 (블로그 바로가기)
Github 바로가기

진유림 보조강사님
[율무]

디자인과 WEB을 좋아하는 잡식 개발자 입니다. 사람들의 생산성을 높여 삶의 질을 좋게 만드는 일에 관심이 많습니다. 아름다운 웹과 iOS 개발, 새로운 언어와 프레임워크 그리고 개발자들 오프라인 모임과 그들의 개그를 사랑합니다. 개발자라면 꼭 알아야 할 Git 특강과 더불어 빠르고 효율적이게 PWA, Vue 실습을 진행하실 수 있도록 도와드리겠습니다. – 진유림 보조강사님

[약력]

현| ZEPL Software Enginner

전| 레진엔터테인먼트, 스마트스터디

– 삼성전자, Google Women Techmakers Seoul, 국민대, 성신여대 등 다수 강연
– 한빛미디어 Git 서적 집필중

– 신입 개발자 생활백서 (슬라이드 보기)
– 낮은 가지의 열매 (슬라이드 보기)
– 기술 블로그 (블로그 바로가기)

Github 바로가기

수강후기.

★★★★★
김영보 수강생

프론트엔드 개발자가 아니더라도 퍼블리셔 또한 항상 고민해야 할 부분이지만 어디에서도 가르쳐주지 않았던 브라우저의 동작 원리 등 많은 부분을 배우게 되었습니다. 이 강의를 들으면 분명 퍼블리셔는 프론트엔드 개발자로, 프론트엔드 개발자는 한 단계 레벨업 할 수 있는 기회가 될 것입니다.

인터뷰 보기 〉

★★★★★
이희찬 수강생

웹 성능과 PWA에 대해 알아보고 공부해서 적용해보고 싶으신 분, 포트폴리오를 만들 때 남들과는 차별화된 프로토타입을 만들고 적용해보고 싶으신 분들은 물론이고 웹에 대한 내용, 트렌드를 많이 다루기 때문에 프론트엔드를 공부하고 있는 분이라면 정말 많은 것을 얻어가실 수 있으실겁니다.

인터뷰 보기 〉

★★★★★
임송이 수강생

강의에서 배우는 기술들이 어떤 배경에서 등장했고, 어떤 장점이 있고 관련 기술과 어떻게 이어지는지 등 기술의 바탕이 되는 설명을 들을 수 있었습니다. 독학으로는 배우기 힘든 PWA와 Vue 등 최신 프론트엔드 기술을 가져갈 수 있어서 무척이나 좋았습니다.

인터뷰 보기 〉

★★★★★
익명 수강생

수업을 통해 PWA 푸쉬기능이 있는 알림 게시판을 직접 만들었습니다. 두고두고 읽을만큼 좋은 퀄리티의 수업자료가 가장 인상깊었습니다. 일일이 참고링크도 첨부되어 있어서 복습하기에도 좋고 특히 PWA의 서비스워커 부분은 지금도 참고하고 있습니다. PWA를 직접 현업에서 적용해보는 기회를 만들 좋은 강의라고 생각합니다.

QnA.

Q. 취업준비생에게는 어떤 점이 좋은가요?

기업에서 프런트엔드 개발자로 일하기 위해 필요한 역량과 지식을 체화합니다. 실무에서는 프런트엔드 개발자가 어떤 역할을 하는지 어떤 방식으로 다른 직군과 협업하는지에 대해서 배울 수 있습니다. 또한, 수업에서 제작하는 애플리케이션으로 포트폴리오 뿐만 아니라 취업 후 실제 업무를 할 때 참고 자료로도 활용할 수 있습니다.

Q. 8주 뒤, 강의가 끝나면 무엇을 할 수 있나요?

PWA 로 모바일 앱을 대체할 수 있는 고성능 웹 애플리케이션을 제작할 수 있고, 화면을 구성하는 코드를 깊게 이해하고 구현하는 고급 프론트엔드 개발자가 되실 수 있습니다. 느려서 답답한 웹 사이트를 속시원하게 개선할 수 있는 프론트엔드 개발자가 되실 수 있습니다. Open API, 라이브러리, 프레임워크를 그냥 사용하는 다른 프론트엔드 개발자와 차별화된 개발자가 될 수 있습니다. 해외 사용자가 웹 사이트 접속 안된다고 불평 늘어놓는 것 이제 그만 들으셔도 됩니다. 해외 사용자도 불평 없이 사용할만한 웹 사이트 접근을 보장하실 수 있습니다.

Q. 안드로이드와 IOS 모두 PWA를 적용할 수 있나요?

네, 가능합니다. 이전에는 Safari에서 PWA에 필요한 Service Worker를 지원하지 않았으나, 공식적으로 사용이 가능해졌습니다. [링크]

Q. 웹앱을 제작하는 다른 기술인 React Native, IONIC2와는 무슨 차이가 있나요?

React Native와 Ionic2가 프레임워크라면 PWA는 개발 방법입니다. 두 프레임워크는 모두 웹 기술로 앱을 대응하기 위해 등장 하였습니다. 하지만 React Native는 화면 UI 위젯부터 Native코드가 관여하기 때문에 온전히 웹 기술(HTML,CSS,JavaScript)만으로 개발하는 것엔 한계가 있습니다. 또한 Ionic2는 하이브리드 앱을 만드는 기술로 성능상 느리다는 평가가 있었습니다. 그래서 최근에 Ionic2는 PWA를 공식 패키지에 넣어 개발할 것을 권고하고 있습니다. 이는 웹 기술로 앱을 개발할 때 PWA가 필수적인 기술 요소가 되었음을 의미한다고 볼수 있습니다.

Q. PWA의 미래 전망은 어떤가요?

PWA 는 웹의 미래이자 모바일 애플리케이션을 대체할 수 있는 고성능 웹 애플리케이션입니다. 세계적으로 Google 이 주도하고 있으며, 국내에서는 Samsung 이 적극적으로 기술 개발에 참여하고 있습니다. 모바일 기기가 보급화 되고 전 세계로 확산됨에 따라 개발 시장은 모바일 웹 과 모바일 앱 으로 나뉘게 됩니다. 웹 애플리케이션으로도 충분히 모바일 앱을 커버할 수 있다면 굳이 모바일 앱을 개발해야 할 이유가 있을까요? 이젠 모바일 웹에서도 모바일 앱에 뒤지지 않는 빠른 로딩 속도와 Push 알람, GPS, 블루투스와 같은 기능들을 PWA 로 구현할 수 있습니다. 오프라인에서도 웹 애플리케이션을 동작시킬 수 있는 건 PWA 의 또 다른 장점입니다.

image_1@2x
image_2@2x
image_3@2x
image_4@2x
image_5@2x

수강료안내.

강의 정보, 한 번 더 확인!

기 간 : 2020. 01. 11 – 03. 07 (총 8주)
일 정 : (1/25 휴강)
토요일 14:00 – 19:00(주 1회)
준비물 : 개인 노트북
장 소 : 패스트캠퍼스 강의장

할인가 99만원 정가 110만원

10% 할인 진행 중!(-12/19)

✓ 본 강의는 결제 완료 순으로 마감됩니다.
✓ 개강 전일 18시에 모집이 마감됩니다.

다음 기수는 언제죠?

출시알림을 신청해주세요

최저가로 강의를 수강할 수 있게, 다음 기수 홍보 시작 시 가장 먼저 메일을 보내드립니다.

* 계산서 발행을 원하실 경우, 먼저 수강신청을 진행한 후 사전에 결제 프로세스를 문의해주시기 바랍니다.
* 수강 인원이 10명 미만인 경우 또는 내부 사정으로 인하여 부득이하게 폐강될 수 있습니다. (자세한 안내는 하단 유의사항 참고바랍니다.)

강의장안내.

학습 지원 프로젝트

공부도 하고! 학습지원금도 받고!

*학습지원금(제세공과금 22% 차감 후 지급)은 강의마다 개인마다 상이할 수 있습니다.

학습 목표. 학습노트 제출

-학습노트/과제 제출 일정: 매주 목요일 자정 24:00까지 폼스텍으로 제출합니다.
-제출 시간을 엄수하지 못한 노트는 추후 환급에 불이익이 있습니다.
-과제 제공 방식 : 강사님께서 수업시간에 hand-out(또는 이메일)으로 배포합니다.
-수강중 학습 콘텐츠 일정 : 1-6 주차 학습노트 제출

학습지원금을 받으려면?

미션을 모두 완료하면 신청페이지를 통해 신청 가능합니다.
다만, 강의 종료 후 30일 이내에 신청페이지를 통해서 신청해주셔야 합니다.
아래의 환급신청 링크로 신분증 사본 / 환급받을 통장사본을 제출 (반드시 본인 명의로만 가능)해 주세요.
결제한 수강료의 10% (환급 금액의 22% 제세공과금으로 차감) 를 드리며, 학습지원금은 개인마다 상이할 수 있습니다.

환불규정

* 학습지원금은 기수강생 및 얼리버드 할인과 중복 적용이 가능합니다. (기타 다른 이벤트와 중복 적용이 불가합니다.)
* 과제물이 허위로 작성되거나 표절일 경우 환급이 거절될 수 있습니다.
* 환불은 환불규정(https://www.fastcampus.co.kr/refund/)에 따라 진행됩니다. 규정에 의거하여 환불금액이 없을 수 있습니다.

{ FASTCAMPUS COMMUNITY MEMBERSHIP }

패스트캠퍼스 오프라인 강의를 수강하셨다면!
별도의 가입절차없이 패스트캠퍼스 커뮤니티 멤버쉽 회원이 됩니다.
커뮤니티 멤버쉽은 수강 후 1년 동안 유지되며,
오직 멤버들만을 위한 비공개 스터디클럽, 네트워킹행사, 세미나 등 비정기적 행사에 모실 예정입니다.

[ 유의사항 및 환불규정 ]

* 모든 패스트캠퍼스 오프라인 파트타임 교육은 개강 전일 18시에 모집이 마감됩니다.
* 상황에 따라 사전 공지 없이 모집이 조기 마감되거나 할인이 연장될 수 있습니다.
* 수강 인원 확인을 위하여, 즉시 결제가 어려운 경우에도 반드시 수강신청을 먼저 진행해주시기 바랍니다.
* 수강생의 결석이나 지각 등으로 발생한 손해에 대해서는 별도의 보상을 제공하지 않습니다.

* 다음과 같은 사유 등으로 인해 강의가 폐강될 수 있으며, 폐강 시 학원법에 따라 반환 사유 발생일로부터 5 영업일 이내에 수강료를 환불해드립니다.
– 모집된 수강인원이 10명 이하일 경우
– 강사의 갑작스러운 사고 및 건강 상의 이유
– 천재지변
: 위의 사유로 강의가 폐강될 경우, 학원법 제 18조에 따라 오프라인 강의 취소/환불 정책을 준용하여 환불 처리되며, 모객 부진으로 폐강 시에는 최소 개강일로부터 7일 전에는 폐강 여부를 안내해드립니다.

* 총 수강기간 1개월 이내 기준 취소 및 환불 규정 안내
– 환불금액은 정가가 아닌 실제 결제금액을 기준으로 계산됩니다.
– 수업 시작 전 환불 신청 시 전액 환불됩니다.
– 수강 시작 후 환불 신청 시 하기 수업 시수를 기준으로 학원법 환불규정에 따라 환불 가능합니다.
: 환불요청일시 기준 수업시수 1/3 경과 전 : 수강료 2/3 환불
: 환불요청일시 기준 수업시수 1/2 경과 전 : 수강료 1/2 환불
: 환불요청일시 기준 수업시수 1/2 경과 후 : 환불금액 없음

* 기타 환불 관련 안내
– 환불 의사를 밝힌 다음날부터 계산하여 환불합니다.
– 환불금액은 수업시간을 기준(반올림)으로 산정합니다.
– 환불금액의 10원 미만은 절삭합니다.
– 반환 사유 발생 시 5 영업일 이내 환불됩니다.
: PG사와 카드사의 상황에 따라 환불이 지연될 수 있습니다
– 1개월 산정 기준은 민법 제 160조(역에 의한 계산)을 적용합니다.
: 실제 일수와 상관없이 수업시작일이 3월 7일인 경우, 1개월은 4월 6일까지 입니다.
: 단, 수업 시작일이 1월 31일인 경우, 1개월은 월의 말일인 2월 28일까지 입니다.