यह फोल्डर (`nava-web`) Nava Sanskritam का Web Playground है। यह एक पूर्णतः ब्राउज़र-आधारित ऑनलाइन सङ्कलक (compiler) और UI रेंडरिंग इंजन है, जो डेवलपर को ब्राउज़र में ही सीधे `.ns` (Nava Sanskritam) कोड लिखने, सङ्कलन (compile) करने और लाइव आउटपुट देखने की सुविधा देता है।
🚀 मुख्य घटक (Core Components)
1. index.html
यह मुख्य वेब पेज है जिसमें यूजर इंटरफ़ेस (UI) परिभाषित है। यह Tailwind CSS का उपयोग करके डिज़ाइन किया गया है और दो मुख्य भागों में विभाजित है: बायां भाग (Monaco Editor) और दायां भाग (कंसोल आउटपुट और लाइव UI - दर्शनम्)।
2. playground.js
यह मुख्य जावास्क्रिप्ट फाइल है जो पूरे वेब प्लेग्राउंड के तर्क (logic) को संभालती है।
- इसमें Monaco Editor का सेटअप है, जो सिंटैक्स हाइलाइटिंग प्रदान करता है।
- यह WebAssembly (`nvc.wasm`) मॉड्यूल को लोड और प्रारंभ करता है।
- `createDrishyam` फ़ंक्शन: यह फ़ंक्शन JSON आउटपुट को लेता है और उसे वास्तविक HTML DOM एलिमेंट्स में बदलता है।
3. nvc.wasm & nvc.js
यह C++ में लिखे गए मुख्य Nava Compiler (`nvc`) का WebAssembly (WASM) संकलित रूप है। ब्राउज़र में कोड निष्पादन सीधे क्लाइंट-साइड पर होता है।
⚙️ यह कैसे काम करता है? (Workflow)
1. कोड इनपुट
उपयोगकर्ता Monaco Editor में Nava Sanskritam कोड लिखता है।
2. सङ्कलन
WASM बाइंडिंग के माध्यम से कोड C++ कंपाइलर को भेजा जाता है।
3. JSON निष्कर्षण
कंपाइलर UI संरचना का वर्णन करते हुए JSON आउटपुट लौटाता है।
4. रेंडरिंग
`createDrishyam` फ़ंक्शन HTML घटक बनाता है और उन्हें रेंडर करता है।
🎨 दर्शनम् (Live UI Components)
`createDrishyam` फ़ंक्शन Nava के UI घटकों को निम्नलिखित HTML घटकों में मैप करता है:
📖 मुख्य शब्दावली (Core Vocabulary & Syntax)
Nava Sanskritam भाषा में उपयोग होने वाले मुख्य शब्द और उनका अर्थ। इन शब्दों का उपयोग करके आप कोड लिखते हैं।
अस्ति (asti)
Variable Declarationइसका उपयोग एक नया वेरिएबल (चर) बनाने के लिए किया जाता है, जिसका मान बाद में बदला जा सकता है। यह JavaScript के `let` के समान है।
आयु अस्ति २५;
नित्य (nitya)
Constant Declarationइसका उपयोग एक ऐसा मान परिभाषित करने के लिए किया जाता है जो पूरे प्रोग्राम में कभी नहीं बदलेगा। यह JavaScript के `const` के समान है।
सर्वर_पोर्ट नित्य ८०८०;
यदि ... तर्हि ... अन्यथा
Conditional Statementsशर्तों (conditions) की जांच करने के लिए इसका उपयोग होता है।
- यदि (yadi): 'If' (अगर यह शर्त सही है...)
- तर्हि (tarhi): 'Then' (तो यह करो...)
- अन्यथा (anyatha): 'Else' (वरना यह करो...)
वद "आप प्रवेश कर सकते हैं।";
} अन्यथा {
वद "आप प्रवेश के लिए योग्य नहीं हैं।";
}
वद (vada) / print / show
Output / Printकंसोल पर कुछ भी आउटपुट (दिखाने) के लिए `वद` (या `print` / `show`) का उपयोग होता है। यह JavaScript के `console.log()` के समान है।