React JS Advanced (ขั้นสูง)

React JS Advanced (ขั้นสูง)

เว็บแอพปัจจุบันมีแนวโน้ม และเทรนด์ไปในทิศทางของ SPA (Single Page Application) กันโดยมากแล้ว ด้วยข้อดีเรื่องประสบการณ์ (experience) ที่ดีกว่าของผู้ใช้ ประสิทธิภาพ (performance) ที่ดีกว่าทั้งเรื่องความเร็ว ความเบา ความคล่องตัวในการใช้งาน นับเป็นข้อดีทั้งฝั่งผู้ใช้และนักพัฒนาเองด้วย

React.js เป็น Javascript Library หรือจะเรียกว่าเป็น Javascript Framework ก็ได้ ที่เราใช้สำหรับสร้างหน้าเว็บ พร้อมด้วย action ต่างๆ ที่ทำให้เว็บของเราดูน่าสนใจ

จุดเด่นของ React ที่ทำให้มันน่านำมาใช้งานนั้นก็คือ มันมีระบบแคชในตัวทำให้หน้าเว็บของเรามีการตอบสนองที่เร็ว เหมาะแก่การนำไปทำ SPA เป็นอย่างยิ่ง

การเขียน React เรายังสามารถแยกองค์ประกอบของหน้าเว็บเรา ออกเป็นส่วนๆ เรียกว่าเป็น component แล้วนำมาประกอบกันเป็นหน้าเว็บได้ ซึ่งทำให้เราสามารถ นำ component ของเราไปใช้ซ้ำที่อื่นได้ ไม่ต้องเสียเวลาเขียนใหม่

ด้วยจุดเด่นเหล่านี้เว็บระดับโลกมากมาย อาทิ Facebook , Instagram, WhatApp, Netflix ,Yahoo, Airbnb , Dropbox เลือกนำมาใช้งานและพัฒนาโปรดักส์และบริการของตัวเอง

ในหลักสูตรนี้เป็นการต่อยอดเนื้อหาจากหลักสูตร React JS Basic สำหรับผู้เริ่มต้น เพื่อให้ผู้เรียนได้มีทักษะความรู้ในหัวข้อที่สำคัญๆ อีกหลายประเด็นในการใช้งาน React JS อาทิ การเขียนด้วย TypeScript การทำงานกับ TailwindCSS การเขียน Style Component รวมไปถึงการทำระบบ Authentication ด้วย JWT และ Firebase ที่นับว่าเป็นสิ่งที่มีประโยชน์ในการพัฒนางานในปัจจุบันเป็นอย่างมาก เมื่อผู้เรียนจบหลักสูตรนี้จะมีความรู้เพิ่มมากขึ้น และมีความพร้อมในการนำองค์ความรู้เหล่านี้ไปพัฒนาโปรเจ็กต์งานของตัวเองได้

ปกติราคาหลักสูตรนี้ด้วยระยะเวลาและเนื้อหาที่นำมาสอนจะมีราคาเต็มอยู่ที่ 6,500 บาท แต่ทางทีมงานของสถาบันนำมาจัดราคารุ่นออนไลน์ ด้วยราคาพิเศษ สำหรับ 30 ท่านแรกราคา 600 บาท ลำดับที่ 31-100 ราคา 700 บาท และลำดับที่ 101 เป็นต้นไปที่ราคา 800 บาทเท่านั้นครับ

หลักสูตรนี้พร้อมเรียนรู้ สามารถทักไลน์ด้านล่างเพื่อสั่งซื้อวิดีโอการอบรมได้ทันที

เพิ่มเพื่อน

 

การอบรมในหลักสูตรนี้เป็นการสอนสดออนไลน์ ผ่านโปรแกรม cisco webex conference และมีการบันทึกการอบรมส่งให้ดูย้อนหลังทั้งหลักสูตรครับ

กำหนดการณ์อบรม

  • วันที่ 19-22 มีนาคม 2564 เวลา 20:00-24.00
  • อบรมเฉลี่ยวันละ 4 ชั่วโมง
  • ระยะเวลารวมทั้งหลักสูตร 16 ชั่วโมง
อบรมออนไลน์ (สอนสด)
  • 19 - 22 มีนาคม 2021
  • 16 ชั่วโมง

