# ★★अपने React ऐप में Omniston को कैसे इंटीग्रेट करें

क्या आप अपने TON-आधारित ऐप में शक्तिशाली, विकेंद्रीकृत स्वैप्स जोड़ना चाहते हैं? Omniston इसे आश्चर्यजनक रूप से आसान बनाता है। यह गाइड आधिकारिक React SDK का उपयोग करके Omniston को एकीकृत करने की आवश्यक बातें बताती है।

#### Omniston क्या है?

Omniston TON ब्लॉकचेन के लिए बनाया गया एक विकेंद्रीकृत लिक्विडिटी एग्रीगेशन प्रोटोकॉल है। यह कई DEXs और मार्केट मेकर्स को एक एकीकृत सिस्टम में जोड़ता है, यह सुनिश्चित करते हुए कि टोकन स्वैप करते समय आपके उपयोगकर्ताओं को हमेशा सबसे अच्छी संभव कीमत मिले। Request-for-Quote (RFQ) तंत्र का उपयोग करके सबसे अधिक लिक्विड पाथ्स के माध्यम से ट्रेड रूट करके, यह मूल्य खोज की जटिलता को संभालता है — ताकि आपको ऐसा न करना पड़े।

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXdveSq1KFhLJ2dxrOl_oaZ48MPvYiUvSvki2M1b-jeH6rCw5I8kNeiaKI7ZdvgkHJ_VcoSyuF2AbE7wOZrKRif-DFlA-OIWvYYjp6Hukb5CojE7HGo6AYCyIIy6rgxoNmtk5aw2nQ?key=BVHWJ_biPGWttmm0y5ElMXkT" alt="" width="375"><figcaption></figcaption></figure>

#### Omniston को किसे एकीकृत करना चाहिए?

वॉलेट्स से लेकर DeFi प्लेटफ़ॉर्म्स तक, Omniston कार्यक्षमता, दक्षता और नए राजस्व स्रोत खोलता है:

* वॉलेट्स और पोर्टफोलियो ऐप्स → इन-वॉलेट स्वैप्स के साथ उपयोगकर्ताओं को अपने ऐप में बनाए रखें और रेफ़रल आय उत्पन्न करें।
* गेम्स और NFT मार्केटप्लेस → खिलाड़ियों को UI में ही मूल रूप से टोकन कन्वर्ट करने दें, जिससे अधिक खरीदारी और बेहतर UX मिले।
* DeFi dApps → तुरंत लिक्विडिटी एकत्र करें और सर्वोत्तम कीमतें दें — कई DEX APIs को प्रबंधित करने की आवश्यकता नहीं।
* TON स्टार्टअप्स → विकास को तेज़ करें और पहले दिन से ही DeFi-स्तरीय कार्यक्षमता प्रदान करें।

अब, देखते हैं इसे अपने ऐप में कैसे लाना है।

#### 🛠 क्विक स्टार्ट: इंटीग्रेशन के 6 चरण

**1. SDK इंस्टॉल करें**

अपने प्रोजेक्ट में SDK जोड़कर शुरू करें:

`pnpm install @ston-fi/omniston-sdk-react`

इस पैकेज में वे सभी React hooks और utilities शामिल हैं जिनकी आपको ज़रूरत होगी।

