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

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

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

สาขากรุงเทพฯ (ลาดพร้าว)
  • ยังไม่มีรอบเปิดอบรม (ลงชื่อจองไว้ได้)
  • สามารถ พัฒนาโปรเจ็กต์ด้วย TypeScript ได้
  • นักเรียนนักศึกษา
  • ครู อาจารย์ วิทยากรที่สนใจ
  • นักวิชาการ นักไอที หรือผู้ดูและระบบ
  • ตลอดจนผู้สนใจทั่วไป

ในหลักสูตรนี้เป็นการต่อยอดเนื้อหาจากหลักสูตร React JS Basic สำหรับผู้เริ่มต้น เพื่อให้ผู้เรียนได้มีทักษะความรู้ในหัวข้อที่สำคัญๆ อีกหลายประเด็น

  • 18 ชั่วโมง
  • ราคาปกติ 9,500 บาท / คน
  • โปรโมชั่นลด 10% เหลือ 8,550 บาท / คน
  • ราคาเหมาจ่าย (ผู้อบรมตั้งแต่ 10 คน) ตามแต่ตกลงกัน
  • ขอใบเสนอราคา

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

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

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

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
08/11/2024 14:10:48