मैंने Wix छोड़ा और Claude Code तथा Notion का उपयोग करके sirome.net को शून्य से बनाया

@ak0_0me
जापानी2 माह पहले · 14 मई 2026
492K
1.4K
135
5
2.0K

TL;DR

Aketa Rashiro ने Claude Code और Next.js का उपयोग करके अपनी पोर्टफोलियो साइट को शून्य से फिर से बनाने की अपनी यात्रा साझा की है, जिसमें सहज कंटेंट अपडेट के लिए Notion API द्वारा संचालित एक कस्टम CMS बनाया गया है।

मैं अकेता राशिरो हूँ। मैंने अपनी पोर्टफोलियो साइट "sirome.net" को पूरी तरह से नया रूप दिया है!

मैंने एक प्यारी सी साइट बनाई है—सब लोग, कृपया मेरी तारीफ़ करें! 🎈

मैंने Wix से ग्रेजुएशन किया, इसे Claude Code से बनाया, और GitHub और Vercel के ज़रिए प्रकाशित किया। इस बार की खास बात है Notion के साथ इंटीग्रेशन।

मैंने एक ऐसा माहौल बनाया है जहाँ सिर्फ़ Notion में वर्क लॉग लिखकर और "Publish" दबाकर, Notion पेज सीधे साइट पर दिखाई देता है! वाह! 🎉

व्ही!

मैंने इसे क्यों दोबारा बनाया

पिछले साल के अंत में, मेरी थीसिस लिखने के दौरान Notion ने बहुत मदद की! मुझे एहसास हुआ कि Notion कितना सुविधाजनक है और मैंने अपने काम का एक आर्काइव बनाना शुरू किया।

पहले, मैं अपनी Wix साइट पर काम के रिकॉर्ड पोस्ट करता था, लेकिन मैं Wix CMS (मैनेजमेंट स्क्रीन) में आर्टिकल एडिट करने में बहुत अच्छा नहीं था।

इसके अलावा, मैंने अपने दैनिक काम के नोट्स के लिए Notion का उपयोग करना शुरू किया, और इससे पहले कि मुझे पता चलता, Notion पर एक वर्क डेटाबेस बन गया।

あけたらしろめ - inline image

ता-दा! 🎉

"काश मैं इसे सीधे एक वेबसाइट में बदल पाता...!"

आप कर सकते हैं।

Notion इतना सुविधाजनक है कि इसमें स्वाभाविक रूप से आर्टिकल को वेबसाइट के रूप में प्रकाशित करने की सुविधा है।

यह काम की बात है।

लेकिन, आप लुक नहीं बदल सकते।

चूँकि डिज़ाइन टेम्पलेट सीमित हैं, आप शायद ही दिखावट बदल सकते हैं (मई 2026 तक)।

ऐसे में, मुझे लगता है कि मुझे इसे खुद बनाना होगा।

तभी मेरे सहायक के रूप में Claude Code आया।

Claude Code ऐसा है।

बहुत प्यारा।

Claude Code पागल है

यह मेरा पहली बार Claude Code का उपयोग था।

पहले, जब मैंने ChatGPT के साथ Melo-bot बनाया था,

कोड को कॉपी और पेस्ट करना, त्रुटियों की जाँच करना, फिर से पेस्ट करना...

वह काम सच में काफी थकाऊ था।

Claude Code टर्मिनल से सीधे फ़ाइलों में सेव किए गए कोड को फिर से लिखता है।

  • "इसे थोड़ा और प्यारा बनाओ"
  • "मैं चाहता हूँ कि होवर करने पर यह धीरे से फैले"

अगर मैं ऐसी आकस्मिक टिप्पणियाँ देता हूँ, तो यह कोड को उपयुक्त रूप से फिर से लिखता है और मुझे दिखाने के लिए वहीं लागू करता है। यह "सच में पागल है।"

हालाँकि, अगर आप Claude Code से बहुत अधिक काम करवाते हैं, तो आप "टोकन लिमिट" पर पहुँच जाते हैं और इसे फिर से उपयोग करने के लिए आधा दिन या पूरा दिन इंतज़ार करना पड़ता है (मैं Claude Pro प्लान पर हूँ), इसलिए मैंने छोटे-छोटे सवाल या प्रोटोटाइप नियमित Claude या ChatGPT पर भी फेंकते हुए आगे बढ़ा।

पूफ़

मैंने Notion को अपना CMS बनाया

नए sirome.net का मूल Notion के साथ पूर्ण एकीकरण है (💡)।

मुझे अब साइट मैनेजमेंट स्क्रीन की भी ज़रूरत नहीं है।

Notion में हर दिन एक लॉग लिखें।

स्टेटस को "Published" में बदलें।

यह स्वचालित रूप से साइट पर दिखाई देता है।

इसके अलावा, प्रकाशित होने के बाद भी, अगर मैं Notion में आर्टिकल एडिट करता हूँ, तो साइट साइड अपने आप अपडेट हो जाती है।

क्या यह पागलपन नहीं है?

मैं चाहता हूँ कि आप सहानुभूति रखें।

सच में।

बेशक, मैंने आर्टिकल पेजों को भी साइट डिज़ाइन से मेल खाने के लिए डिज़ाइन किया।

फैलता है

प्यारा।

तकनीकी रूप से, यह Notion API → Next.js → Vercel का कॉन्फ़िगरेशन है, और ऐसा लगता है कि यह स्टेटस फ़ील्ड में बदलावों से ट्रिगर होकर Incremental Static Regeneration (ISR) चलाता है।

हालाँकि, मैं इसे वास्तव में नहीं समझता।

