हर GrapesJS प्रोजेक्ट उसी तरह शुरू होता है। आप संपादक को माउंट करते हैं, एक ब्लॉक को कैनवास पर खींचते हैं, और यह पहली दोपहर को काम करता है। वह हिस्सा वास्तव में आसान है - संपादक सॉफ्टवेयर का एक अच्छा टुकड़ा है और यह वही करता है जो वह कहता है।
फिर सवाल शुरू होते हैं। पेज कहाँ रहते हैं? दूसरे उपयोगकर्ता को खाता कैसे मिलता है?प्रकाशनका वास्तव में क्या मतलब है? क्या कार्य करताacme.coहै और इसका प्रमाणपत्र कहाँ से आता है? फॉर्म सबमिशन कहाँ जाते हैं? चार सप्ताह बाद आपने एक भी सुविधा नहीं लिखी है जिसे ग्राहक नोटिस करेगा, और आपने एक ऐसा एप्लिकेशन बनाया है जिसका GrapesJS से लगभग कोई लेना-देना नहीं है।
वह एप्लिकेशन वही है जिसे हमने पैक किया है। पेजकिट एक प्रोडक्शन Next.js ऐप है जो ओपन-सोर्स GrapesJS कोर के चारों ओर लिपटा हुआ है: ऑथ, वर्कस्पेस, मल्टी-टेनेंट प्रोजेक्ट्स, पेज स्टोरेज, एक पब्लिश पाइपलाइन, कस्टम डोमेन, लीड कैप्चर, चेकआउट और एक प्लगइन लोडर। यह एक बार के लाइसेंस के तहत स्रोत के रूप में जहाज करता है, आप इसे स्वयं होस्ट करते हैं, और आप इसकी किसी भी पंक्ति को बदल सकते हैं।
यह v0.1.0 पर है , प्री-रिलीज़, और प्रतीक्षा सूची पेजकिट पर खुली है। gjs.market.
संपादक आसान आधा है
हम ऐसा इसलिए कहते रहते हैं क्योंकि यह उत्पाद की पूरी थीसिस है। अधिकांश GrapesJS एकीकरण जो आप आज खरीद सकते हैं, वे वहीं रुक जाते हैं जहां दिलचस्प काम शुरू होता है: एक परियोजना, एक उपयोगकर्ता, प्रकाशित का अर्थ है "एक ज़िप डाउनलोड करें", और डोमेन आपकी समस्या हैं।
एक महीने में जो आधा समय लगता है वह किरायेदारी है। एक कार्यक्षेत्र में कई परियोजनाएं होती हैं, जिनमें से प्रत्येक के अपने पृष्ठ, अपना डोमेन, अपनी स्वयं की प्रकाशन स्थिति होती है। ईमेल आमंत्रणों के साथ मालिक, संपादक और दर्शक भूमिकाएं और एक गार्ड जो आपको अंतिम मालिक को पदावनत करने से रोकता है। एक ऑप्ट-इन समीक्षा गेट ताकि क्लाइंट की मार्केटिंग टीम प्रकाशित किए बिना संपादित कर सके। मिडलवेयर के माध्यम से वाइल्डकार्ड उपडोमेन और ऑन-डिमांड टीएलएस के साथ कस्टम डोमेन, इसलिए एक नया प्रोजेक्ट बिना परिनियोजन के HTTPS पर पहुंचा जा सकता है।
इनमें से कोई भी काम GrapesJS नहीं है। यह सब वह काम है जिसके बिना आप शिप नहीं कर सकते।
चार चीजें जो GrapesJS एकीकरण को तोड़ती हैं
यदि आपने पहले संपादक को एकीकृत किया है, तो आप इनमें से कम से कम एक से मिले हैं। वे वास्तविक कारण हैं कि सप्ताहांत प्रोटोटाइप को उत्पादन के लिए तैयार होने में एक महीने का समय लगता है - और प्रत्येक ने वास्तुकला को आकार दिया।
1. प्रोजेक्ट स्थिति निर्यात नहीं है।getProjectData() जो एक संपादन सत्र को पुनर्स्थापित करता है उसे लौटाता है।getHtml() और जोgetCss()आप प्रकाशित करते हैं उसका उत्पादन करते हैं। गलत एक को स्टोर करें और आप या तो संपादक मचान को आगंतुकों को शिप करते हैं या अपने उपयोगकर्ताओं को एक पृष्ठ सौंपते हैं जिसे वे अब संपादित नहीं कर सकते हैं। पेजकिट दो अलग-अलग स्टोर रखता है: सत्र के लिए एक प्रोजेक्ट-डेटा कॉलम, प्रदान की गई कलाकृति के लिए एक प्रकाशन पंक्ति। प्रकाशित पृष्ठों को दूसरे से परोसा जाता है और संपादक कोड पथ को कभी नहीं छूता है - यही कारण है कि वे कभी भी संपादक बंडल को लोड नहीं करते हैं।
2. कैनवास एक आईफ्रेम है। फ़ॉन्ट्स, सीएसएस रीसेट और किसी भी रनटाइम लाइब्रेरी को प्रदान की गई सामग्री को फ्रेम में इंजेक्ट किया जाना चाहिए। उन्हें होस्ट पेज पर जोड़ने से कुछ भी नहीं होता है, जो स्टाइलिंग बग के रूप में पढ़ता है और दोपहर के लिए गलत फ़ाइल में डिबग हो जाता है। कैनवास को जो कुछ भी चाहिए वह सब कुछ हो जाताcanvas.stylesहै औरcanvas.scripts, इसलिए संपादन करते समय आप जो देखते हैं वह प्रकाशित दस्तावेज़ वास्तव में लोड होता है।
3. घटक स्क्रिप्ट एक क्रमबद्ध स्ट्रिंग है। यह कैनवास फ्रेम के अंदर निष्पादित होता है और आसपास के दायरे को बंद नहीं कर सकता है। एक आयातित प्रतीक को संदर्भित करने वाली स्क्रिप्ट साफ-सफाई से जांच करती है और रनटाइम पर फेंकती है - अदृश्य जब तक कि कोई उपयोगकर्ता उस घटक को किसी पृष्ठ पर नहीं खींचता है। PageKit में प्रत्येक कस्टम घटक स्क्रिप्ट-प्रॉप्स के माध्यम से अपनी निर्भरता को पारित करता है, और नियम को उत्पादन में खोजे जाने के बजाय समीक्षा में लागू किया जाता है।
4. सामग्री लोड होने से पहले कस्टम प्रकारों को पंजीकृत किया जाना चाहिए। एक प्रकार को संदर्भित करने वाली सामग्री जो अभी तक पंजीकृत नहीं है, चुपचाप सादे तत्वों को कम कर देती है और उस सत्र के लिए स्थायी रूप से अपना व्यवहार खो देती है। कुछ भी त्रुटि नहीं; पृष्ठ हर बार खोले जाने पर खराब हो जाता है। प्लगइन लोडर लोड पथ चलने सेपहलेएक प्रोजेक्ट के प्लगइन्स को हल करता है और पंजीकृत करता है, और कैनवास के अंदर चुपचाप विफल होने के बजाय संस्करण-असंगत प्लगइन्स को जोर से मना कर देता है।
ओएसएस कोर
PageKit 0.23.5 परgrapesjsबनाया गया है — केवल ओपन-सोर्स कोर. तकनीकी होने से पहले यह एक लाइसेंसिंग निर्णय है: वाणिज्यिक स्टूडियो SDK में एक प्रति-डोमेन लाइसेंस होता है जिसे आपको पुनर्वितरित नहीं किया जा सकता है, जो इसे स्रोत के रूप में बेचे जाने वाले उत्पाद में अनुपयोगी बनाता है.
एक आधुनिक संपादक शेल से आप जो कुछ भी उम्मीद करेंगे - खोज योग्य ब्लॉक पैलेट, लेयर ट्री, स्टाइल मैनेजर, लक्षण, डिवाइस स्विचिंग, एक आशावादी संस्करण टोकन द्वारा संरक्षित ऑटोसेव ताकि दो टैब चुपचाप एक दूसरे को अधिलेखित नहीं कर सकते हैं - कोर एपीआई पर बनाया गया है और आपके द्वारा प्राप्त स्रोत में जहाज किया गया है। संपादक एक कांटा के बजाय एक निर्भरता रहता है, इसलिए अपस्ट्रीम फिक्स अपस्ट्रीम रहते हैं।
बॉक्स में क्या है
नौ क्षेत्र, सभी परीक्षणों द्वारा निर्मित और कवर किए गए हैं: संपादक खोल; कैश्ड प्रकाशनों, वाइल्डकार्ड उपडोमेन और कस्टम डोमेन के साथ प्रकाशन; ओजी छवि निर्माण, साइटमैप और रोबोट के साथ प्रति पृष्ठ एसईओ; विशेषता पैनल में एक फील्ड बिल्डर के साथ प्रपत्र, हनीपोट प्लस वैकल्पिक टर्नस्टाइल या एचकैप्चा, और सीएसवी निर्यात के साथ एक लीड इनबॉक्स; भुगतान एडाप्टर के पीछे उत्पादों, कार्ट और चेकआउट के साथ माइक्रो-ईकॉमर्स; इन-एडमिन gjs.market ब्राउज़र के साथ प्लगइन लोडर; ए/बी परीक्षण और पॉपअप; टीम भूमिकाएं और अनुमोदन; ऑफ़लाइन Ed25519 लाइसेंस जांच के साथ व्हाइट-लेबल ब्रांडिंग।
भंडारण, ईमेल और भुगतान प्रत्येक एक इंटरफ़ेस के पीछे बैठते हैं, समझदार ऑफ़लाइन डिफ़ॉल्ट के साथ - स्थानीय फाइल सिस्टम, एसएमटीपी, और एक परीक्षण भुगतान प्रदाता जो बिना किसी खाते और बिना किसी कुंजी के लैपटॉप पर पूर्ण चेकआउट प्रवाह को चलाने देता है। क्रेडेंशियल्स की आपूर्ति करके S3, Resend या Postmark, Stripe या PayPal में स्वैप करें।
रिपॉजिटरी नंबर, जिन्हें आप स्रोत के खिलाफ खुद चला सकते हैं: चार श्रेणियों में 19 संपादक ब्लॉक, छह कस्टम घटक प्रकार, 11 बूंदा बांदी माइग्रेशन में 23 डेटाबेस टेबल, 12 प्लेराइट एंड-टू-एंड स्पेक्स, 10 यूनिट सुइट, और 16 रनटाइम पैकेजों के बीच शून्य जीपीएल निर्भरता।
आपका इंस्टॉल कैटलॉग के साथ शिप करता है
प्लगइन लोडर उत्पाद का प्रथम श्रेणी का हिस्सा है, और gjs.market स्टोरफ्रंट व्यवस्थापक में एक पूर्ण स्क्रीन के रूप में बनाया गया है, पाद लेख में लिंक नहीं। मैनिफेस्ट ज़ोड-मान्य हैं, कुछ भी पंजीकृत होने से पहले आपके इंस्टॉल किए गए GrapesJS के खिलाफ सेमवर रेंज की जांच की जाती है, औरnpm run create-pluginएक नया मचान बनाया जाता है। एक इंस्टॉल का विस्तार करने का मतलब इसे फोर्क करना नहीं है।
क्या अभी तक नहीं बना है
दो बातें, और हम चाहेंगे कि आप इसे खरीदने के बाद खोजने के बजाय इसे अभी पढ़ें। बहु-भाषा पृष्ठ - प्रति-स्थान वेरिएंट और एक भाषा स्विचर ब्लॉक - डिज़ाइन किए गए हैं लेकिन लिखे नहीं गए हैं; आज रिपॉजिटरी में कोई i18n कोड नहीं है। आपकी अपनी कुंजी के विरुद्ध AI कॉपी जनरेशन भी नहीं लिखा गया है, और वर्तमान स्रोत में कोई AI निर्भरता नहीं है। दोनों सार्वजनिक रोडमैप पर हैं।
ऊपर सूचीबद्ध बाकी सब कुछ बनाया गया है और परीक्षण के अधीन है।
इसे चलाना
Node.js 20+, PostgreSQL 16, और या तो डॉकर के साथ एक VPS (docker compose upपोस्टग्रेस, ऐप और कैडी लाता है) या प्रबंधित पोस्टग्रेज के साथ Vercel । डॉकर पथ के लिए लगभग 1 जीबी रैम, और उपडोमेन रूटिंग के लिए एक वाइल्डकार्ड डीएनएस रिकॉर्ड। साझा होस्टिंग काम नहीं करेगी - Next.js नोड रनटाइम की आवश्यकता है, और हम आपको धनवापसी बेचने के बजाय यहां ऐसा कहेंगे।
लाइसेंसिंग और प्रारंभिक पहुंच
एक बार, प्रति स्तर: डेवलपर $ 199 एक एकल उत्पादन परियोजना के लिए, एजेंसी $ 449 व्हाइट-लेबल एडमिन ब्रांडिंग के साथ दस क्लाइंट परियोजनाओं के लिए, अपने स्वयं के होस्ट किए गए उत्पाद को चलाने और अंतिम उपयोगकर्ताओं को चार्ज करने के लिए SaaS / असीमित $ 899 । हर स्तर के साथ बारह महीने के अपडेट शामिल हैं; प्रति वर्ष लाइसेंस मूल्य के 40% पर बाद में नवीनीकृत करें। क्योंकि आप स्वयं-होस्ट करते हैं, आप अपने स्वयं के शेड्यूल पर अपग्रेड करते हैं - अपडेट को कभी भी चल रहे इंस्टॉल पर मजबूर नहीं किया जाता है।
लाइसेंस जांच एक लंबी छूट अवधि के साथ Ed25519-हस्ताक्षरित टोकन को ऑफ़लाइन सत्यापित करती है। यदि हमारा लाइसेंस सर्वर पूरी तरह से गायब हो जाता है, तो सबसे बुरा होता है आपके व्यवस्थापक पैनल में एक बर्खास्तगी नोटिस होता है। यह कभी भी डैशबोर्ड को ब्लॉक नहीं करता है और कभी भी प्रकाशित पृष्ठ को नहीं छूता है।
प्रारंभिक पक्षी: पहले 20 खरीदारों को आजीवन अपडेट के साथ डेवलपर मूल्य पर एजेंसी टियर मिलता है।
प्रतीक्षा सूची अब पेजकिट पर खुली है। gjs.market - लॉन्च के समय एक ईमेल, अर्ली-बर्ड बोनस और रोडमैप। और कुछ नहीं।