🧠 प्रो टिप: SDK पूरी तरह से ओपन-सोर्स है — यदि आप और गहराई से जानना चाहते हैं या लॉजिक को अनुकूलित करना चाहते हैं, तो[ GitHub repo](https://github.com/ston-fi/omniston-sdk-react) शुरू करने के लिए एक बेहतरीन जगह है।

**2. अपने ऐप को OmnistonProvider से रैप करें**

अपने ऐप के रूट कंपोनेंट में (जैसे, *\_app.tsx* या *index.tsx*), अपने एप्लिकेशन को provider से रैप करें:

`import { OmnistonProvider } from "@ston-fi/omniston-sdk-react";`

`<OmnistonProvider apiUrl="wss://omni-ws.ston.fi">`

&#x20; `{/* your app components */}`

`</OmnistonProvider>`

यह Omniston के aggregation backend के साथ WebSocket कनेक्शन स्थापित करता है।

🧠 प्रो टिप: किसी backend की आवश्यकता नहीं है। SDK blockchain संचार और quote प्रबंधन को WebSocket के माध्यम से संभालता है — आपका इंटीग्रेशन हल्का और केवल frontend-आधारित रहता है।

**3. TON वॉलेट सपोर्ट जोड़ें**

आप wallet connectivity एकीकृत करने के लिए TON Connect का उपयोग कर सकते हैं:

`pnpm install @tonconnect/ui-react`

फिर TonConnect के hooks का उपयोग करके एक "Connect Wallet" बटन बनाएं। इससे उपयोगकर्ता Tonkeeper या TON Space जैसे परिचित वॉलेट्स का उपयोग करके लेनदेन को मंज़ूरी दे सकते हैं।

**4. एक Quote अनुरोध करें**

स्वैप quotes प्राप्त करने के लिए Omniston के hook `useRfq` का उपयोग करें।

Omniston आवश्यक होने पर स्वचालित रूप से मध्यवर्ती टोकन के माध्यम से रूट करता है और उपलब्ध सर्वोत्तम कीमत लौटाता है।

🧠 प्रो टिप: आपके token pair के लिए कोई pool नहीं? कोई समस्या नहीं। Omniston smart routing का उपयोग करके intermediary tokens के माध्यम से रास्ते खोजता है — आपके उपयोगकर्ता TON पर उपलब्ध किसी भी टोकन को स्वैप कर सकते हैं।

**5. स्वैप निष्पादित करें**

एक बार जब उपयोगकर्ता quote की पुष्टि कर देता है, तो लेनदेन निष्पादित करने के लिए `useOmniston` hook का उपयोग करें।&#x20;

Omniston on-chain स्वैप्स को सुरक्षित रूप से निष्पादित करने के लिए HTLC-आधारित smart contracts का उपयोग करता है।

🧠 प्रो टिप: Omniston की RFQ प्रणाली उपयोगकर्ता के साइन करने से पहले ही दर लॉक कर देती है। स्लिपेज के कोई आश्चर्य नहीं — उपयोगकर्ताओं को वही दर मिलती है जिस पर उन्होंने सहमति दी थी।

**6. स्वैप स्थिति ट्रैक करें (वैकल्पिक)**

उपयोग करें `useTrackTrade` ट्रेड की प्रगति की निगरानी करने और उसके अनुसार अपने UI को अपडेट करने के लिए। यह उपयोगकर्ता को फ़ीडबैक देने के लिए बहुत अच्छा है — उदाहरण के लिए, आप ट्रेड के on-chain पुष्टि होने तक एक लोडिंग स्पिनर दिखा सकते हैं, फिर टोकन स्वैप होने के बाद एक सफलता संदेश प्रदर्शित कर सकते हैं।

#### 🔍 और अधिक जानना चाहते हैं?

* डेमो ऐप:[ omniston.ston.fi](https://omniston.ston.fi)
* क्विकस्टार्ट गाइड: [Omniston Guide ](https://docs.ston.fi/developer-section/quickstart/omniston)
* GitHub Repo:[ STON.fi Omniston SDK\ <br>](https://github.com/ston-fi/omniston-sdk-react)

आप लाइव Replit उदाहरण को fork कर सकते हैं और ब्राउज़र में तुरंत प्रयोग कर सकते हैं।

***

#### 🧠 प्रो टिप

Omniston रेफ़रल फ़ीस के माध्यम से revenue-sharing का समर्थन करता है। अपने ऐप के माध्यम से निष्पादित प्रत्येक ट्रेड पर शुल्क कमाने के लिए स्वैप अनुरोध में एक `referrer` address सेट करें।

***

Omniston ब्लॉकचेन-आधारित टोकन स्वैप्स की जटिलता को सरल बनाता है और एक उच्च-स्तरीय SDK प्रदान करता है जो किसी भी आधुनिक React library जैसा ही महसूस होता है। चाहे आप एक वॉलेट, एक गेम, या एक पूर्ण DeFi ऐप बना रहे हों — Omniston जोड़ने से सिर्फ़ कुछ कोड लाइनों में गहरी लिक्विडिटी और स्मार्ट रूटिंग आपके हाथों में आ जाती है।

<br>


---

# Agent Instructions: 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:

```
GET https://guide.ston.fi/en/hi/react-omniston.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.
