बनाना, परखना, सुधारना

माइक्रोसीमेंट के अनुप्रयोग में विशेषज्ञता रखने वाली कंपनी, जीएम माइक्रोसीमेंटोस के लिए एक कॉर्पोरेट वेब प्लेटफ़ॉर्म का पूर्ण-स्तरीय विकास। प्रदर्शन, एसईओ और एक असाधारण उपयोगकर्ता अनुभव पर ध्यान केंद्रित करते हुए डिज़ाइन की गई 15 अनुकूलित पृष्ठों वाली एक पेशेवर वेबसाइट। विशेषताओं में एक कोट कैलकुलेटर, एक फ़िल्टर करने योग्य प्रोजेक्ट गैलरी, उन्नत फ़ॉर्म और एक न्यूनतावादी डिज़ाइन योजना शामिल हैं। 100 से अधिक पुन: प्रयोज्य घटकों के साथ मॉड्यूलर आर्किटेक्चर और कोर वेब वाइटल्स के लिए अनुकूलन।

अकादेमिया सीईजे के लिए वेब प्लेटफ़ॉर्म, जो मालागा में न्यायिक सिविल सेवा परीक्षाओं में विशेषज्ञता रखने वाला एक प्रशिक्षण केंद्र है। यह एक पूरी तरह से रेस्पॉन्सिव वेबसाइट है जिसमें एक ब्लॉग, वर्चुअल कैंपस, ज्ञान परीक्षण, नामांकन प्रणाली और पाठ्यक्रम प्रबंधन शामिल हैं। इसे Next.js 14, React 18, Tailwind CSS, Framer Motion और Docker का उपयोग करके विकसित किया गया है।

डिमाप की कॉर्पोरेट वेबसाइट का विकास, एक आधुनिक एप्लिकेशन जो Next.js 15, React 19, Redux Toolkit और TailwindCSS का उपयोग करके बनाया गया है, जिसे इष्टतम प्रदर्शन और एक सहज उपयोगकर्ता अनुभव प्रदान करने के लिए डिज़ाइन किया गया है। इस प्रोजेक्ट में सेवा पृष्ठ, एक ब्लॉग, कॉर्पोरेट अनुभाग और लीड ट्रैकिंग के साथ फॉर्म शामिल हैं, जो सभी एक मॉड्यूलर आर्किटेक्चर पर बने हैं और SSG, लेज़ी लोडिंग और क्लाइंटलोडर के माध्यम से अत्यधिक अनुकूलित लोडिंग की सुविधा प्रदान करते हैं।

DevCrate एक प्लेटफ़ॉर्म है जो डेवलपमेंट संसाधनों (टूल्स, लाइब्रेरीज़, एसेट्स, डॉक्यूमेंटेशन और चुनौतियाँ) को खोजने के लिए है। क्या आपने कभी अपने प्रोजेक्ट के लिए किसी संसाधन की ज़रूरत महसूस की है, या बस कुछ प्रेरणा चाहिए थी, और अंत में अनगिनत पेजों को ब्राउज़ करते रह गए? इसीलिए मैंने यह प्लेटफ़ॉर्म बनाया है: वर्षों से खोजे गए सभी संसाधनों को व्यवस्थित करने और उनका हिसाब रखने के लिए, और बिखरे हुए बुकमार्क पर निर्भर हुए बिना उन्हें जल्दी से खोजने के लिए। इसमें उन्नत खोज, टैग फ़िल्टर और सभी सामग्री का प्रबंधन करने के लिए एक एडमिन क्षेत्र शामिल है। यह उपयोगी टूल संकलित करना जारी रखने के लिए सामुदायिक सुझावों की भी अनुमति देता है। इसे Next.js, React, TypeScript और MongoDB के साथ बनाया गया है, जिसमें सुरक्षित प्रमाणीकरण और shadcn/ui पर आधारित एक आधुनिक इंटरफ़ेस है।

Cmd+kit वेब उत्पादों के लिए एक पुन: प्रयोज्य कमांड पैलेट सिस्टम है, जिसे एक सुसंगत और सुलभ इंटरफ़ेस के माध्यम से त्वरित खोज, कीबोर्ड नेविगेशन और क्रिया निष्पादन प्रदान करने के लिए डिज़ाइन किया गया है। इसे React, Vue, Preact और Astro के लिए आधिकारिक एडाप्टरों के साथ विभिन्न स्टैक्स में आसानी से एकीकृत करने के लिए डिज़ाइन किया गया है, साथ ही यह समान मूल व्यवहार और दृश्य अनुकूलन को बनाए रखता है। इसमें थीम, कमांड संरचनाओं को कॉन्फ़िगर करने और उपयोग के लिए तैयार कोड निर्यात करने के लिए व्यापक दस्तावेज़ीकरण और एक इंटरैक्टिव प्लेग्राउंड शामिल है। इसे प्रत्येक प्रोजेक्ट के वर्कफ़्लो के आधार पर npm, pnpm, yarn या bun का उपयोग करके इंस्टॉल किया जा सकता है।

