> For the complete documentation index, see [llms.txt](https://docs.chiliz.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.chiliz.com/th/phatthana/phuenthan/how-tos/sang-dapp-ai.md).

# สร้าง dApp ด้วยเครื่องมือ AI

Vibe-coding กำลังมาแรง และมันช่วยให้คุณเริ่มต้นโปรเจกต์ Web3 ได้อย่างรวดเร็ว แม้คุณจะยังไม่รู้วิธีเขียนโค้ดก็ตาม!

หน้านี้จะให้ไอเดียในการโต้ตอบกับเครื่องมือ AI ที่คุณชื่นชอบ เพื่อรวบรวมข้อมูลที่จำเป็นในการสร้าง dApp ของคุณ

{% hint style="success" %}
หน้านี้ไม่ยึดติดกับเครื่องมือใดเครื่องมือหนึ่ง: เราให้คำแนะนำและไอเดีย prompt ที่ใช้ได้กับทุก vibe-coding tool เช่น [Cursor](https://cursor.com/), [Replit](https://replit.com/), [Lovable](https://lovable.dev/), [Claude](https://claude.ai/), [Claude Code](https://www.anthropic.com/claude-code), [Bolt](https://bolt.new/), [V0](https://v0.dev/), [Base44](https://base44.com/) หรือ AI code assistant อื่นใด
{% endhint %}

## สิ่งที่ต้องมีก่อนเริ่ม

ก่อนเริ่มต้น ตรวจสอบให้แน่ใจว่าคุณมีสิ่งต่อไปนี้:

* กระเป๋าเงินที่มีบัญชี Chiliz Chain เช่น MetaMask
  * ใช้ Spicy Testnet สำหรับการทดสอบอย่างปลอดภัย แล้วจึงใช้ Chiliz Chain Mainnet สำหรับการใช้งานจริง

{% hint style="info" %}
เรียนรู้เพิ่มเติมเกี่ยวกับ Metamask และวิธีเชื่อมต่อกับ Spicy Testnet และ Chiliz Chain Mainnet ได้ที่นี่: [ใช้งาน MetaMask](/th/riang-ru/krapao-ngoen/metamask.md)
{% endhint %}

* CHZ token ในกระเป๋าเงินนั้นเพียงพอสำหรับการปรับใช้
  * สำหรับ Chiliz Chain Mainnet คุณจะต้องซื้อ CHZ ซึ่งสามารถทำได้ที่ crypto exchange ใดก็ได้ เช่น [Coinbase](https://www.coinbase.com/) หรือ [Meria](https://meria.com/)
  * สำหรับ Spicy Testnet คุณจะต้องใช้ test CHZ token ซึ่งหาได้จาก [faucet](/th/phatthana/phuenthan/rap-token-testnet.md)
* บัญชีกับ AI code assistant เช่น ChatGPT, Gemini, Claude หรืออื่นๆ
* [บัญชี Reown](https://cloud.reown.com/sign-in) (สำหรับเชื่อมต่อ WalletKit connector)

## หาไอเดีย dApp

ขั้นตอนแรกคือการพัฒนาไอเดียที่น่าสนใจ เนื่องจากคุณกำลังสร้างบน Chiliz Chain แนวคิดของคุณควรเชื่อมโยงระหว่างเทคโนโลยี blockchain กับโลกกีฬาและความบันเทิง ลองคิดดูว่าแฟนๆ อยากได้อะไร

{% hint style="info" %}
ไอเดียที่ดีจะมีกรณีทางธุรกิจที่ชัดเจน: สร้างมูลค่าได้อย่างไร? ผู้ใช้คือใคร?

ตัวอย่างไอเดีย dApp: ตลาดทำนายผลสำหรับแฟน

* แนวคิด: แฟนๆ สามารถใช้ CHZ วางเดิมพันผลลัพธ์ของการแข่งขันที่จะมาถึง (เช่น "ทีม A จะชนะทีม B หรือไม่?")
* กรณีทางธุรกิจ: มีการเก็บค่าธรรมเนียมเล็กน้อย (เช่น 2%) จากกองรางวัลฝ่ายชนะเมื่อปิดตลาด ค่าธรรมเนียมนี้จะส่งไปยังกระเป๋าเงินผู้รับผลประโยชน์ สร้างรายได้ที่ยั่งยืน
  {% endhint %}

คุณสามารถใช้เครื่องมือ AI เพื่อระดมความคิดและปรับปรุงไอเดียของคุณได้

เมื่อมีแนวคิดที่แน่ชัดแล้ว ก็ถึงเวลาสร้าง smart contract

## การสร้าง Smart Contract ด้วย AI

เครื่องมือ AI สมัยใหม่มีความสามารถในการเขียนโค้ด smart contract ที่ปลอดภัยและมีประสิทธิภาพได้อย่างน่าประหลาดใจ

{% hint style="info" %}
Smart contract คือโปรแกรมคอมพิวเตอร์ที่เก็บไว้บน blockchain และถูกเรียกใช้งานโดยอัตโนมัติเมื่อเงื่อนไขที่กำหนดไว้ล่วงหน้าได้รับการปฏิบัติตาม Solidity เป็นหนึ่งในภาษาเขียนโค้ด smart contract หลักๆ
{% endhint %}

### คำแนะนำสำคัญในการเขียน Prompt

เมื่อเขียน prompt ให้กับ AI ของคุณ จงระบุให้ชัดเจนมากๆ เสมอ!

คำแนะนำของคุณต้องประกอบด้วย:

1. เวอร์ชัน Solidity: ระบุเวอร์ชันที่ 0.8.30 หรือต่ำกว่า เพราะ Chiliz Chain ยังไม่รองรับ Solidity เวอร์ชันล่าสุดอย่างสมบูรณ์
2. ไม่ต้องประดิษฐ์ใหม่: บอก AI ให้สร้าง contract โดยอิงจาก contract ของ OpenZeppelin ที่มีอยู่แล้วให้มากที่สุด

{% hint style="info" %}
[OpenZeppelin](https://www.openzeppelin.com/) คือแพลตฟอร์มโอเพนซอร์สสำหรับสร้าง dApp ที่ปลอดภัย

นอกจากบริการด้านความปลอดภัยและการตรวจสอบหลายอย่างแล้ว พวกเขายังมี [คลังของ smart contract ที่ผ่านการตรวจสอบจากชุมชน](https://docs.openzeppelin.com/contracts/) ให้ใช้ฟรีสำหรับโปรเจกต์ต่างๆ

ดังนั้น OpenZeppelin contracts จึงถือเป็นมาตรฐานของอุตสาหกรรม และคุณสามารถใช้งานได้อย่างปลอดภัย
{% endhint %}

3. Flat Contract: สั่งให้ AI สร้าง "flat" contract หมายความว่าโค้ดควรอยู่ในไฟล์เดียวและไม่พึ่งพา import หรือ dependency ภายนอก ซึ่งจะทำให้การยืนยันในภายหลังง่ายขึ้น
4. ที่อยู่กระเป๋าเงิน: ระบุที่อยู่กระเป๋าเงินที่จะเป็นเจ้าของ contract (ผู้ปรับใช้) และที่อยู่ที่จะรับค่าธรรมเนียม (ผู้รับผลประโยชน์) หากมี

ตอนนี้ขึ้นอยู่กับคุณแล้วในการเขียน prompt ให้กับเครื่องมือ AI ของคุณ!

หลังจาก AI สร้างโค้ด Solidity แล้ว ให้ดาวน์โหลดหากทำได้ หรือคัดลอกและบันทึกเป็นไฟล์ `.sol` บนคอมพิวเตอร์ของคุณ

## การ Compile และปรับใช้

ตอนนี้คุณต้องปรับใช้ contract บน Chiliz Chain

เราจะใช้ Remix IDE ซึ่งเป็นสภาพแวดล้อมบนเว็บฟรี เพื่อ debug, compile และปรับใช้ contract ของคุณ:

1. เปิด Remix IDE: ไปที่ [remix.ethereum.org](https://remix.ethereum.org/)
2. อัปโหลด contract ของคุณ: ในแท็บ "File Explorers" ทางซ้าย สร้างไฟล์ใหม่และวางโค้ด Solidity ที่ AI สร้างให้
3. Compile Contract:
   * ไปที่แท็บ "Solidity Compiler"
   * ตั้งเวอร์ชัน Compiler เป็น "0.8.30+xxx"
   * คลิกปุ่ม Compile

คุณสามารถดูคู่มือการปรับใช้ Remix แบบละเอียดได้ที่นี่:

{% content-ref url="/pages/VrKCqlsE2K3MWhudSDG2" %}
[Deploy ด้วย Remix](/th/phatthana/phuenthan/deploy-smart-contract/deploy-remix.md)
{% endcontent-ref %}

### การ Debug ด้วย AI

เป็นเรื่องปกติที่โค้ดเริ่มต้นจะมีข้อผิดพลาด debugger ของ Remix นั้นยอดเยี่ยมมากในการตรวจจับข้อผิดพลาด

หาก compilation ล้มเหลว ให้คัดลอกข้อความผิดพลาดจาก Remix console แล้วกลับไปที่เครื่องมือ AI และขอให้แก้ไขข้อผิดพลาดที่พบ

{% hint style="info" %}
คุณสามารถใช้ prompt แบบนี้:

"โค้ด Solidity ที่คุณให้มาเกิดข้อผิดพลาดต่อไปนี้ใน Remix IDE กรุณาแก้ไข: ..." แล้ววางข้อความผิดพลาดทั้งหมดจาก Remix
{% endhint %}

ทำซ้ำกระบวนการ compile ใน Remix และรับการแก้ไขจาก AI จนกว่า contract จะ compile ได้สำเร็จโดยไม่มีข้อผิดพลาดใดๆ

### ปรับใช้บน Spicy Testnet

เมื่อ smart contract ถูก compile แล้ว คุณต้องปรับใช้:

1. ไปที่แท็บ "Deploy & Run Transactions" ใน Remix
2. สำหรับ Environment เลือก "Injected Provider - MetaMask" ซึ่งจะแจ้งให้กระเป๋าเงินของคุณเชื่อมต่อกับ Remix
3. ตรวจสอบให้แน่ใจว่า MetaMask ของคุณเชื่อมต่อกับ Spicy Testnet ในระหว่างการทดสอบ
4. คลิกปุ่ม Deploy ใน Remix กระเป๋าเงินของคุณจะเด้งขึ้นมาให้ยืนยันธุรกรรมและชำระค่า gas ด้วย test CHZ token

หลังจากยืนยันแล้ว คุณควรเห็น contract ที่ปรับใช้แล้วภายใต้ส่วน "Deployed Contracts" ใน Remix ธุรกรรมนั้นจะปรากฏบน [Chiliscan Spicy](https://testnet.chiliscan.com/) ด้วย

## การยืนยัน Contract

ตอนนี้คุณต้องยืนยัน smart contract บน chain การยืนยัน contract ทำให้โปร่งใสและน่าเชื่อถือ ผู้ใช้สามารถอ่านและตรวจสอบ source code ของคุณได้โดยตรงบน block explorer

นี่คือวิธีทำกับ [Chiliscan Spicy](https://testnet.chiliscan.com/):

1. บน Chiliscan ค้นหาธุรกรรมการปรับใช้ของคุณและคัดลอกที่อยู่ของ contract ใหม่
2. เปิด [Chiliscan Spicy Contract Verifier](https://testnet.chiliscan.com/verifycontract)
3. กรอกแบบฟอร์มการยืนยัน: คุณจะต้องให้ข้อมูลหลายอย่าง

{% hint style="info" %}
คุณสามารถขอความช่วยเหลือจากเครื่องมือ AI ด้วย prompt แบบนี้:

"ฉันต้องยืนยัน Solidity smart contract บน Chiliscan ที่อยู่ contract คือ `0xxxxxxxx` เวอร์ชัน compiler ที่ใช้คือ 0.8.30 ช่วยบอกฉันหน่อยว่าต้องกรอกอะไรในช่อง ... ?"
{% endhint %}

4. ส่งแบบฟอร์ม หากข้อมูลทั้งหมดถูกต้อง source code ของ contract คุณจะเป็นสาธารณะบน Chiliscan!

## การสร้าง Frontend ด้วย vibe-coding tool

ตอนนี้ smart contract ของคุณใช้งานได้จริงและได้รับการยืนยันแล้ว คุณต้องมี user interface (UI) เพื่อให้ผู้คนโต้ตอบกับมันได้ คุณสามารถใช้ vibe-coding tool ใดก็ได้:

1. เข้าสู่ระบบบัญชี Coding Assistant ที่คุณเลือก
2. เริ่มโปรเจกต์ใหม่และเริ่มเขียน prompt ให้ AI ระบุให้ชัดเจนว่าคุณต้องการสร้างอะไร

{% hint style="info" %}

#### **ตัวอย่าง prompt**

"ฉันต้องการสร้าง frontend สำหรับ Chiliz Chain dApp ของฉัน ตอนนี้ฉันต้องการให้คุณสร้างสำหรับ Spicy Testnet:

* RPC endpoint: <https://spicy-rpc.chiliz.com/>
* RPC Websocket: wss\://spicy-rpc-ws.chiliz.com/
* Chain ID: 88882
* Currency Symbol: CHZ

ฉันต้องการให้ dApp ของฉันทำสิ่งนี้: XXX.\
Smart Contract Address: \[YOUR\_DEPLOYED\_CONTRACT\_ADDRESS]\
ที่อยู่กระเป๋าเงินของฉัน:

* เจ้าของคือ \[YOUR\_OWNER\_ADDRESS]
* ผู้รับผลประโยชน์คือ \[YOUR\_BENEFICIARY\_ADDRESS]

คำแนะนำ:

* สร้าง web interface โดยใช้เครื่องมือที่ใช้กันทั่วไปสำหรับ dApp
* ควรแสดง xxxx
* ผู้ใช้ควรสามารถ xxxx ได้
* เจ้าของควรมีแผงผู้ดูแลที่ป้องกันด้วยรหัสผ่านเพื่อสร้าง xxxx"
* xxxx"
  {% endhint %}

ระบุให้ละเอียดที่สุด! และอย่าลังเลที่จะปรับปรุงซ้ำๆ

## การเชื่อมต่อกระเป๋าเงินของผู้ใช้

เพื่อให้ผู้ใช้สามารถเชื่อมต่อกระเป๋าเงินของตนเองกับ dApp ของคุณ คุณจะต้องใช้โซลูชัน wallet connector เครื่องมือ AI ที่คุณเลือกควรสามารถเชื่อมต่อ [Reown's WalletKit](https://reown.com/walletkit) ให้คุณได้

คุณจะต้องสร้างบัญชี Reown:

1. [สมัครบัญชี Reown Cloud](https://cloud.reown.com/sign-in) หากยังไม่มี แล้วเข้าสู่ระบบ
2. คลิก "Create Project" ใส่ชื่อโปรเจกต์ของคุณแล้วคลิก "Continue"
3. เลือกผลิตภัณฑ์เป็น "WalletKit" แล้วคลิก "Continue"
4. เลือก framework เป็น "Next.js" แล้วคลิก "Create"

Reown Cloud จะสร้างโปรเจกต์ใหม่ให้คุณซึ่งจะสร้าง project ID ด้วย คุณจะพบมันที่มุมบนซ้าย: คัดลอก ID นั้นเนื่องจากคุณจะต้องใช้ในภายหลัง

จากนั้น สั่งให้เครื่องมือ AI ของคุณจัดการการเชื่อมต่อ

{% hint style="info" %}

#### **ตัวอย่าง prompt**

"เพิ่มฟังก์ชันการเชื่อมต่อกระเป๋าเงินโดยใช้ WalletKit ของ Reown ฉันจะให้ WalletKit project ID และ API key หลังจากที่ฉันสร้างบัญชีแล้ว ตั้งค่าให้ปุ่ม 'Connect Wallet' ใช้ WalletKit"
{% endhint %}

ทำตามคำแนะนำจาก AI และ WalletKit เพื่อทำการตั้งค่าให้เสร็จสมบูรณ์ คุณจะต้องคัดลอกข้อมูลบางส่วนจากบัญชี WalletKit ของคุณไปยังโปรเจกต์ AI ของคุณ

ดำเนินการสอบถามและทดสอบภายในสภาพแวดล้อมของ AI ต่อไปจนกว่า frontend ของ dApp จะทำงานได้อย่างสมบูรณ์และคุณพอใจกับผลลัพธ์

## การย้ายไปยัง Chiliz Chain Mainnet

จนถึงตอนนี้เราได้ขอให้ AI ทำงานกับ Spicy Testnet ทั้งหมด ซึ่งจำเป็นสำหรับการทดสอบแอปบน blockchain ที่ปลอดภัย แต่ไม่สามารถใช้สำหรับโปรเจกต์จริง เนื่องจากใช้งานได้เฉพาะกับ test CHZ token เท่านั้น ไม่ใช่ CHZ token จริง

ในการย้ายแอปจาก Spicy Testnet ไปยัง Chiliz Chain Mainnet คุณจะต้องทำขั้นตอนส่วนใหญ่ข้างต้นซ้ำอีกครั้งเป็นครั้งสุดท้าย:

1. ปรับใช้ contract ด้วย Remix อีกครั้ง แต่คราวนี้กับ Chiliz Chain Mainnet
2. ตรวจสอบว่า contract ถูกปรับใช้จริงด้วย [Chiliscan Mainnet](https://chiliscan.com/)
3. ยืนยัน contract บน [Chiliscan Mainnet Contract Verifier](https://chiliscan.com/verifycontract)
4. สุดท้าย บอก AI ให้อัปเดตแอปให้ใช้ Chiliz Mainnet ในตอนนี้ ระบุให้ชัดเจน!

{% hint style="info" %}

#### **ตัวอย่าง prompt**

"ฉันต้องการอัปเดตแอปสำหรับ Chiliz Chain Mainnet คุณต้องอัปเดตเฉพาะ RPC URL และ ChainID เท่านั้น ไม่ต้องเปลี่ยนอย่างอื่น:\
\* RPC endpoint: <https://rpc.ankr.com/chiliz\\>
\* Chain ID: 88888"
{% endhint %}

## การทดสอบขั้นสุดท้าย

ทดสอบแอปของคุณอีกครั้งหนึ่งก่อนที่จะแชร์กับใคร

เพียงเท่านี้! ตอนนี้คุณมี full-stack dApp ที่ได้รับความช่วยเหลือจาก AI และใช้งานได้จริงบน Chiliz Chain แล้ว!


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.chiliz.com/th/phatthana/phuenthan/how-tos/sang-dapp-ai.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
