최신 프론트엔드 프레임워크 Angular & React 의 장점을 결합하여 만든 Vue.js 의 기초를 학습하는 강좌입니다.

1. 강좌소개

최신 프론트엔드 프레임워크 Angular & React 의 장점을 결합하여 만든 Vue.js 의 기초를 학습하는 강좌입니다. 본 강의는 프론트엔드 개발에 입문하는 비 개발자, 디자이너, 퍼블리셔, 비 전공자, 대학생 및 입문자 를 대상으로 합니다.

Fast Campus 의 프론트엔드 웹앱 캠프 교과과정3시간 짜리 Vue 강의를 재구성하여 녹화하였으며, 3시간 안에 Vue 의 개념을 학습하고 기본적인 화면 개발이 가능하도록 수강생의 이해를 돕는데 목적을 두고 있습니다.

전체적인 강의 방식은 이미 많은 온라인 강좌에서 검증된 간단히 이론 설명 -> 강사가 라이브 코딩 -> 준비된 예제에 수강생이 바로 실습 의 형태로 구성되어 있습니다. 해당 교육 방식은 이론을 배우고 바로 실습하는 형태의 교육방식으로 전 세계 개발자들이 공감하는 효과적인 교육방식입니다.

이 강의는 Vue 의 개요, 구성요소, 프로젝트 구성 팁 등 Vue 로 화면을 개발하는 데 필요한 전반적인 내용들을 다룹니다.

“쉽고, 빠르고, 강력한 Vue 로 멋진 프론트엔드 개발자가 되시길 바랍니다.”

2. 강좌 특징

본 강좌의 목표는 Vue 프레임워크의 필수 요소들에 대한 개념을 잡고, 뼈대를 세운 뒤 수강 후 Vue 를 이용해 간단한 화면 개발이 가능하도록 하는 것이 목표입니다. 3시간 만에 요즘 가장 핫한 프론트엔드 프레임워크를 학습하시고, 나도 프론트엔드 개발을 할 수 있다는 자신감을 얻어가세요.

다른 프론트엔드 프레임워크에 비해 쉽게 배울 수 있다는 것을 직접 체감하시기 바랍니다 🙂

3. 누구에게 도움이 되나요?

프론트엔드 개발에 관심있는 모든 분께 적합합니다.

  1. 프론트엔드 개발에 입문하는 분
  2. 프론트엔드 개발을 해보고 싶은 디자이너
  3. 프론트엔드 개발자로 전향하고픈 퍼블리셔
  4. 프론트엔드 개발자로 취업을 희망하는 대학생

다만 HTML, CSS, JS 의 기초는 알고 계셔야 합니다.

4. 어떤 걸 배우나요?

Vue 로 화면을 개발하기 위한 기본적인 구성요소와 실전 프로젝트 구성 팁 등 전반적인 내용을 다룹니다.

  • Vue Instance
  • Vue Components
  • Vue Router
  • Vue Template
  • Vue Resource
  • Vue Data Binding
  • Vue Single File Components
  • Vue Loader

ES6 (최신 자바스크립트 스펙) 와 Webpack 을 모르셔도 수업 진행이 가능합니다. Webpack 은 추후에 별도의 강좌를 개설할 계획입니다.

5. 강사 소개

장기효 (캡틴판교)

웹으로 세상을 더 편하게 만들 수 있다고 믿는 웹 개발자 입니다.
웹 성능 최적화에 관심이 많고, 취미로 기술 블로그를 운영하며 노래 부르는 것을 좋아해 홈 레코딩을 합니다.

[프로필]

강좌 평가

4.7

3 개의 수강평
  • 5 점2
  • 4 점1
  • 3 점0
  • 2 점0
  • 1 점0
  1. June Kim의 프로필 사진

    웹 초보자라면 꼭 들어야할 강의

    5

    전체적으로 3시간이지만, 개념별로 짧게 짧게 영상이 나뉘어있어서 쉽게 골라들을 수 있어요.
    설명도 영상 + 자료로 알차고, 일단 강의력이 좋으셔서 바빠도 틈틈히 커리큘럼 따라가기 좋습니다.
    (한번에 몰아서 들어도 좋은거 같구요)
    개인적으로는 인프런 강의 중에 제일 만족도가 높네요. 🙂
    열심히 해서 프로젝트에 적용해보려구합니다! ㅎㅎ

  2. 김인숙의 프로필 사진

    제대로 이해되지 않았던 부분에 대한 정리를 할 수 있어요.

    4

    혼자 학습할 때 제대로 알지 못하고 대충 넘어갔던 내용을
    강사님이 차근차근 정리하듯이 알려주셔서 이해하기 쉽네요.

    저 역시 설명 후 퀴즈 풀이가 있어서 좋았습니다.
    강의 길이도 딱 집중하기 좋은 길이입니다.

  3. 박찬민의 프로필 사진

    Vue 입문자에게 강력 추천!

    5

    강좌의 소개에 나와 있듯이, 강사님께서 강의의 대상을 입문자라고 하셨는데, 정말 입문자에게 너무 좋습니다.
    저도 이번에 Vue를 새롭게 배워보려고 강의를 들었는데, 소개(이론)-실습-퀴즈-퀴즈풀이 로 이어지는 강의 방식이 입문자가 쉽게 따라하면서 익히기에 너무 좋습니다.
    퀴즈도 막연한 문제가 아니라, 준비된 코드에 어떤 작업들을 해야하는지 주석으로 다 달아주셔서 길 잃지 않고 잘 따라서 퀴즈를 풀 수 있었습니다.
    이 강의를 시작으로해서 Vue에 대해서 많이 알게 되었고, 더 심화된 Vue 내용을 잘 습득할 수 있을 것 같아요!
    강의를 준비해주신 강사님께 감사드립니다~

