सभी प्रोजेक्ट्स

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

GM Microcementos Website

GM Microcementos Website

GM Microcementos के लिए कॉर्पोरेट वेब प्लेटफॉर्म का पूर्ण विकास, जो एक माइक्रोसीमेंट एप्लिकेशन में विशेषज्ञ कंपनी है। 15 ऑप्टिमाइज्ड पेजों के साथ प्रोफेशनल वेबसाइट, जो परफॉर्मेंस, SEO और बेहतरीन यूजर एक्सपीरियंस पर केंद्रित है। बजट कैलकुलेटर, फिल्टर करने योग्य प्रोजेक्ट गैलरी, एडवांस फॉर्म और मिनिमलिस्ट डिजाइन सिस्टम शामिल है। 100+ पुन: उपयोग योग्य कॉम्पोनेंट्स और Core Web Vitals ऑप्टिमाइजेशन के साथ मॉड्यूलर आर्किटेक्चर।

Academia CEJ Website

Academia CEJ Website

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

DIMAP वेबसाइट

DIMAP वेबसाइट

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

Agrooe Cashback

Agrooe Cashback

इस परियोजना में, मैंने गुणवत्तापूर्ण उत्पाद बेचने और स्थानीय वाणिज्य का समर्थन करने पर केंद्रित एक मंच बनाने के लिए एक टीम के साथ काम किया।.

DevCrate

DevCrate

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

AirPods Pro 2 वेबसाइट क्लोन

AirPods Pro 2 वेबसाइट क्लोन

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

Angular के साथ ऑब्जेक्ट डिटेक्शन PWA

Angular के साथ ऑब्जेक्ट डिटेक्शन PWA

tensorflow
ionicons-v5_logos

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

GTA VI लैंडिंग पेज क्लोन

GTA VI लैंडिंग पेज क्लोन

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

3D डेस्क कॉन्फ़िगरेटर

3D डेस्क कॉन्फ़िगरेटर

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

Strapi गेम्स स्टोर

Strapi गेम्स स्टोर

यह एक छोटा प्रोजेक्ट है जो 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 बेहतर हो।

सुपर मारियो ब्रदर्स 85'

सुपर मारियो ब्रदर्स 85'

PhaserIcon

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

Paint Windows 95'

Paint Windows 95'

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

बुकशॉप व्यू ट्रांजिशन डेमो

बुकशॉप व्यू ट्रांजिशन डेमो

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

TikTok क्लोन

TikTok क्लोन

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 तैयार रखता है।

Atari Breakout गेम

Atari Breakout गेम

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

मुझे थोड़ा और जानें

नमस्ते! मैं फ्रान हूं सॉफ्टवेयर डेवलपर | फ्रंट-एंड और फुल स्टैक

मेरे पास वेब तकनीकों की विस्तृत विविधता के साथ काम करने का अनुभव है। फिर भी, मेरी विशेषता और मुख्य फोकस फ्रंट-एंड विकास पर है।

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