एक CLI टूलकिट और लाइब्रेरी जो npm पर प्रकाशित है और आपको एक ही टाइप की गई JSON फ़ाइल में API कॉन्ट्रैक्ट परिभाषित करने और स्वचालित रूप से साझा TypeScript टाइप्स, एक Angular क्लाइंट, Zod के साथ रनटाइम सत्यापन, और NestJS के लिए कंट्रोलर्स जेनरेट करने की अनुमति देती है। यह फ्रंटएंड और बैकएंड के बीच असंगतता को समाप्त करता है, डुप्लिकेट कोड को रोकता है, और कॉन्ट्रैक्ट स्नैपशॉट का उपयोग करके ब्रेकिंग चेंजेस का पता लगाता है। इसमें परीक्षण के लिए मॉक्स का निर्माण और कई पुन: प्रयोज्य पैकेजों पर आधारित एक मॉड्यूलर आर्किटेक्चर शामिल है।

Apple के AirPods Pro 2 के आधिकारिक हीरो सेक्शन का पुनर्निर्माण, जिसमें GSAP और ScrollTrigger के साथ उन्नत एनीमेशन में महारत पर ध्यान दिया गया है। मैंने 65-फ्रेम की Canvas रेंडर की गई सीक्वेंस को स्क्रॉल के साथ सिंक किया, साथ ही स्मूथ ट्रांज़िशन्स, डायनेमिक नेविगेशन और Apple की मूल शैली से प्रेरित विज़ुअल इफेक्ट्स लागू किए। यह प्रोजेक्ट उच्च-प्रदर्शन वेब एनीमेशन को बेहतर बनाने पर केंद्रित है।

Angular 19 और TensorFlow.js का उपयोग करके रियल-टाइम ऑब्जेक्ट डिटेक्शन PWA का विकास। इसमें PWA कॉन्फ़िगरेशन, TensorFlow.js एकीकरण, लाइव इमेज कैप्चर और प्रोसेसिंग, Web Workers और Lazy Loading के साथ ऑप्टिमाइज़ेशन, IndexedDB के माध्यम से ऑफ़लाइन स्टोरेज और मोबाइल डिवाइस पर डिप्लॉयमेंट शामिल है।

Three.js और TresJS को 3D मॉडल्स के साथ सीखने के लिए अभ्यास परियोजना। इंटरैक्टिव वेब एप्लिकेशन जो विभिन्न फिनिश और रंग विकल्पों के साथ स्टैंडिंग डेस्क को कस्टमाइज़ करने की अनुमति देता है। ऑर्बिट कंट्रोल के साथ 3D व्यू, लैपटॉप, हेडफोन और सजावटी पौधे के 3D मॉडल शामिल हैं। डेस्क फिनिश को कस्टमाइज़ करें और रीयल-टाइम प्रीव्यू के साथ एक्सेसरीज़ के लिए रंग चुनें। Vue 3, TresJS (Three.js और Vue का एकीकरण), TypeScript, Vite और UnoCSS से विकसित।

Grand Theft Auto VI का लैंडिंग पेज क्लोन। शैक्षिक उद्देश्यों और वेब डेवलपमेंट कौशल प्रदर्शन के लिए बनाया गया। सभी डेस्कटॉप रेजोल्यूशन (1024px - 4K) के लिए ऑप्टिमाइज्ड रेस्पॉन्सिव डिजाइन के साथ आधुनिक वेबसाइट। GSAP का उपयोग करते हुए एडवांस एनिमेशन वाला ड्रॉपडाउन मेनू, छवियों के साथ डायनेमिक कैरेक्टर और लोकेशन शोकेस सिस्टम, प्रीव्यू के साथ इंटरैक्टिव ट्रेलर सेक्शन और एनिमेटेड कार्ड्स के साथ डाउनलोड सेक्शन शामिल है। गैर-लाभकारी शैक्षिक परियोजना, Astro, Tailwind CSS और JavaScript से विकसित।

यह एक छोटा प्रोजेक्ट है जो Strapi को CMS और बैकएंड के रूप में अभ्यास करने के लिए बनाया गया है। इसे React/Next.js, TypeScript और Tailwind CSS से विकसित किया गया है। डेमो में mocked डेटा इस्तेमाल किया गया है, लेकिन कोड में कंटेंट को fetch और manage करने के लिए Strapi का वास्तविक इंटीग्रेशन मौजूद है।

