[웹 개발 풀스택 코스] Vue.js 프로젝트 투입 일주일 전 - 기초에서 실무까지 대시보드

초급자를 위해 준비한
[프론트엔드, 웹 개발] 강의입니다.

본 강의는 풀스택 웹 개발자 양성을 위한 [웹 개발 풀스택 코스] 강의 시리즈의 프론트엔드 부분에 대한 강의입니다. 이 강의는 강사의 저서 <Vue.js 프로젝트 투입 일주일 전>의 내용을 바탕으로 만들어진 강의입니다.

기초가 남다른 프론트엔드 개발!
Vue.js, 제대로 배워보세요 ✨

What is Vue.js?

Vue.js는 사용자 인터페이스 개발을 위한 프로그레시브 프레임워크(Progressive Framework)입니다. 여기서 Progressive란, 웹과 네이티브 앱의 이점을 모두 수용하며 표준 패턴을 사용해 개발되었다는 뜻입니다.

웹은 별도의 설치 없이 브라우저만 있으면 접속이 가능하기 때문에 접근성이 매우 뛰어납니다. 한편 네이티브 앱은 일반적인 웹보다 빠르고 더 뛰어난 사용자 경험을 제공한다는 장점이 있습니다.

결국 Vue.js가 목표로 하는 것은, 웹의 장점과 앱의 장점을 모두 수용할 수 있는 진화된 웹앱을 만들 수 있는 프레임워크를 제공하는 데 있습니다.

Vue.js, 왜 배워야 할까요?

이미 웹 애플리케이션은 모바일 전용 네이티브 애플리케이션만큼 성능 향상을 이루고 있습니다. 따라서 대다수의 서비스 및 비즈니스 애플리케이션이 Vue와 같은 프론트엔드 프레임워크를 이용해서 개발되고 있습니다. 그렇기 때문에 프론트엔드 개발자가 되기 위해서는 반드시 Vue와 같은 프론트엔드 프레임워크를 배워야 합니다.

기초에서 실무까지 완벽하게

이 강의의 특징!

_{쉽고 자세하게}

_{실무 응용 중심}

_{예제 코드까지!}

• Vue.js의 기본 문법을 차근차근 알려드립니다.
• Vue.js의 최신 버전, Vue.3.x 버전으로 최근 추가된 기능을 상세히 다룹니다.
• 초심자도 쉽게 따라 할 수 있도록 예제 코드를 가장 작은 단위로 분리해서 진행합니다.
• 실무 프로젝트가 진행되는 순서에 맞춰 각 단계에서 어떤 작업을 진행해야 하는지 알려드립니다.
• 실무에서 가장 많이 개발되는 웹 화면 패턴을 완벽하게 구현할 수 있도록 합니다.
• 다양한 외부 모듈의 사용법을 익히게 됩니다.
• 모든 예제 코드는 깃허브를 통해 제공됩니다.

무엇을 배우나요?

• 개발 IDE 툴로는 비주얼스튜디오코드(Visual Studio Code)를 사용합니다. 비주얼스튜디오코드를 이용한 개발 방법 및 유용한 확장 프로그램을 알게 됩니다.
• Node.js(노드JS)를 설치하고, Node.js가 무엇인지 알 수 있습니다.
• NPM(Node Package Manager)에 등록된 수많은 오픈소스를 활용할 수 있습니다.
• Vue CLI를 통해 Vue 프로젝트를 빠르게 생성하고 관리, 배포할 방법을 알게 됩니다.
• Vuex를 통한 상태관리 방법을 배웁니다.
• Vue 라우터(Router)로 애플리케이션 메뉴를 어떻게 구성하고, 메뉴에 대한 코드 로드 시점을 분리하여 애플리케이션 성능을 향상시킬 방법을 알게 됩니다.
• Vue 컴포넌트 개발과 관련된 모든 문법과 기능을 알게 됩니다.
• Vue 3 버전에 추가된 컴포지션(Composition) API, Plugins 같은 유용한 기능을 알게 됩니다.
• 실무에서 가장 많이 개발하게 되는 UI 패턴 5가지를 완벽하게 익히게 됩니다. 이것만으로도 여러분은 실무에서 개발하게 되는 70% 이상의 화면을 구현할 수 있게 됩니다.

