6 पॉइंट द्वारा GN⁺ 2025-05-04 | 5 टिप्पणियां | WhatsApp पर शेयर करें
  • व्यक्तिगत ब्लॉग को पहले से मौजूद domain पर static page के रूप में बनाकर, content जोड़ने और बुनियादी SEO—दोनों को पूरा करने वाली न्यूनतम implementation का लक्ष्य रखा गया
  • implementation एक छोटे template.html, markdown2, O1 से बनवाए गए render.py, और सरल Markdown में लेखन के क्रम से आगे बढ़ता है
  • template में system-ui, अधिकतम चौड़ाई 70ch, color-scheme: light dark, viewport, UTF-8 जैसे केवल बुनियादी HTML/CSS का उपयोग किया गया है
  • render.py ./posts/{post}/eng.md को HTML में बदलता है, image path समायोजित करता है, फिर ./blog/{post}.html और index.html बनाता है
  • यह दिखाता है कि Jekyll, Ghost, WordPress के बिना भी केवल static rendering और hosting से चलने वाला ब्लॉग बनाया जा सकता है

न्यूनतम ब्लॉग आवश्यकताएँ और वास्तविक संरचना

  • शुरुआत चार आवश्यकताओं से हुई
    • पहले से स्वामित्व वाला domain इस्तेमाल करना
    • आधुनिक web standards का पालन करना और ठीक-ठाक SEO होना
    • नया content जोड़ना बहुत आसान होना
    • सभी pages statically build होने चाहिए
  • वास्तविक implementation flow सरल है
    • एक छोटा template.html लिखना
    • pip install markdown2 चलाना
    • O1 से render.py script बनवाना
    • लेख लिखने के बाद उसे render करके host करना
  • Jekyll, Ghost, WordPress जैसे मौजूदा blog engines का उपयोग नहीं किया गया

टेम्पलेट और rendering script

  • template.html में बुनियादी HTML document structure और न्यूनतम CSS ही है
    • color-scheme: light dark से light/dark color scheme तय की गई है
    • मुख्य text style को system-ui, sans-serif, अधिकतम चौड़ाई 70ch, line height 1.5, और font size 1.25em पर सेट किया गया है
    • id="head-link" वाले home link और {{ content }} placeholder का उपयोग किया गया है
  • render.py markdown2 की मदद से Markdown लेखों को HTML में बदलता है
    • input directory ./posts है, output directory ./blog है
    • हर लेख ./posts/{post_directory}/eng.md से पढ़ा जाता है
    • पहले # header को लेख के शीर्षक के रूप में इस्तेमाल किया जाता है
    • fenced-code-blocks, header-ids options के साथ Markdown convert किया जाता है
    • image path के <img src=" को /posts/{post_code}/ के आधार पर बदला जाता है
    • template के {{ content }} को converted HTML से replace किया जाता है और title string भी लेख के शीर्षक में बदल दी जाती है
  • index page भी इसी script में बनाया जाता है
    • greetings.md को पहले HTML में convert किया जाता है
    • हर लेख का शीर्षक पढ़कर /blog/{post_code}.html link list में जोड़ा जाता है
    • अंतिम result को index.html के रूप में save किया जाता है
  • लेख 2025-03-31 को मैन्युअली लिखा गया था

5 टिप्पणियां

 
ifmkl 2025-05-07

मैं भी अभी अपना ब्लॉग बिल्कुल ऊपर बताए गए तरीके से चला रहा हूँ। मैं अपनी व्यक्तिगत ज़रूरतों को पूरा करने वाला एक SSG बनाकर इस्तेमाल कर रहा हूँ। थंबनेल इमेज, category और tag फीचर का उपयोग करने के लिए मैंने अलग-अलग custom फीचर जोड़े हैं। जो इमेज अटैच करता हूँ, उन्हें अपने-आप webp में कन्वर्ट करके रेफ़र कराया जाता है, और इसकी वजह से rendering speed से मैं बहुत संतुष्ट हूँ।

 
winterjung 2025-05-07

ओह, तो क्या आप ऐसी custom features सीधे खुद code लिखकर जोड़ते जाते हैं? मैं भी हमेशा DIY करने की सोचता हूँ, लेकिन पहले से इस्तेमाल किए गए SSG blog frameworks के दिए हुए extensions और plugin features की वजह से हिचकिचाहट होती है।

 
ifmkl 2025-05-07

लालच थोड़ा कम कर दें, बस इतना कर लें तो बाकी चीज़ें ज़्यादा मुश्किल नहीं रहतीं। ssg भी अगर AI से कहें तो वह सारा कोड लिख देता है, और फीचर जोड़ने को कहें तो सच में वह सब कुछ जोड़ भी देता है, हाहा

 
ndrgrd 2025-05-04