प्रोडक्शन-ओरिएंटेड बैकएंड आर्किटेक्चर वाला रियल-टाइम चैट प्रोजेक्ट। यह द्विदिश संचार के लिए Node.js + Express और Socket.IO का उपयोग करता है, और दो स्टोरेज मोड देता है: in-memory (mock) और Supabase के साथ वैकल्पिक persistence। फ्रंटएंड (Vite) demo या live मोड में चल सकता है, और समाधान को लेयर्ड तरीके से (configuration, HTTP, realtime, domain, storage) संगठित किया गया है ताकि maintainability, testing और scalability बेहतर हो।

डिकैपैपी के काम के आधार पर शैक्षिक उद्देश्यों के लिए फेजर 3.55.2 के साथ निर्मित क्लासिक सुपर मारियो ब्रदर्स का HTML5 कार्यान्वयन। प्रोजेक्ट एनिमेशन, ब्लॉक, संरचना, इकाइयों, प्लेयर नियंत्रण और एचयूडी के लिए मॉड्यूलर आर्किटेक्चर के साथ 2डी प्लेटफ़ॉर्मर अनुभव को फिर से बनाता है, साथ ही HTML2canvas के साथ स्क्रीनशॉट कैप्चर जैसे अतिरिक्त सुविधाएं भी प्रदान करता है। यह Vite के साथ वेब परिनियोजन और स्थानीय विकास का समर्थन करता है, जिससे MIT लाइसेंस के तहत परीक्षण और ओपन-सोर्स योगदान सीधा हो जाता है।

Paint Win 95' Windows 95-स्टाइल के रेट्रो इंटरफेस और आधुनिक वेब व्यवहार के साथ Microsoft Paint का क्लासिक अनुभव दोबारा बनाता है। इसमें ड्रॉइंग और सेलेक्शन टूल्स, प्राइमरी/सेकेंडरी कलर पैलेट, undo/redo हिस्ट्री, वर्किंग ज़ूम लेवल, लोकल इमेज खोलना, PNG एक्सपोर्ट, और Pointer Events के जरिए माउस, कीबोर्ड व टच/स्टायलस इनपुट सपोर्ट शामिल है।

Bookshop View Transitions एक React + Vite डेमो है, जो View Transitions API के साथ पेजों के बीच स्मूद ट्रांजिशन लागू करने पर केंद्रित है। इसमें एलिमेंट्स (शीर्षक, कवर और नेविगेशन) के बीच साझा एनीमेशन शामिल हैं, ताकि नेविगेशन दृश्य रूप से निरंतर महसूस हो।

React, TypeScript और Vite से बना TikTok क्लोन, जिसे mobile-first दृष्टिकोण के साथ डिज़ाइन किया गया है। इसमें autoplay वाला vertical feed, Following/For You नेविगेशन, interactive actions (like, comments, saves, share), Friends/Inbox/Profile पेज और feed में publish करने वाला upload शामिल है। यह service-based architecture पर चलता है (default रूप से localStorage persistence के साथ mock) और real backend connection के लिए Supabase तैयार रखता है।

क्लासिक Breakout से प्रेरित यह ओपन-सोर्स प्रोजेक्ट Astro और Canvas पर TypeScript गेम लॉजिक के साथ बनाया गया है। इसमें कैनवास के अंदर कठिनाई चयन, गेंद की समायोज्य और प्रगतिशील गति, अलग-अलग मजबूती वाले ब्रिक्स और उनके डैमेज स्टेट्स, कीबोर्ड कंट्रोल्स, और Game Over के बाद रीस्टार्ट फ्लो शामिल है।

इस परियोजना पर, मैंने एक टीम के साथ मिलकर एक ऐसा प्लेटफ़ॉर्म विकसित किया जो गुणवत्तापूर्ण उत्पादों को बेचने और स्थानीय व्यवसायों का समर्थन करने के लिए समर्पित है। हमने इस परियोजना पर अवधारणा से लेकर कार्यान्वयन तक काम किया, जिसमें बैक-एंड और फ्रंट-एंड दोनों का निर्माण शामिल था। विभिन्न तकनीकों के अलावा, उपयोगकर्ता खाते के प्रबंधन और लॉगिन के लिए JWT जैसे एकीकरण, सभी डेटा की निगरानी के लिए एक डैशबोर्ड... शामिल किए गए। विशेषताओं में विभिन्न सोशल मीडिया प्लेटफॉर्म के माध्यम से लॉग इन करने की क्षमता, उपयोगकर्ताओं के लिए उत्पाद खरीदने या व्यवसायों के लिए उन्हें सूचीबद्ध करने हेतु खाते बनाना, और अन्य बातों के अलावा, संबंधित उत्पाद के निकटतम स्थान को दिखाने वाले मानचित्र शामिल थे। गोपनीयता कारणों से, कोड नहीं दिखाया गया है।