หลักสูตร React.js และ Redux Fundamental

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

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

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

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

เพิ่มเพื่อน tutor4dev***

Prerequisite

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

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

Overview

  • แนวคิดเรื่อง Declarative Rendering และ Component Based Application
  • React.js และ React DOM Overview
  • ใช้งาน ECMAScript
  • การเขียน React.js Application โดยใช้ CDN Library
  • ใช้งาน React.createElement()
  • ใช้งาน create-react-app
  • ใช้งาน React Developer Tools Chrome's Extension

JavaScript XML (JSX)

  • พื้นฐานภาษา JSX
  • การเขียน render() และ ใช้งาน JSX
  • การเขียน Class Component และ Functional Component
  • การเขียน Conditional, List โดยใช้ JSX และ ใช้งาน key
  • ใช้งาน React.Fragment

State Management

  • แนวคิดเรื่อง Unidirectional Data Flow
  • การจัดการ State โดยใช้ setState()
  • ใช้งาน setState() แบบ Asynchronous
  • การเขียน Event Handler
  • การทำ Persistent State โดยใช้ sessionStorage และ localStorage

React Hooks

  • แนวคิด และ กฎการใช้ React Hooks
  • การจัดการ State โดยใช้ useState()
  • การจัดการ Lifecycle โดยใช้ useEffect()
  • การจัดการ Form และ Form Validation ด้วย React Hooks
  • ใช้งาน useRef(), useContext(), useReducer(), useCallback() และ useMemo()
  • การเขียน Custom Hooks

Dynamic CSS และ Style

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

Form

  • แนวคิดเรื่อง Controlled Components
  • การจัดการ State ของ Form
  • การเขียน Event Handler สำหรับ Form และ Form Element
  • การทำ Form Validation

Nested Component และ props Management

  • ใช้งาน props และ การทำ props Validation
  • ใช้งาน React.PureComponent และ React.memo()
  • ใช้งาน props ในแบบ Function และ JSX
  • ใช้งาน props.children และ props.children()

Single Page Application และ react-router

  • ใช้งาน <BrowserRouter>
  • ใช้งาน <Route />, <Switch>, <Link>
  • การทำ <Route /> Constraint
  • ใช้งาน withRouter() Higher-order Component และ การทำ Programmatic Navigation
  • ใช้งาน Route Parameter และ Query String
  • การทำ Multiple View
  • การทำ Nested Route
  • การเขียน react-router Guard และ ใช้งาน <Redirect />

XMLHttpRequest และ axios

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

Application State Management และ Redux

  • แนวคิดเรื่อง Immutable และ Redux Data Flow
  • การเขียน Spread Syntax
  • การทำ Application State Management โดยใช้ Redux
  • การเขียน store และ reducer
  • ใช้งาน react-redux
  • การเขียน Action, Action Creator และ ใช้งาน dispatch()
  • การเขียน Async Action Creator และ ใช้งาน redux-thunk Middleware

Intermediate

  • ใช้งาน Lifecycle Method
  • ใช้งาน Error Boundary
  • ใช้งาน Context API และ การเขียน Dynamic Context Application
  • ใช้งาน ref และ React.forwardRef()
  • การทำ jquery Plugins Integration
  • การเขียน Higher-order Component
  • การทำ Route-based Code Splitting
  • ใช้งาน import(), React.lazy() และ React.Suspense

Deployment

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

หลักสูตรเสริมสำหรับอบรมร่วมกับ React.js และ Redux 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


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

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

เพิ่มเพื่อน tutor4dev***