선수 지식을 확인하세요.

• HTML에 대해 알아야 해요. (HTML 태그)
• CSS를 알아야 해요. 아주 조금. (클래스 사용법, width, height, color 정도의 스타일)
• 자바스크립트(JavaScript)를 알아야 해요. (최소한 기본 문법: if, for, object, array, 함수 선언 등)
• ES6 문법 중 Arrow Function, Async & Await 정도를 알아야 해요.
• 본 강의를 수강하기 전에 [웹 개발 풀스택 코스 - HTML&CSS] → [웹 개발 풀스택 코스 - 바닐라 자바스크립트] → [웹 개발 풀스택 코스 - 부트스트랩] 강의를 차례로 수강하는 것을 추천합니다.

웹 개발 풀스택 코스,

다른 강의도 함께 만나보세요!

1. [웹 개발 풀스택 코스 - HTML&CSS 기초]

• 웹의 기초 언어인 HTML과 CSS를 차근차근 배워요.

2. [웹 개발 풀스택 코스 - 바닐라 자바스크립트] 

• 순수 자바스크립트를 제대로 익혀야 리드하는 개발자가 될 수 있어요.

3. [웹 개발 풀스택 코스 - 부트스트랩 기초]

• 누구나 쉽게 멋진 디자인을 갖는 반응형 웹을 만들 수 있어요.

4. [웹 개발 풀스택 코스 - Vue.js 프로젝트 투입 일주일 전 - 기초에서 실무까지] 현재 강의

• 가장 쉽고 막강한 프론트엔드 프레임워크인 Vue.js를 익혀요.

5. [웹 개발 풀스택 코스 - 넷플릭스와 당근마켓 분석을 통해 배우는 데이터베이스 이해]

• 넷플릭스, 당근마켓을 분석하면서 자연스럽게 데이터베이스를 설계하는 방법을 이해하게 돼요.

6. [웹 개발 풀스택 코스 - Node.js 프로젝트 투입 일주일 전 - 기초에서 실무까지]

• 자바스크립트 언어로 백엔드까지 구현할 수 있습니다. Node.js면 가능합니다.

7. [웹 개발 풀스택 코스 - 포트폴리오]

• 웹 개발 풀스택 코스를 통해 배운 모든 기술을 바탕으로 제품 판매 미니 웹을 개발합니다.

이 강의를 만든 사람은
누구일까요?

개발자의 품격

소프트웨어 기술을 통해 세상에 선한 영향력을 주고 싶은 24년 차 소프트웨어 개발자.
지식을 나누는 것을 좋아하고, 항상 새로운 기술을 익히는 것을 즐겨요.

국내외 60개가 넘는 글로벌 기업 ERP 시스템을 구축하는 컨설턴트 및 개발자로 활동하였고, 직접 개발한 소프트웨어를 국내는 물론 해외 유수의 기업에 판매한 경험 또한 가지고 있어요. IT 스타트업 대표이사이기도 해요.

개발자뿐만 아니라 UX 컨설턴트로, 때로는 비즈니스 컨설턴트로 일하면서 애플리케이션과 서비스 개발 시 기획에서 개발까지 전 과정에 대한 수많은 경험을 쌓았습니다. 이제는 20년이 넘는 실무 경험을 바탕으로 후배들에게 정말 필요한 기술, 정말 제대로 된 지식을 전달하는 사명감으로 지식을 나누는 일을 하고 있어요.

더 알아볼까요?

• 유튜브 ‘개발자의품격’ 채널을 통해 200여 개의 유용한 강의 영상을 제공하고 있어요.
• '바닐라 자바스크립트', 'Vue.js 프로젝트 투입 일주일 전', 'Node.js 프로젝트 투입 일주일 전', '개발자가 되기 위해 꼭 알아야 하는 IT 용어', ‘디자인 씽킹을 넘어 프로그래밍 씽킹으로’, 'The Essentials of Smart Contract Development for Solidity Developers', '저는 아직 아이들에게 코딩을 가르치지 않습니다' 책의 저자입니다.
• 오라일리의 '러닝 타입스크립트' 번역한 역자입니다.

이런 분들께 추천드려요!