สร้าง OpenAI client

รายละเอียดสำหรับเรียนรู้ React ปี 2020-2023 โดยโค้ชพล ดูหลักสูตรได้ที่ https://www.nextflow.in.th/react-training

สร้าง OpenAI client

ในโปรเจคนี้เราใช้ component จาก react-bootstrap นะ

Part 1: User Interface

  1. โคลนโปรเจคด้วยคำสั่งด้านล่าง
git clone -b starter https://github.com/teerasej/nextflow-openai-react-redux-simple
cd nextflow-openai-react-redux-simple
npm install 
  1. สร้าง User Interface: Prompt input
  2. สร้าง User Interface: Chat history
  3. สร้าง User Interface: ChatMessage

Part 2: Redux

  1. สร้าง Redux store
  2. สร้าง Reducer Slice
  3. ดึงข้อมูลจาก Reducer มาใช้ด้วย useSelector()
  4. สร้างและเรียกใช้ Action
  5. สร้าง Thunk เพื่อเรียกใช้ Async Operation Azure OpenAI Service OpenAI API
  6. (Optional) คุยต่อเนื่อง Azure OpenAI service