Vue.js로 시작하는 SPA 개발

Single Page Application 개발 입문을 위한 Vue.js 강의입니다.

클래스 소개
난이도
쉬움
카테고리
웹 프로그래밍 - 프로그래밍
태그
자바스크립트, vue
추천 학습대상
- Single Page Application를 어떻게 시작해야할지 고민되는 분들
- 웹 프로그래밍을 한 번이라도 해보신 분
- HTML/CSS/JavaScript에 대해 이해하고 계신 분
- Framework/Library에 대한 경험이 없으신 분

Angular? React? Vue?
😱프레임워크는 많은데
어떤 걸 선택해야 할까요?



📑공식 문서로 Vue.js 시작하기



Single Page Application?🚀

하루가 다르게 발전하는 웹 개발!
SPA 방식을 사용하면 필수 요구되는
최소한의 내용만 서버에서 받아와
페이지에 표시할 수 있습니다.


🙆‍♀왜 Vue.js예요?

무엇보다 쉽게 배울 수 있는 Vue.js!
HTML/CSS/JavaScript 기초만 알고 있다면
쉽고 빠르게 다양한 웹 페이지 제작 완료!

원리로 이해하는 Vue.js👍

Vue.js 공식문서를 토대로 원리를 파악해야
무리 없이 심화 단계로 넘어갈 수 있습니다.
또한, SPA JavaScript Library를 활용할 때
도움이 될 수 있는 내용으로 구성했습니다.




🎯이런 분에게 도움되요
내 얘기인지 진단해보세요!







이런 내용을 배웁니다📝

차근차근 커리큘럼을 짚어보세요.


  1. Vue.js 환경 세팅 및 작동 원리
    - 개발환경 세팅 및 Vue Instance와 작동원리에 대해 알아봅니다.

  2. Template Syntax
    - Vue.js의 Template와 그 문법에 대해서 공부합니다.

  3. Directives
    - Directive의 개념과 사용할 수 있는 구문을 예제와 함께 알아봅니다.

  4. Components
    - Components의 기본 개념에 대해 짚어보고, 복잡한 페이지를 어떻게 구현해야 하는지 실습해봅니다.





🌟수강 전 알아두세요!

vue-cli, vue-router, vuex는 다루지 않습니다.
본 강좌에서 다루지 않은 내용은 추후 심화 강좌에서 설명하고자 합니다.




Vue.js에 빠져든 개발덕후💘

개발과 사랑에 빠진 강의자 님을 소개합니다.


계성혁

KAIST 소프트웨어대학원 석사과정 이수 중

개발 경력

前 (주)더블에이치 소프트웨어 엔지니어 인턴
개인 오픈소스 프로젝트: PHP 기반 라이브러리 개발
백엔드 개발만 고수하다 Vue.js에 빠져든 개발자

수상 경력

가디언즈 오브 벨트(https://c11.kr/41o6):
서울 IoT 해커톤 우수상 수상


all Icon and image made by Freepik

체험하기
모두 펼치기
  • 01
    1. 강의소개
  • 1-1. 오리엔테이션 및 강의소개
  • 02
    2. Hello World로 만나는 Vue
  • 2-1. Hello World로 만나는 Vue
  • 03
    3. Vue Instance와 작동원리
  • 3-1. Vue Instance
  • 04
    4. Template Syntax
  • 4-1. 주요 문법 설명
  • 05
    5. Directives
  • 5-1. Directive의 개념과 v-for
교육 과정
모두 펼치기
  • 01
    1. 강의소개
  • 1-1. 오리엔테이션 및 강의소개
  • 02
    2. Hello World로 만나는 Vue
  • 2-1. Hello World로 만나는 Vue
  • 03
    3. Vue Instance와 작동원리
  • 3-0. 강의자료 및 예제코드
    3-1. Vue Instance
    3-2. Instance Lifecycle
    3-3. Instance Properties
    3-4. Computed Properties & Watchers
  • 04
    4. Template Syntax
  • 4-0. 강의자료와 예제코드
    4-1. 주요 문법 설명
    4-2. 문법 실습
  • 05
    5. Directives
  • 5-0. 강의자료와 예제코드
    5-1. Directive의 개념과 v-for
    5-2. v-if 알아보기
    5-3. v-if 예제 실습
    5-4. v-model 알아보기 & 실습
    5-5. v-on 알아보기
    5-6. v-on 예제 실습
  • 06
    6. Components
  • 6-0. 강의자료와 예제코드
    6-1. Components 기본 개념
    6-2. Components 기본 예제 실습
    6-3. Props로 Data 주고받기
    6-4. Event로 Data 주고받기
    6-5. Dynamic Component 개념
    6-6. Dynamic Component 실습
  • 07
    7. 마무리
  • 마무리
마지막 업데이트|2019년 08월 01일
강의자 소개
안녕하세요. 구름에듀 캡틴 계성혁입니다. 함께 학습을 시작해봐요!

강좌 후기
무료

평균평점
4.9
난이도
쉬움
수강기간
평생 무제한