강좌 교육과정

Vue 소개
Vue 강의 소개 미리보기 00:01:00
Vue 강의 개요 (Overview) 미리보기 00:02:00
Vue 수업을 위한 개발환경 설정
Atom 프로그램 소개 및 설치 미리보기 00:03:00
Atom 플러그인 테마 설치 미리보기 00:05:00
Atom 플러그인 패키지 설치 미리보기 00:10:00
Node.js, Chrome, Vue.js 크롬 플러그인, Github 설치 미리보기 00:04:00
Vue 시작하기
Vue 는 무엇인가? 미리보기 00:05:00
[실습] Vue 시작하기 – Hello Vue.js 00:02:00
[부록] MVVM 패턴이란? 00:01:00
Vue 인스턴스
인스턴스 소개 미리보기 00:02:00
인스턴스 생성 미리보기 00:03:00
Vue 라이프싸이클 소개 미리보기 00:04:00
[실습] 라이프싸이클 훅 커스텀 로직 00:02:00
Vue 컴포넌트
컴포넌트 소개 00:02:00
[실습] 컴포넌트 등록 00:02:00
전역 & 지역 컴포넌트 등록 00:02:00
[실습] 전역 & 지역 컴포넌트 등록 00:03:00
[실습] 전역 & 지역 컴포넌트 차이점 00:03:00
[퀴즈] 지역 & 전역 컴포넌트 등록 퀴즈 안내 00:02:00
[퀴즈] 전역 & 지역 컴포넌트 등록 퀴즈 풀이 00:03:00
Vue 컴포넌트 통신
상-하위 컴포넌트 간 데이터 전달 방법 (Parent – Child 컴포넌트 통신) 00:01:00
Props 소개 00:01:00
Props 설명 00:05:00
[퀴즈] Props 퀴즈 설명 및 안내 00:01:00
[퀴즈] Props 퀴즈 풀이 00:05:00
Non Parent – Child 컴포넌트 간 통신 00:01:00
Event Bus 00:05:00
[퀴즈] Component – Props – For 퀴즈 안내 00:02:00
[퀴즈] Component – Props – For 퀴즈 풀이 00:09:00
Vue 라우터
소개 00:02:00
[실습] 기본 라우터 00:07:00
Nested 라우터 소개 00:02:00
[실습] Nested 라우터 설명 00:05:00
Template Root Element 주의사항 00:02:00
[퀴즈] Nested 라우터 퀴즈 안내 00:02:00
[퀴즈] Nested 라우터 퀴즈 풀이 00:04:00
Named Views 소개 00:03:00
Nested Router vs Nested Views 00:02:00
Vue 리소스
Vue Resource와 Axios 소개 00:03:00
Vue 템플릿
강의 중간 정리 00:02:00
소개 00:06:00
Attributes 00:01:00
Javascript Expressions 00:02:00
Directive 00:03:00
Filter 00:01:00
Vue 데이터 바인딩
소개 00:01:00
Interpolation 00:01:00
Binding Expressions 00:01:00
Directives 00:01:00
Class Binding 00:03:00
마무리 00:01:00
[퀴즈]Template 과 Data Binding 퀴즈 안내 00:03:00
[퀴즈]Template 과 Data Binding 퀴즈 풀이 00:09:00
Vue 싱글파일 컴포넌트 체계
소개 00:04:00
Vue 프로젝트 구성방법
Vue CLI 를 이용한 프로젝트 구성 방법 설명 00:02:00
[실습] Vue CLI 를 이용한 프로젝트 구성 팁 00:11:00
[실습] Vue CLI 와 싱글파일 컴포넌트를 이용한 컴포넌트 등록 00:06:00
[퀴즈] .vue 파일에서 컴포넌트 등록하기 퀴즈 풀이 00:08:00
[부록] Vue Loader
Vue Loader 소개 00:10:00
[안내] 정리 및 다음 강좌 안내
정리 및 다음 강좌 안내 미리보기 00:13:00
  • 가격 옵션 +
  • 무제한
  • 강좌 수료증
  • 60개 강의, 3 시간, 32 분

인프런은 성장기회의 평등 을 추구합니다.

경제적, 시간적 제약없는 양질을 교육으로 누구나에게 성장 기회를 균등하게 주는것. 그것이 우리의 목표입니다.

지식공유참여 고객센터
top
(주)인프랩 | 대표자:이형주 | TEL:070-4202-1180 | E-MAIL: course@inflearn.com | 사업자번호:499-81-00612
주소:성남시 분당구 삼평동 대왕판교로 645번길 12 경기창조경제혁신센터 8층 R10 | 개인정보보호책임자:이형주
통신판매업:2017-서울강남-01544 | ©INFLAB. ALL RIGHTS RESERVED