अगर सिर्फ़ फ़ॉन्ट सुंदर चुन लें, तो उसे देखना काफ़ी अच्छा लगता है।

 
GN⁺ 2025-05-04
Hacker News की राय
  • इस ब्लॉग पोस्ट का chart याद आया: https://molodtsov.me/2023/02/how-to-start-your-blog-in-2023/
    static site generator (SSG) के दलदल में फंसने पर, जिन लेखों को असल में लिखना चाहता था या जो काम करना चाहता था, उनकी जगह ज़्यादातर समय SSG खुद के बारे में लिखने और उससे छेड़छाड़ करने में निकल रहा था
    आखिर में SSG छोड़कर WordPress install किया और फिर उसकी चिंता छोड़ दी; इससे काफी आज़ादी महसूस हुई
    अगर लक्ष्य छेड़छाड़ करना और उस प्रक्रिया के बारे में लिखना है तो ठीक है, और जिन लोगों की tinkering लिखने में बाधा नहीं बनती उनके लिए भी ठीक है, लेकिन मेरे लिए ऐसा नहीं था
    लिखने के पल में आखिरी चीज़ जो चाहिए होती है, वह है टालने का कोई बहाना

    • 2025 का WordPress दो खतरनाक खूबियां साथ लेकर चलता है
      WordPress और सभी plugins को up to date न रखा जाए तो वे compromise हो सकते हैं, और BDFL ऐसा व्यक्ति है जो मामूली निजी वजहों से security updates पहुंचाने या receive करने की access रोक सकता है
      static sites में patch करने लायक security vulnerabilities नहीं होतीं, इसलिए अगर कोई SSG project maintainer की समस्या की वजह से पूरी तरह ढह भी जाए तो ज़्यादा फर्क नहीं पड़ता, लेकिन WordPress में यह बहुत अहम हो जाता है
    • मेरे साथ भी कुछ ऐसा ही था। बहुत पहले DokuWiki से शुरू किया था, फिर GitHub Pages आज़माने का फैसला किया, और सब कुछ migrate करने के बाद search की जरूरत पड़ी तो custom Google Search लगा दिया
      visitors के comments छोड़ने का तरीका चाहिए था, इसलिए Disqus जोड़ा, और अंत में कई services और ढेर सारे JavaScript का मिला-जुला गड़बड़झाला बन गया
      कुछ साल पहले फिर से अपना data खुद own करने और external services पर निर्भर न रहने के लिए Disqus comments export किए, Serendipity से छेड़छाड़ की, और आखिर में WordPress पर settle हुआ
      comments और Markdown pages import कर सका, और ऐसा plugin भी था जो सब कुछ Fediverse पर publish कर देता था
      SQLite पर चलाने लायक बनाया और automatic updates चालू रखे, तो practically maintenance की जरूरत खत्म हो गई
    • क्या यह blog spam है? :) URL है https://rakhim.org/honestly-undefined/19/
    • सहमत हूं, लेकिन मेरा मानना है कि 95% मामलों में WordPress जरूरत से ज्यादा है
      जिन features की शायद जरूरत ही न पड़े, उनकी वजह से बहुत ज्यादा maintenance चाहिए। up to date न रखा तो आप botnet का हिस्सा बन सकते हैं
      ज्यादातर blogs के लिए static site generator काफी है, और maintenance की जरूरत हो भी तो मैं अपने मनचाहे समय पर कर सकता हूं
    • nikola से काफी संतुष्ट हूं: https://getnikola.com/
      मुझे सच में बस publish करने के लिए एक command और पोस्ट में images आसानी से drag-and-drop करने का तरीका चाहिए था; पहला अच्छी तरह काम करता है और दूसरा Jupyter Notebook publishing feature से संभव है
      जो मैं बिल्कुल नहीं चाहता था, वह था “HTML को client तक भेजने” के लिए database जैसा बोझ जोड़ना
  • अच्छा है, लेकिन इसे blog कहने के लिए दो छोटे features और चाहिए लगते हैं
    पहला, posts को तारीख के हिसाब से sort करना, नई posts पहले दिखाना, और तारीख कहीं दिखानी चाहिए। minimal setup बनाए रखने के लिए post file का metadata, जैसे creation time, इस्तेमाल किया जा सकता है
    दूसरा, जाहिर है RSS feed चाहिए। existing script और minimal RSS template से केवल links और titles वाला simple feed आसानी से बनाया जा सकता है

    • RSS अच्छा है, लेकिन किसी चीज़ को blog माना जाए इसके लिए यह अनिवार्य शर्त नहीं होनी चाहिए
      “follow” किया जाना हमेशा अच्छा नहीं होता, और यह readers के हिसाब से ढलने का pressure बना सकता है। यही वही factor है जो social media को खराब बनाता है
    • बात सही है
      1 के लिए मैं TOML जैसे format में metadata वाली file automatically generate करने की तरफ झुक रहा हूं
      2 RSS निश्चित रूप से जोड़ूंगा, लेकिन वह 1 पर निर्भर है :-)
  • मुझे independent websites हमेशा पसंद रही हैं, और मेरी अपनी website भी करीब 25 साल पहले कुछ इसी तरह शुरू हुई थी
    उस समय मुझे जो उपयुक्त technology आती थी, वह सिर्फ Classic ASP थी, इसलिए मैंने इसे minimal setup में, सरलता से सिर्फ ASP से बनाया था
    अब यह Common Lisp से statically generated site के रूप में चलती है, और लगता है यही configuration लंबे समय तक रहने वाली है: https://github.com/susam/susam.net/blob/main/site.lisp
    साधारण pages के एक bundle से शुरुआत करना minimum viable website बनाने का अच्छा तरीका था, लेकिन समय के साथ RSS feed, date-wise blog list, tag-wise index, tools·games·demos जैसी non-blog content support, और third-party के बिना comments जैसे features की जरूरत पड़ने लगी
    हर बार requirements बढ़ीं तो source भी बढ़ा, और जो code कुछ सौ lines का था, वह अब करीब 1300 lines of Common Lisp हो गया है
    फिर भी मैं इसे ऐसे level पर रखना चाहता हूं कि पूरा code एक बार में दिमाग में रखा जा सके, और bug आने पर 10 मिनट के भीतर reason करके fix किया जा सके
    इन दिनों मन हो रहा है कि पसंदीदा bloggers के posts की list देने वाला blogroll जोड़ूं। यह feed reader की जगह भी ले सकता है, लेकिन कोशिश है कि यह email तक पढ़ने वाली चीज़ बनकर बड़ा न हो जाए

    • मैंने भी लगभग यही रास्ता अपनाया था
      source code यहां है: https://github.com/brilee/modern-descartes-v2/blob/master/ma...
      इसमें RSS feed, date-wise blog list, tagging system, और file watching recompilation वाला local development server शामिल है
    • मेरा रास्ता भी similar था, और सच कहूं तो मैंने इसे कुछ बार दोहराया भी है
      current version 1000 lines से कम Python script में maintained है: https://github.com/llimllib/obsidian_notes/blob/c93b9b5c46fe...
    • बिल्कुल यही बात है। “मैं यह device बनाना चाहता हूं” तय करके खुद code कर पाने की क्षमता किसी भी WYSIWYG से बेहतर है
      मैंने posts के bundles, indexes, slideshows जैसी derived pages बनाई हैं, और people और video games के लिए tag variants भी बनाए हैं
      thumbnail gallery या quote box जैसे common widgets के look and feel पर भी पूरा control रख सकते हैं
    • मैंने Lamb में Flock feature बनाया है, जो feeds को मेरे blog में syndicate करने का feature है। इसे मुख्य रूप से multi-user approach के alternative के तौर पर बनाया था: https://github.com/svandragt/lamb
      high-level reference material के तौर पर काम आ सकता है
    • RSS और dates तो पक्का चाहिए होंगे
      आगे चलकर shaders और web games भी embed करने का मन हो सकता है, बस उम्मीद है complexity बहुत ज्यादा नहीं बढ़ेगी
  • अच्छा होगा अगर browsers text/markdown और text/gemini को natively support करें
    अगर browser PDF rendering कर सकता है, तो Markdown/Gemini content के लिए simple formatter और user-configurable stylesheet जैसी चीज़ जोड़ना इतना मुश्किल नहीं होना चाहिए
    अभी भी text/plain blog लिखा जा सकता है, लेकिन वह असल hypertext नहीं होता और SEO में नुकसान होता है। link header से शायद कुछ magic किया जा सके
    दूसरे formats support करने से साफ-सुथरे ढंग से publish करने की barrier कम होगी और control users के पास लौटेगा

    • browser-native Markdown rendering अफसोस की बात है, लेकिन इसकी संभावना कम लगती है
      पहले browsers को यह agree करना होगा कि कौन-सा Markdown variant और extensions इस्तेमाल होंगे। Markdown लगभग text formats की दुनिया का CSV जैसा है, क्योंकि हर कोई इसे अपने-अपने तरीके से इस्तेमाल करता है
      बहुत minimal किया तो शिकायत होगी कि बेकार है, और extensions चुने तो शिकायत होगी कि bloated है
      short-term और long-term pros/cons पर सावधानी से चर्चा करने की कोशिश भी की जाए तो “perfect को good का enemy मत बनने दो” जैसी बात से उसे रोक दिया जा सकता है
      किसी specific feature set पर agreement हो भी जाए, तो भी सवाल है कि क्या सच में उसकी उतनी value है
      PDF को browser में सीधे पढ़ना काफी आम है, लेकिन Markdown को सीधे पढ़ने का फायदा शायद दुनिया भर के software developers के एक हिस्से और पांच अजीब लोगों को ही मिलेगा
      इसलिए अगर अपनी जिंदगी में browser-native Markdown rendering देखने को न मिले तो मुझे हैरानी नहीं होगी
    • browser की PDF rendering JavaScript से की गई थी, या कम से कम कभी तो ऐसा था
      XSLT के लिए भी ऐसी libraries हैं जिन्हें browser-native support से नया version चाहिए होने पर इस्तेमाल किया जा सकता है, और jpegxl आदि कई formats के लिए भी libraries हैं
    • क्या Gemini का भी अपना format होता है?
  • अगर html_content = html_content.replace('Minimum viable blog', title) है, तो post में जहां-जहां Minimum viable blog string आएगी, क्या वह current post title से बदल जाएगी? यह bug ही है न?

    • हां, सही पकड़ा
      article में जो code है वह O1 का बनाया पहला draft था, और यह string {{ title }} से replace कर दी गई है
  • मैं करीब 15 साल से minimal blog के साथ experiments कर रहा हूं, और कुछ tricks सीखी हैं
    const title = lines.match(/# (.+)/)[1] जैसा कुछ भी काफी है, इसलिए frontmatter से बचा जा सकता है
    मेरे blogs में posts कभी इतनी ज्यादा नहीं हुईं कि pagination, tags, categories या sorting की जरूरत पड़ी हो
    JSX, https://immaculata.dev/guides/enabling-jsx.html जैसे suspicious hack का इस्तेमाल करें तो pure server-side string builder के तौर पर काफी अच्छा है
    अब GitHub Pages में भी https://immaculata.dev/guides/using-gh-pages.html जैसी चीज़ों से Jekyll की जगह arbitrary build steps इस्तेमाल करना आसान हो गया है
    highlight.js HTML में सिर्फ तीन lines जोड़कर हो जाने वाले बेहद आसान code syntax highlighting का लगभग king है, और shiki शानदार है लेकिन slow है

  • Hugo/Zola + Cloudflare Pages जैसे standard static blog framework इस्तेमाल करें तो आसान है
    मेरा blog भी 100KB से कम का minimal setup है और original author ने जो criteria list किए हैं, वे सभी पूरे करता है
    Hugo Blog Awesome theme इस्तेमाल करता हूँ, 512kb guideline follow करके page size check किया, और images व गैर-ज़रूरी JS हटा दिए। वैसे शुरुआत से ही ज़्यादा कुछ था नहीं
    संदर्भ: https://512kb.club, https://radar.cloudflare.com/scan

  • कुछ समय तक “MVB” चलाया था, लेकिन मेरा वाला और भी simple था
    बस एक HTML page रखा, posts .txt files में लिखीं और homepage manually update किया
    काफ़ी लंबा-चौड़ा काम था, फिर भी मुझे लगता है कि modern web से निपटने से आसान था
    बाद में ज़्यादा refined approach पर shift किया और अब personal site व blog के लिए Astro इस्तेमाल कर रहा हूँ, जो सच में शानदार है
    Astro अपनी landing page पर दावा करता है कि वह “content-focused sites” के लिए सबसे अच्छा platform है, और 6 महीने इस्तेमाल करने के बाद मैं सहमत हो गया हूँ
    blog बनाने के लिए लगभग हर ज़रूरी चीज़ पर साफ़ और follow करने में आसान conventions देता है, और फालतू हिस्से हटा देता है

    • Astro सच में कमाल है। समझ नहीं आता कि यह और popular क्यों नहीं है
    • जानना चाहूँगा कि आप किसी और की theme इस्तेमाल कर रहे हैं या खुद बनाई है
  • कुछ sites पर Bun JS और JavaScript strings के अंदर HTML इस्तेमाल करने का तरीका experiment किया
    Bun में —hot flag है, जो बदलाव होने पर static HTML फिर से generate करता है
    IntelliJ IDE string के ऊपर // language=html comment detect करके अंदर के HTML को format करता है और syntax highlighting भी देता है
    template language की जगह pure JavaScript functions इस्तेमाल करने पर, template language में यह कैसे किया जाता है यह ढूँढने के बजाय ज़रूरी logic सीधे लिखा जा सकता है

  • बहुत ज़्यादा bloated और load होने में देर लगाने वाली websites से तंग आकर, मैं अपने blog में भी बहुत मिलती-जुलती approach इस्तेमाल कर रहा हूँ: https://blog.borrego.dev
    source: https://github.com/agubelu/blog

    • बहुत पसंद आया और देखने में अच्छा है। mobile पर कैसा दिखता है?