ในหลักสูตรนี้เป็นการต่อยอดเนื้อหาจากหลักสูตร 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