- Primo v3.2 साइट को लोकल फाइलों और सर्वर डेटाबेस rows, दोनों के रूप में दर्शाता है, जिससे एजेंट कोड ठीक कर सकते हैं और non-technical editors उसी साइट को ब्राउज़र में संपादित कर सकते हैं
- डेवलपर्स Svelte components और YAML फाइलों से pages, content, settings और routes संभालते हैं, और
primo push के जरिए सर्वर के relational database के साथ sync करते हैं
- ब्राउज़र एडिटर rendered page के ऊपर text editing, block drag-and-drop, custom page types और fields देता है, जिससे form-केंद्रित CMS स्क्रीन पर निर्भरता कम होती है
- इसका मुख्य लक्ष्य वे डेवलपर्स, फ्रीलांसर और एजेंसियां हैं जिन्हें non-technical editors को custom sites सौंपनी होती हैं, और यह 12 starters तथा 40 से अधिक blocks प्रदान करता है
- content, PocketBase-आधारित SQLite में रहता है, कोड उपयोगकर्ता के repository में बना रहता है, और MIT लाइसेंस व
primo pull static export के जरिए service dependency कम की जा सकती है
फाइल और डेटाबेस को साथ इस्तेमाल करने वाला CMS मॉडल
- Primo v3.2 2019 से चल रहा एक open source CMS है, जो पूरी साइट को एक साथ files और database rows, दोनों के रूप में दर्शाता है
- लोकल फाइलें एजेंट सीधे संपादित करते हैं, और सर्वर डेटाबेस ब्राउज़र में इंसानों द्वारा विज़ुअली एडिट किए जाने के लिए इस्तेमाल होता है
- मूल workflow यह है कि पहले एजेंट से साइट बनाई जाए, फिर बाद में client या परिचित लोगों को browser editing permission दे दी जाए
- उदाहरण में
claude pricing page type बनाता है, pages/pricing.yaml, blocks/pricing-tiers/component.svelte लिखता है, और फिर primo push से 3 फाइलें deploy करता है
- deploy के बाद उपयोगकर्ता ब्राउज़र में pricing tier का text और price सीधे बदल सकते हैं
एजेंट द्वारा संभाली जाने वाली लोकल फाइल संरचना
primo pull पूरी साइट को सामान्य फाइलों के रूप में डाउनलोड करता है
- इसमें components, pages, content, settings और routes शामिल होते हैं
- blocks, Svelte components होते हैं और content व settings YAML में होते हैं
- नई साइट scaffold की जा सकती है या मौजूदा साइट डाउनलोड की जा सकती है
- Claude Code, Cursor, Codex जैसे CLI agents पूरे repository को लक्ष्य बनाकर बदलाव करते हैं
- यह उसी तरह का workflow है जैसे Next.js या SvelteKit codebase के पूरे codebase को एडिट करना
- उदाहरण command है
$ claude "redesign the pricing page"
primo push बदली हुई फाइलों को सर्वर के relational database के साथ sync करता है
- client ब्राउज़र में उसी साइट को rendered page पर एडिट करते हैं
- blocks द्वारा घोषित fields, editable fields के रूप में दिखते हैं
rendered page पर एडिट होने वाला CMS
- एडिटर rendered page के ऊपर काम करता है और अलग CMS tab या form view को डिफॉल्ट editing experience के रूप में अनिवार्य नहीं बनाता
- blocks द्वारा घोषित सभी fields clickable surfaces और labels के रूप में दिखते हैं
- यह renderer द्वारा पढ़े जाने वाले उसी model का इस्तेमाल करता है, इसलिए कोई अलग transformation layer नहीं है
- on-page editing rendered page के text पर क्लिक करके सीधे टाइप करने का तरीका है
- field chips इस समय एडिट हो रहे item को दिखाते हैं
- drag-and-drop blocks से page tree में blocks को reorder, add और remove किया जा सकता है, और बदलाव तुरंत source में लिखे जाते हैं
- custom page types में page structure एक बार define करने के बाद client उसी model को तोड़े बिना जितने चाहें उतने pages बना सकते हैं
- custom fields text, rich text, image, link, number, group और repeater को support करते हैं
- editing UI schema से generate होती है
- real-time collaboration में कई लोग एक ही page को साथ में एडिट कर सकते हैं, जिसमें live presence indicator और conflict-free editing शामिल है
- structured form view का उपयोग SEO, metadata, repeater और hidden settings जैसे fields के लिए होता है जो page पर दिखाई नहीं देते
custom site creators के लिए starters और blocks
- Primo का लक्ष्य वे डेवलपर्स, फ्रीलांसर और एजेंसियां हैं जो non-technical editors के लिए custom sites बनाते हैं
- marketplace client type के हिसाब से starters और आम section blocks प्रदान करता है
- restaurant, coach, portfolio और local service के starters इसके उदाहरण हैं
- कुल मिलाकर 12 starters और 40 से अधिक blocks दिए जाते हैं
- हर starter एक self-contained site होता है
- इसमें Svelte components और typed fields शामिल होते हैं
- यह repository में scaffold होता है
- इसमें framework lock-in या hidden runtime नहीं होता
- उपयोगकर्ता starter को fork करके modify और deploy कर सकते हैं, या अपने starters और blocks को curate कर सकते हैं
WordPress, headless CMS और site builders से अंतर
- WordPress editable sites देने में मदद करता है, लेकिन इसकी तुलना ऐसी संरचना से की गई है जहां content और PHP themes आपस में उलझ जाते हैं
- headless CMS कोड संरचना साफ रख सकता है, लेकिन schema अलग admin screen में रहता है
- site builders drag-and-drop देते हैं, लेकिन उनका output platform से उधार लिए गए रूप में देखा जाता है
- Primo जिस अंतर पर जोर देता है वह यह है कि एक ही source को टीम और agents मिलकर एडिट करते हैं
- कोड की जगह Svelte files और उपयोगकर्ता का repository है
- client editing की जगह rendered page है
- schema
.svelte के बगल में fields.yaml में रखा जाता है
- agents पूरी साइट को files के रूप में एडिट कर सकते हैं
- hosting और licensing को self-host और MIT के रूप में पेश किया जाता है
डेटा स्वामित्व और संचालन की स्थिति
- content, PocketBase के जरिए SQLite में स्टोर होता है, और कोड उपयोगकर्ता के repository में बना रहता है
primo pull किसी भी समय code और content का static export देता है
- Primo, MIT license के तहत है, और इसका कहना है कि अगर प्रोजेक्ट बंद भी हो जाए तो चल रहा कोड और बनाई गई साइटें काम करती रहेंगी
- संचालन की स्थिति 7वें वर्ष में v3.2 की है, और production site के उदाहरणों में agency client work, small commerce stores, documentation sites और इसकी अपनी marketing pages शामिल हैं
- agents को किसी नए प्रोडक्ट के रूप में नहीं बल्कि 2019 से बनाए रखे गए उसी model के नए client के रूप में देखा जाता है
Payload, TinaCMS, Sanity Studio और React support
- Payload एक headless CMS है, जहां schema admin screen में होता है और content API के जरिए लाया जाता है
- TinaCMS की तुलना Markdown files के सामने Git-आधारित editor रखने वाले तरीके से की गई है
- Sanity Studio hosted content lake के ऊपर बना React-आधारित admin screen है
- Primo में editor और renderer एक ही Svelte files और database rows पढ़ते हैं, और इनके बीच कोई API transformation layer नहीं होती
- React को फिलहाल Primo blocks में support नहीं किया जाता
- Primo, Svelte के compile-time approach पर केंद्रित होकर बनाया गया है, और यही संरचना blocks को ऐसी files बनाती है जिन्हें editor और renderer सीधे पढ़ सकते हैं
- Primo block के अंदर React support roadmap में नहीं है
- roadmap में
primo integrate <framework> शामिल है
- पहले मौजूदा SvelteKit app के ऊपर Primo जोड़ने का तरीका आएगा
- उसके बाद Astro का उल्लेख है, और Next.js अभी wish list में है
- इस दिशा में production components उस framework में बने रहेंगे और Primo केवल content व editor संभालेगा
block संरचना और CLI authentication
- blocks साथ रखी गई दो फाइलों से बनते हैं
- component rendering संभालता है
- schema एडिटर को बताता है कि कौन से fields मौजूद हैं
- उदाहरण
blocks/hero/fields.yaml में headline, subheadline, cta fields घोषित हैं
headline और subheadline का type text है
cta का type link है
- CLI authentication environment variable
PRIMO_TOKEN पढ़कर करता है
- token, हर साइट के लिए admin screen में generate किया जाता है
primo pull <host> प्रोजेक्ट को clone करता है
primo push केवल बदली हुई फाइलें upload करता है
- authentication वही है जो editors इस्तेमाल करते हैं, इसलिए अलग API surface सीखने की जरूरत नहीं है
- यह HTTPS के जरिए सभी Primo instances पर काम करता है, जिनमें self-hosted instances भी शामिल हैं
शुरुआत के लिए command
- नया workspace नीचे दिए गए command से बनाया जाता है
npx primo-cli init my-workspace
- बनने के बाद
workspace ready और server.yaml written status दिखाई देते हैं
- लाइसेंस और pricing message को MIT, open source और हमेशा के लिए free के रूप में पेश किया जाता है
1 टिप्पणियां
Hacker News की राय
ब्लॉक को drag-and-drop करने वाला CMS editor demo में शानदार दिखता है, लेकिन कंपनी के अंदर ऐसा ही editor चलाकर देखा तो यह अंतहीन updates वाला नरक निकला
“क्या text को right-align करके नीला बना सकते हैं?” जैसी requests लगातार आती रहती हैं, और आखिर में हर block में properties बढ़ती ही जाती हैं
असल content writers के लिए इसे प्रभावी तरीके से इस्तेमाल करना मुश्किल होता है और output भी आम तौर पर संतोषजनक नहीं होता
ज़्यादा training देने से सुधार हो सकता है, लेकिन freedom और brand identity बनाए रखने के बीच compromise हमेशा रहता है
हमारे मामले में headless CMS बेहतर approach लगता है। सिर्फ content दें, और कुछ experts design के हिसाब से code में implement करें—यह बेहतर है, लेकिन हर किसी के पास ऐसी सुविधा नहीं होती, इसलिए ऐसे CMS की जगह भी निश्चित रूप से है
कुछ महीने पहले एक client की e-commerce site को revamp करते समय Maglev से editable sections/blocks बनाए, और editing experience अपने आप में अच्छा था
लेकिन launch के बाद client ने एक marketing person hire किया जिसे HTML/CSS की बहुत basic जानकारी थी, और उसे यह समझाने में काफी मुश्किल हुई कि सीधे HTML/CSS लिखने के बजाय ज़रूरी sections developer से बनवाने चाहिए
Primo की तरह developer editor जोड़ने का तरीका हो सकता है, लेकिन लंबे अनुभव के आधार पर मैं नहीं चाहता कि client site के HTML/CSS को खुद छुए
“अगर तोड़ दिया तो पैसे दो” जैसा रिश्ता भी नहीं चाहिए
व्यापक रूप से देखें तो किसी भी CMS में यही समस्या है। मैंने एक ऐसी company की भी मदद की थी जिसकी Webflow site टूट गई थी—designer के बनाने के बाद marketing person ने UI को “improve” करने की कोशिश की और सब कुछ तोड़ दिया, यह बिल्कुल typical case था
बनाए जा सकने वाले components की संख्या की एक सीमा होती है
आदर्श रूप में ऐसा CMS चाहिए जिससे client बिना code के HTML आसानी से बदल सके। तभी pages जल्दी load होंगे, search optimization भी अच्छा होगा, और developers को फिर से पहिया invent नहीं करना पड़ेगा
इसलिए Versoly(https://versoly.com/) बनाया। Background color बदलने या नया section जोड़ने के लिए हर बार developer से संपर्क क्यों करना पड़े, यही लगा था
लेकिन कोई भी CMS इस्तेमाल करें, content editor को text right-align करके नीला बनाने की इच्छा वाली समस्या फिर भी रहती है, ऐसा लगता है
अभी official docs लगभग नहीं हैं, लेकिन अगर interest हो तो first page देखकर बताएं कि इस्तेमाल करके देखने लायक है या नहीं
General feedback या अपने अनुभवों से मिली सीख भी सुनना चाहूँगा
https://brick-cms.com/
GitHub:
https://github.com/primocms/primo
पिछली चर्चा:
https://news.ycombinator.com/item?id=23820201
https://news.ycombinator.com/item?id=25301040
Show HN, text के साथ, ऐसी जगह से जो मूल लेखक का कोई दूसरा account लगता है:
https://news.ycombinator.com/item?id=36801101
SSG का मतलब Static Site Generator लगता है, लेकिन किसी खास field से थोड़ा भी बाहर निकलें तो क्या readers के लिए समझना आसान बनाने की कोशिश ज़रूरी नहीं है?
मैं web development करता हूँ, फिर भी इस acronym को decode करने में मुझे एक पल सोचना पड़ा
फिर भी जो users अभी नहीं जानते, उनके लिए इसे पूरा लिखना ज़्यादा मददगार हो सकता है
Blog posts या reviews जैसे लगातार आने वाले dynamic content को handle करने वाला ऐसा tool हो तो अच्छा होगा
लोग WordPress से काफी जुड़े हुए हैं, लेकिन customization और themes किसी nightmare से कम नहीं हैं
उस समय blog आसानी से बनाने के लगभग इकलौते तरीकों में से एक यही था
समस्या यह है कि जैसे ही standard scope से बाहर जाते हैं, अचानक WordPress की internal structure की deep knowledge चाहिए होती है
करीब 3 साल पहले HN ने open source CMS Primo को front page पर जगह दी थी(https://news.ycombinator.com/item?id=23820201), और उसी की बदौलत मैंने pandemic के बीच अपनी आरामदायक remote job छोड़कर इस पर full-time काम शुरू कर दिया
उसके बाद अपनी सारी savings खर्च कर दीं, primo.af domain Taliban के हाथों खो दिया, और अपनी पत्नी को developer/designer बनकर मदद करने के लिए भी मना लिया
फिर भी इस दौरान जो बनाया उस पर गर्व है, और लोगों को web development सीखने, personal sites launch करने और client sites manage करने में इससे मदद मिलती देखकर इस approach की ताकत और simplicity पर मेरा भरोसा और बढ़ गया
आज public beta में जारी किया जा रहा Primo 2 page पर सीधे content editing, page building वगैरह देता है
Primo को मैंने इसलिए बनाना शुरू किया क्योंकि websites बनाना और non-technical users के लिए उन्हें manage करना कितना मुश्किल है, इस हकीकत से मैं थक गया था
Freelance projects में fragile WordPress themes, dashboard navigation और plugins के जोड़-तोड़ से जूझना पड़ता था; और agency developer के तौर पर monolithic CMS और metaframework/headless CMS landing pages या brochure sites के लिए जरूरत से ज्यादा भारी लगते थे
Coding instructor के तौर पर मैंने देखा कि students CLI, API, package managers, bundlers, frameworks और metaframeworks का सामना करते हुए web का उपयोग करने से डर जाते थे
blogs, landing pages और brochure sites जैसी आम websites बनाने, manage करने, develop करने और host करने के लिए कोई सरल और accessible रास्ता नहीं था
Primo मूल रूप से एक CMS है जो content को आसानी से manage करने देता है, लेकिन page building, code editing, static site generation और GitHub deployment/hosting को भी एक ही interface में जोड़ता है
Blocks Svelte, यानी HTML/CSS/JS में लिखे जाते हैं, इसलिए वे responsive होते हैं और उनकी styles encapsulated रहती हैं
Static site होने के कारण serverless के cost, security, scalability और speed benefits भी मिलते हैं
Primo उन लोगों के लिए नहीं है जो SquareWixFlow जैसे WYSIWYG design controls पसंद करते हैं; यह उनके लिए है जो HTML/CSS/JavaScript से site पर पूरा control चाहते हैं, लेकिन अपने लिए और अपने non-technical friends/clients/collaborators के लिए बहुत simple content editing experience भी देना चाहते हैं
यह उन लोगों को target करता है जो no-code tools और proprietary platforms से परेशान हैं, लेकिन code की power बनाए रखते हुए कुछ ज्यादा simple चाहते हैं
इससे आगे, Primo web को व्यक्तियों के हाथों में बनाए रखने की कोशिश है
अगर web publishing को ज्यादा accessible बनाया जाए, तो उम्मीद है कि technical literacy बढ़ेगी और लोगों को black boxes और walled gardens की ओर आसानी से धकेले जाने से बचाते हुए free expression उनके हाथ में रहेगा
लेकिन content management system समस्या था। मैं उम्मीद कर रहा था कि सामान्य static site generators की तरह किसी folder में Markdown files डालने पर templates के हिसाब से articles या blog posts generate होंगे
एक समय मैंने Primo repository fork करके database entries को file/folder structure में बदलने का custom तरीका implement किया था, लेकिन reverse direction मुश्किल लगी, इसलिए दूसरा रास्ता चुना और इस guide से inspiration लेकर अपना Markdown static site generator बनाया: https://joshcollinsworth.com/blog/build-static-sveltekit-mar...
मेरा use case शायद target audience न हो, लेकिन अगर project database में लिखे जाने के बजाय dynamic file/folder structure में save हो और सामान्य SvelteKit project की तरह edit व version-control किया जा सके, तो यह शानदार product होगा
मूल रूप से यह component library और dedicated UI वाला Svelte-based static site generation framework बन जाएगा
Forum भी अच्छा है, और मेरे मन में आए कुछ सवालों के जवाब पहले से मौजूद थे
मैं लंबे समय से WordPress इस्तेमाल करता आया हूं और हाल ही में Svelte आजमा रहा हूं; यह सच में उसी चीज के काफी करीब है जिसकी मुझे तलाश थी
इसे बनाने में लगी मेहनत के लिए बहुत सम्मान
अच्छा project है, लेकिन “self hosting” के लिए Supabase account चाहिए, यह थोड़ा निराशाजनक है
लगता है कि यह सिर्फ उन खास hosting services पर काम करता है जो Supabase से connect कर सकती हैं, और page content को GitHub से लाने के लिए प्रेरित करता है
इसलिए यह सचमुच self-hostable CMS के बजाय कुछ specific service providers के साथ चलने वाले CMS जैसा ज्यादा लगता है
लक्ष्य था कि लोग अपना server जितनी आसानी से हो सके खड़ा कर सकें, इसलिए इसे उन services से connect कराया गया
हालांकि backend को अलग करके सच में खुद host करने लायक बनाने पर काम चल रहा है
सच में जरूरी external service सिर्फ GitHub है, और बाद में GitLab जैसे दूसरे providers भी जोड़े जा सकते हैं
अच्छा project है, लेकिन सच कहूं तो अब मुझे लगता है कि developers और users दोनों के लिए कम JavaScript, या बिना JavaScript वाला तरीका बेहतर है
मैं अपना पुराना blog Zola(https://www.getzola.org) से generate होने वाले नए blog पर shift कर रहा हूं, और React/Gatsby से नया बनाया portfolio site भी performance difference बहुत ज्यादा होने के कारण फिर से Zola में बना रहा हूं
कभी-कभी मैं JavaScript बंद करके web browse करता हूं, और उस हालत में अगर कोई site पूरी तरह काम न करे या load तक न हो, तो यह बड़ी कमी है
पुरानी site jQuery इस्तेमाल करती थी, जिससे कुछ हद तक झुंझलाहट होती थी, और React जैसी चीजें आजमाना nightmare था
अंदर से यह Svelte compiler इस्तेमाल करता है
यह यकीन करना लगभग मुश्किल है कि Stiqr नाम का site generator बनाए हुए 10 साल से भी ज़्यादा हो चुके हैं, जिसे मैंने 2010 में बनाया था
साइट अब चलती नहीं है, लेकिन YouTube वीडियो में उसके निशान देखे जा सकते हैं
https://www.youtube.com/watch?v=B-ff53t8TuU&t=224s
उस समय, 2010 में, responsive design के उभरने के साथ मुझे प्रोजेक्ट बंद करना पड़ा, लेकिन मुझे अब भी लगता है कि निकट भविष्य में वेबसाइट बनाने का तरीका इसी दिशा में होगा
drag-and-drop/block तरीके और Svelte का संयोजन वाकई शानदार है, लेकिन मेरे लिए यह spectrum के गलत छोर वाला tool लगता है
यह एक visual website builder है, जिसमें ऑनलाइन editor से blocks को customize किया जाता है
मैं जो चाहता हूँ, वह मेरे अपने tools से offline बनाई गई Svelte website के लिए एक online interface है, जहाँ client text जोड़/बदल सके या छोटे adjustments कर सके
अच्छा होगा अगर किसी खास interface standard के हिसाब से site बनाने पर Primo उसे पढ़ सके, और client visual interface से उसमें बदलाव कर सके
बड़े बदलाव फिर मेरे पास वापस आएँ, और मैं अपने offline workflow की speed और freedom बनाए रख सकूँ
कोई कह सकता है कि headless CMS चाहिए, लेकिन जो भी मैंने इस्तेमाल किए वे सभी जरूरत से ज्यादा complex थे और सिर्फ setup व maintenance ही बड़ा headache बन गए थे
जब तक आप खास fields नहीं बनाते, visual पहलू—जैसे image को circular या square बनाना—edit नहीं किए जा सकते
अगर local IDE इस्तेमाल न कर पाना समस्या है, तो अभी Svelte components को vanilla JavaScript में bundle करके Primo block में import करना और fields के जरिए data pass करना संभव है
हालांकि stable होने तक production में इस्तेमाल करने से पहले कुछ हफ्ते इंतज़ार करना बेहतर होगा
आपने जो तरीका बताया, वह दरअसल client projects पर मेरे काम करने के तरीके जैसा ही है। मैं सारा code लिखता हूँ, आम तौर पर दूसरे projects के blocks reuse करता हूँ, और फिर client को ऐसी site सौंपता हूँ जिसे वह पहले दिन से ही न्यूनतम training के साथ edit कर सके
क्या आपका मतलब है कि “block customization” में text changes शामिल नहीं हैं, या यह कि client को सौंपने के लिए संभव actions पर्याप्त रूप से सीमित नहीं हैं?
इसमें सामान्य page markup के अंदर drag-and-drop से managed sections insert किए जा सकते हैं, और यह Svelte सहित ज़्यादातर frameworks को support करता दिखता है
setup FTP से किया जा सकता है