React को datastore से connect करें: सरल integration tutorial

17 जुलाई 2026 · jsdeck team · 4 मिनट पढ़ना

अगर आपने connect React to a datastore खोजा है, तो आप चाहते हैं कि काम करने वाले कोड से सार्वजनिक URL तक का सबसे छोटा, भरोसेमंद रास्ता मिले — बिना सर्वर खड़े किए, विशाल cloud डैशबोर्ड सीखे, या पहले उपयोगकर्ता से पहले क्रेडिट कार्ड डाले। यह गाइड बताती है कि jsdeck के साथ यह कैसे करें, trade-off क्या हैं, और कब कोई दूसरा टूल वास्तव में बेहतर है। हम इसे व्यावहारिक रखेंगे: असली कदम, असली कमांड, और ईमानदार caveats।

jsdeck का datastore वास्तव में क्या है

यह per-app JSON key-value store है। हर record में string key, arbitrary JSON value, filtering के लिए तीन optional string index columns (idx1–idx3), और updatedAt timestamp होता है। आप static frontend से सीधे छोटे REST API पर, या @jsdeck/toolkit npm client से read/write करते हैं। आपको run, patch, या scale करने के लिए कोई server नहीं।

connect React to a datastore के लिए यह क्यों matter करता है

ज़्यादातर prototypes को Postgres नहीं चाहिए। उन्हें settings object save करना, high score persist करना, submissions की list store करना, या user ने last time क्या किया याद रखना चाहिए। JSON store इस sweet spot पर है: data exactly app state जैसा shape रखता है, full database के schema, migration, या connection-pool ceremony के बिना।

Modes और access control

datastore दो modes में से एक में चलता है। public_read में anyone records read कर सकता है लेकिन writes के लिए आपकी store_ key चाहिए। private में reads और writes दोनों key माँगते हैं। PUT requests per IP rate-limited हैं। key non-sensitive app data के लिए shared secret है — client-side code में real secrets कभी न डालें।

Example: JSON save और load

// Save
await fetch('https://jsdeck.com/api/v1/public/data/YOUR-SLUG/records/settings', {
  method: 'PUT',
  headers: {
    'Authorization': 'Bearer store_YOUR_KEY',
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({ value: { theme: 'dark', lang: 'en' } }),
});

// Load
const res = await fetch('https://jsdeck.com/api/v1/public/data/YOUR-SLUG/records/settings');
const { value } = await res.json();

Owner rows के साथ per-user data

हर visitor का अपना private data चाहिए? datastore को visitor auth के साथ combine करें। visitor login के बाद session token मिलता है; visibility: "owner" के साथ record लिखें और वह row सिर्फ उस user readable/writable हो जाती है। सिर्फ store_ key से read नहीं हो सकती। gated demos और simple per-user apps full backend के बिना possible बनाता है।

कब fit नहीं होता

data model के बारे में ईमानदार रहें। datastore joins वाले relational data, schema migrations, या transactions के लिए सही tool नहीं; realtime subscriptions, server-side functions या triggers, full-text search, और file/blob storage नहीं देता। query model "key plus up to three string indexes (AND-combined)" है, arbitrary SQL नहीं। ये चाहिए तो Postgres/Supabase या full backend लें।

यह किसके लिए है, और jsdeck कब नहीं

अच्छा fit: static frontends, single-page apps, demos, portfolios, MVPs, AI-generated exports, और ऐसे apps जिन्हें थोड़ी JSON persistence या हल्का visitor login चाहिए।

Fit नहीं: ऐसे apps जिन्हें long-running Node server, request time पर server-side rendering, WebSocket backends, private server-side secrets, background jobs, या full relational database चाहिए। उनके लिए comparisons hub में चर्चित alternatives बेहतर होंगे — और यह जानबूझकर चुनने की बात है, compromise नहीं।

अक्सर पूछे जाने वाले प्रश्न

क्या connect React to a datastore वाकई मुफ़्त है?

हाँ। jsdeck इस तरह के प्रोजेक्ट्स के लिए HTTPS सहित मुफ़्त static hosting देता है, शुरू करने के लिए क्रेडिट कार्ड की ज़रूरत नहीं। datastore और visitor auth जैसी optional features ज़रूरत पड़ने पर उपलब्ध हैं।

क्या datastore use करने के लिए server चाहिए?

नहीं। datastore hosted REST API है जिसे static frontend से सीधे call करते हैं। run, scale, या patch करने के लिए कुछ नहीं।

हर user का data private कैसे रखूँ?

visitor auth use करें और visibility: "owner" records लिखें। वे rows सिर्फ owner token से accessible हैं, shared datastore key से नहीं।

अगले कदम

datastore hub में और guides explore करें
पहला ऐप deploy करने के लिए getting started guide follow करें
datastore, secure accounts (auth API), और CLI deploy details के लिए developer docs पढ़ें