หลักสูตร Vue.js และ Vuex Fundamental

ข้อมูลหลักสูตร

ระยะเวลาและรูปแบบการอบรม

  • ระยะเวลาของหลักสูตร: 3 วัน (18 ชั่วโมง) หรือ 4 วัน (24 ชั่วโมง)
  • รูปแบบการอบรม: In-house Training ณ.องค์กร หรือ หน่วยงาน ของผู้อบรม

tutor4dev line-at

ติดต่อขอใบเสนอราคา LINE ID: @tutor4dev, โทร. 081-572-2129

Prerequisite

  • พื้นฐานการเขียนโปรแกรมภาษา HTML
  • พื้นฐานการเขียนโปรแกรมภาษา JavaScript

เนื้อหาของหลักสูตร

Overview

  • แนวคิดเรื่อง Declarative Rendering และ Component Based Application
  • Vue.js Overview
  • ใช้งาน ECMAScript 2018
  • การเขียน Vue.js Application โดยใช้ CDN Library
  • การเขียน Vue Instance
  • ใช้งาน @vue/cli
  • ใช้งาน vue-devtools Chrome's Extension
  • การเขียน Vue Single File Component
  • ใช้งาน Vue Directive
  • ใช้งาน Lifecycle Methods
  • ใช้งาน Mixin และ Vue.extend()

State Management

  • แนวคิดเรื่อง Reactive Programming
  • การจัดการ State และ ใช้งาน data()
  • การเขียน Event Handler และ ใช้งาน methods
  • การทำ Attribute Binding และ computed
  • การทำ Persisten state โดยใช้ sessionStorage และ localStorage

Dynamic CSS และ Style

  • การทำ Dynamic CSS และ Inline JSCSS (JavaScript CSS)
  • ใช้งาน vue-styled-components

Form

  • การจัดการ Form State
  • ใช้งาน v-model
  • การทำ Dynamic Component :is และ <keep-alive>
  • การทำ Form Validation โดยใช้ vee-validate

Nested Component และ props Management

  • ใช้งาน props และ การทำ props Validation
  • การทำ Event Bus
  • ใช้งาน <slot>

Single Page Application และ vue-router

  • ใช้งาน vue-router
  • การทำ Route-based Code Splitting และ ใช้งาน import()
  • การทำ Named Route และ Named View
  • การทำ Programmatic Navigation
  • การทำ Nested Route
  • การทำ Redirect and Alias
  • การเขียน vue-router Guard

XMLHttpRequest และ axios

  • ใช้งาน JSONPlaceholder ReSTful API
  • ใช้งาน async และ await
  • การเขียน XMLHttpRequest และ ใช้งาน axios
  • การ Filter ข้อมูลโดยใช้ Regular Expression
  • การทำ Pagination
  • การเขียน Full-text Search โดยใช้ debounce()

Application State Management และ Vuex

  • การเขียน store, state และ getters
  • การใช้ $store.state และ $store.getters
  • การใช้ mapState() และ mapGetters()
  • การเขียน mutions
  • การใช้ $store.commit()
  • การใช้ mapMutations()
  • การเขียน actions
  • การใช้ $store.dispatch()
  • การใช้ mapActions()
  • การทำ Modularized store

Deployment

  • การทำ Production Build
  • การ Deployment ด้วย Netlify

หลักสูตรเสริมสำหรับอบรมร่วมกับ Vue.js, VueRx และ Vuex Fundamental

Firebase Cloud Firestore Crash Course

ระยะเวลาของหลักสูตร: 6 ชั่วโมง

Firebase

  • Firebase Overview
  • การทำ Authentication ร่วมกับ React.js หรือ Vue.js
    • User Management
    • Password Authentication
    • Email Authentication
    • Google Sign-in Authentication

Cloud Firestore

  • Cloud Firestore Overview
    • Data Model
    • Data และ Index Types
  • การทำ CRUD กับ Firestore
    • การทำ Create, Read, Update และ Delete Operation
    • การจัดการ Index
  • การทำ Realtime Updates Subscription
  • การแสดงผลข้อมูล และ การสืบค้นข้อมูล
    • การเรียงลำดับข้อมูล และ การจำกัดการแสดงผลข้อมูล
    • การสืบค้นด้วย Compound Query
    • การแสดงผลข้อมูลด้วย Pagination

Deployment

  • Firebase Hosting

Express.js Crash Course

ระยะเวลาของหลักสูตร: 6 ชั่วโมง

Express.js Essential

  • แนวคิดเรื่อง ReSTful Web Service
  • Express.js Setup
  • ใช้งาน Express.js Request และ Response
  • ใช้งาน Express.js body-parser
  • ใช้งาน Express.js Router
  • ใช้งาน Express.js Middleware
  • การเขียน Modularized Express.js Application
  • การทำ Data Validation โดยใช้ joi

Authentication

  • JSON Web Token Overview
  • การทำ Custom Middleware สำหรับ CORS และ JSON Web Token
  • การทำ Token Based Authentication โดยใช้ JSON Web Token ร่วมกับ React.js และ Vue.js

socket.io Crash Course

ระยะเวลาของหลักสูตร: 6 ชั่วโมง

socket.io Essential

  • แนวคิดเรื่อง Realtime Application Programming และ websocket
  • การ Setup Server โดยใช้ Express.js และ socket.io
  • การเขียน socket.io Server (emit และ broadcast)
  • การเขียน Modularized socket.io Application
  • ใช้งาน socket.io room
  • ใช้งาน socket.io namespace
  • การทำ socket.io Authorization

GraphQL และ Apollo Crash Course

ระยะเวลาของหลักสูตร: 9 ชั่วโมง

GraphQL

  • GraphQL Overview
  • GraphQL Schema
  • GraphQL Resolver, Parent และ Context Argument
  • GraphQL Query และ Mutation Type
  • GraphQL Scalar, Enumeration, List, Custom Object Type
  • GraphQL Interface และ Union
  • GraphQL Input Type

Apollo Server

  • Express.js และ Apollo Server Setup
  • HTTP Request และ Response โดยใช้ GraphQL
  • Schema Definition Language
  • ReST API, RDBMS หรือ NoSQL DataSource
  • Modularized Apollo Server และ GraphQL Application
  • Apollo Server Subscription Type และ Subscription Handler
  • Apollo Server Middleware
  • Apollo Server Authorization
  • Client Query, Mutation, Subscription และ Arguments
  • Client Aliases, Fragments, Directives
  • Production Deployment โดยใช้ Nginx Reverse Proxy, SSL/TLS

Apollo Client

  • Apollo Client Overview
  • Apollo Client Query และ Mutation
  • Apollo Client Pagination
  • Apollo Client Subscription
  • ใช้งาน Cache ร่วมกับ Apollo Client
  • การ Integrate Apollo Client ร่วมกับ React.js หรือ Vue.js

Docker และ Docker Compose Crash Course

ระยะเวลาของหลักสูตร: 6 ชั่วโมง

Docker Essential

  • Docker Overview
  • Docker Image
  • Docker Container และ Container Management
  • Docker Container Entry Point
  • Container Operation โดยใช้ diff, cp, export, commit, attach และ exec
  • Docker Network และ Port Expose
  • Docker Volume
  • Docker Environment, ENV และ env_file
  • Dockerfile, docker build และ ARG

Docker Compose

  • Docker Compose และ docker-compose.yml
  • การทำ Production Deployment

ติดต่อขอใบเสนอราคา

tutor4dev line-at

ติดต่อขอใบเสนอราคา LINE ID: @tutor4dev, โทร. 081-572-2129