🎀 आकर्षण बिंदु 🎀

वर्क्स पेज

वर्क्स पेज पर फ़ीचर्ड स्लाइड डिस्प्ले और थंबनेल स्पेसिफिकेशन के लिए,

मैंने उन्हें लागू करते समय स्पेक्स तय किए।

इस तरह की चीज़ें (आर्टिकल से स्वचालित रूप से इमेज प्राप्त करना, क्षैतिज कर्सर मूवमेंट के साथ स्केल करना)।

"अगर ऐसा दिखे तो अच्छा लगेगा" का परीक्षण करते हुए मौके पर ही निर्माण करने में सक्षम होना Claude Code का सबसे अच्छा हिस्सा है।

एक डिज़ाइनर के रूप में, अगर मैं किसी इंजीनियर के साथ काम कर रहा होता,

तो मैंने कल्पना की कि मैं बीच में ही हार मान लूँगा, यह सोचकर, "अगर मैं इतने सारे सुधार माँगूँगा, तो वे निश्चित रूप से मुझसे नफरत करेंगे।"

AI वास्तव में कई मायनों में रचनात्मक पेशों के लिए एक क्रांतिकारी उपकरण है।

Melo-bot

Melo-bot जहाँ Melo हेडर में इलेक्ट्रॉनिक बुलेटिन बोर्ड से एक बार में एक कैरेक्टर बोलता है।

यह एक प्रोग्राम के हिस्से का पुन: उपयोग करता है जो मैंने पहले ChatGPT के साथ बनाया था।

मैं खुश था कि मैं निष्क्रिय Melo-bot को sirome.net पर बुला सका।

साथ ही, पिक्सेल आर्ट शिरो और Melo की दुनिया, जिसे मैं श्री त्सुकुनाजीरो और श्री होर के साथ 2019 के आसपास से गुप्त रूप से बना रहा था, पुनर्जीवित हो गई है।

मैं खुश हूँ; अस्तित्व में रहने के लिए धन्यवाद।

पिक्सेल आर्ट त्सुकुनाजीरो द्वारा।

एहेहे।

प्यारा।

भविष्य में, मैं धीरे-धीरे और गेम जैसे तत्व जोड़ने की योजना बना रहा हूँ।

Notion एकीकरण के कारण, लोडिंग समय कभी-कभी लंबा हो सकता है,

इसलिए कृपया इसका उपयोग समय बिताने के लिए करें।

फ़ेविकॉन जो हर सेकंड घूमता है

फ़ेविकॉन ब्राउज़र टैब पर प्रदर्शित छोटा आइकन है।

मैं GIF एनिमेशन रजिस्टर नहीं कर सका, इसलिए मैं एक सेकंड के अंतराल पर 10 PNG इमेज प्रदर्शित कर रहा हूँ।

प्यारा।

स्मार्टफ़ोन पर, मैंने इसे मेनू बटन के रूप में रखा है।

जब आप इसे टैप करते हैं तो यह पीछे देखता है।

कृपया अपने फ़ोन पर भी इसके साथ खेलने का प्रयास करें।

sirome.net

कुल दो सप्ताह में निर्मित।

तो, मुझे खुशी है कि मैं Wix से ग्रेजुएट हो सका। यह महँगा है, आखिरकार।

मैंने इसे देर रात और सुबह-सुबह थोड़ा-थोड़ा करके बनाया, और इससे पहले कि मुझे पता चलता, यह लाइव हो गया।

AI... मेरे मन में अभी भी संदेहपूर्ण भावनाएँ हैं, लेकिन मैंने प्रत्यक्ष रूप से अनुभव किया है कि दुनिया पूरी तरह से बदल गई है।

मैं अभी कानूनी मुद्दों के कारण इलस्ट्रेशन जनरेशन के लिए AI का उपयोग नहीं करना चाहता, लेकिन

मैं दिलचस्प चीज़ें बनाने के लिए डिज़ाइन और निर्माण में AI के साथ अच्छी तरह से घुलने-मिलने की उम्मीद करता हूँ।

कृपया काम के परामर्श के लिए बेझिझक मुझसे संपर्क करें।

साथ ही, अब से, मैं वर्क क्रेडिट और आर्काइव आर्टिकल पर ध्यान देना चाहता हूँ,

प्रत्येक को देखभाल के साथ प्रकाशित करना।

मैं वर्तमान में sirome.net पर मौजूद आर्टिकल को भी पूर्वव्यापी रूप से अपडेट करूँगा।

हर एक वह काम है जिसमें मैंने अपना दिल लगाया है।

सभी के लिए धन्यवाद, मैं अब तक कई चित्र बना पाया हूँ,

और मैं आभारी हूँ कि मैं इस तरह जीवित हूँ।

यह अभी भी काम चल रहा है,

लेकिन कृपया शिरो, Melo और अकेता राशिरो का समर्थन करते रहें!

साइट देखें! मैं रिप्लाई या DM के माध्यम से आपके इंप्रेशन की प्रतीक्षा कर रहा हूँ ✨

🔗 sirome.net

टेक स्टैक नोट्स

  • Claude / Claude Code
  • Next.js
  • Notion API
  • GitHub
  • Vercel
  • Sharp

वैसे, मैंने यह आर्टिकल भी Notion में लिखा है।

अगर आपको यह दिलचस्प लगा, तो कृपया शेयर करें!

अकेता राशिरो

Save to YouMind

Use YouMind to read viral articles deeply

Save the source, ask focused questions, summarize the argument, and turn a viral article into reusable notes in one AI workspace.

Explore YouMind

समझने के लिए और पैटर्न

हाल के वायरल लेख

और वायरल लेख देखें