ภาพรวมหัวข้อการอบรม

  • Module 1: React กับ Typescript
  • Module 2: การใช้งาน TailwindCSS ร่วมกับ Styled-Components ใน ReactJs
  • Module 3: Backend with Strapi Headless CMS frameworks
  • Module 4: React Restful Web API with Strapi CMS frameworks (CRUD)
  • Module 5: React with Redux
  • Module 6: React JWT Authentication
  • Module 7: React Hooks กับ Firebase CRUD
  • Module 8: React Firebase Authentication
  • Module 9: React Deployment

รายละเอียดหลักสูตร

Day 1

Module 1: React กับ Typescript

  • การขึ้นโปรเจ็กต์ React js ด้วย TypeScript
  • รูปแบบไฟล์ที่สร้างในโปรเจ็กต์ด้วย TypeScript และการเรียกใช้งาน
  • การปรับเปลี่ยนมาใช้ Typescript สำหรับโปรเจ็กต์ที่เขียนด้วย ES6
  • สิ่งที่เปลี่ยนแปลงในการทำงานกับ Props ด้วย Typescript
  • การเรียกใช้งาน State ใน TypeScript
  • การใช้งาน Type Inference กับ State
  • การใช้งาน Type Unions กับ State

Module 2: การใช้งาน TailwindCSS ร่วมกับ Styled-Components ใน ReactJs

  • รู้จัก Styled-Components ใน React js
  • ติดตั้ง Styled-Components
  • การเรียกใช้งานใน Components
  • การติดตั้ง TailwindCSS ใน React js
  • การ Config เพื่อใช้งาน TailwindCSS ร่วมกับ Styled-Components
  • ตัวอย่างการออกแบบ Template เว็บเพจด้วย TailwindCSS ร่วมกับ Styled-Components

Day 2

Module 3: Backend with Strapi Headless CMS frameworks

  • Strapi Quickstart, build a quick blog
  • Installation
  • Build your first content type
  • Set up the Post Collection Type in Strapi
  • Update your Article content type
  • Make Articles Public
  • Use the /public folder to build a quick blog demo

Module 4: React Restful Web API with Strapi CMS frameworks (CRUD)

  • Install Strapi and React
  • Installing React Router Dom + Recap
  • Set up React Router Dom to create Pages
  • Create a new Page and set up Navigation
  • Adding image upload to the Create Form
  • Simple frontend validation
  • Backend Validation
  • Error Handling in the Frontend
  • JWT validation

Day 3

Module 5: React with Redux

  • Understanding State
  • The Complexity of Managing State
  • Understanding the Redux Flow
  • Setting Up Reducer and Store
  • Dispatching Actions
  • Adding Subscriptions
  • Connecting React to Redux
  • Connecting the Store to React
  • Dispatching Actions from within the Component
  • Passing and Retrieving Data with Action
  • Adding Middleware
  • Using the Redux Devtools
  • Executing Asynchronous Code
  • Introducing Action Creators
  • Action Creators & Async Code
  • Handling Asynchronous Code
  • Restructuring Actions
  • Using Utility Functions

Module 6: React JWT Authentication

  • Create Services
  • Authentication service
  • Data service
  • Create React Components for Authentication
  • Form Validation overview
  • Login Page
  • Register Page
  • Profile Page
  • Create React Components for accessing Resources
  • Home Page
  • Role-based Pages
  • Add Navbar and define Routes
  • Add CSS style for React Components
  • Configure Port for React JWT Auth Client with Web API

Day 4

Module 7: React Hooks กับ Firebase CRUD

  • What is firebase
  • FireBase Connection with React
  • Sending Data to firebase
  • Retriving The Data from Firebase
  • Modifying the retrived data from firebase
  • FireBase CRUD Demo
  • Designing AddUser component
  • Sending User Data to firebase
  • Retreving userslist from firebase
  • FireBase CRUD Delete User
  • Adding Sweetalert Animation

Module 8: React Firebase Authentication

  • Firebase Authentication Demo
  • Firebase Authentication - Design
  • Firebase Authentication Implementation

Module 9: React Deployment

  • Connecting to Online DB & Preparing for deploy
  • Push project to GitHub
  • Deploying Strapi CMS frameworks on Heroku
  • Deploying React js on Heroku
  • Deploying React js on Vercel
  • Deploying React js on Firebase Web hosting

16 ชั่วโมง

ราคา 800 บาท

ลงทะเบียนแล้ว

175 คน

สั่งซื้อวิดีโอบันทึกการอบรม
ติดต่อตามข้อมูลด้านล่างนี้