इस प्रोजेक्ट के बारे में

Gentelella v4 एक मुफ्त, ओपन-सोर्स एडमिन डैशबोर्ड टेम्पलेट है जिसे Colorlib द्वारा मेंटेन किया गया है। यह लंबे समय से चल रहे Gentelella प्रोजेक्ट का पूरी तरह से नया वर्जन है, जिसने पुराने Bootstrap-और-jQuery स्टैक को vanilla JavaScript, SCSS और Vite 8 बिल्ड सिस्टम से बदल दिया है। README इसे SaaS डैशबोर्ड, CRM/ERP बैकएंड, इंटरनल एडमिन पैनल, प्रोजेक्ट-मैनेजमेंट टूल्स, ई-कॉमर्स बैकएंड, एनालिटिक्स डैशबोर्ड और बुकिंग या कंटेंट-मैनेजमेंट इंटरफेस के विकल्प के रूप में पेश करता है। इस पैकेज में 58 प्रोडक्शन-रेडी HTML पेज मिलते हैं, जिन्हें ऑटो-डिस्कवर्ड एंट्री पॉइंट्स के साथ एक मल्टी-पेज Vite ऐप के रूप में ट्रीट किया गया है। इसमें चार डैशबोर्ड वेरिएंट (ऑपरेशन्स, एनालिटिक्स, सेल्स, सिस्टम हेल्थ), ऑथेंटिकेशन स्क्रीन (Google/GitHub सोशल विकल्पों के साथ साइन-इन, रजिस्टर, पासवर्ड भूल गए, 2FA, लॉक स्क्रीन, साथ ही 403/404/500 एरर पेज), फॉर्म्स (सामान्य, एडवांस्ड कंट्रोल्स, छह-स्टेप विजार्ड, ड्रैग-एंड-ड्रॉप अपलोड, वैलिडेशन, डेट-रेंज पिकर, मल्टी-सेलेक्ट, रिच टेक्स्ट एडिटर), और सॉर्टिंग, सर्च, पेजिनेशन, रो सिलेक्शन और CSV एक्सपोर्ट के साथ DataTables पेज शामिल हैं। चार्ट्स को Apache ECharts 6 द्वारा हैंडल किया गया है, जो लेजीली इम्पोर्टेड और मॉड्यूलर हैं, जिनमें 20 डॉक्यूमेंटेड वेरिएंट जैसे लाइन, एरिया, स्टैक्ड एरिया, बार, हॉरिजॉन्टल बार, मिक्स्ड बार/लाइन, डोनट, पाई, रडार, गेज, स्कैटर, हीटमैप, फनल, कैंडलस्टिक, पोलर बार, ट्रीमैप, सैंकी, कैलेंडर हीटमैप और गैंट शामिल हैं। एप्लिकेशन पेजों में CRUD के साथ एक कैलेंडर, फोल्डर्स, रीडर पेन, कंपोज मोडाल, रिप्लाई/फॉरवर्ड और J/K/R/S/# कीबोर्ड शॉर्टकट्स के साथ एक इनबॉक्स क्लाइंट, एक चैट व्यू, एक ड्रैग-एंड-ड्रॉप कानबान बोर्ड, एक ट्री-प्लस-ग्रिड फाइल मैनेजर, नोटिफिकेशन, एडिटेबल लाइन आइटम्स के साथ एक इनवॉइस, प्रोफाइल, localStorage में सेव होने वाली सेटिंग्स और एक FAQ पेज शामिल हैं। ई-कॉमर्स और एडमिन पेज इस सेट को पूरा करते हैं। उल्लेखनीय बिल्ट-इन टूल्स में एक लाइव थीम जनरेटर शामिल है जो रीयल-टाइम में चार्ट्स, बटन्स, बैज और लिंक्स को रीस्टाइल करता है और परिणामी SCSS टोकन को एक्सपोर्ट कर सकता है, एक कंपोनेंट प्लेग्राउंड जो प्रत्येक रियूजेबल कंपोनेंट को उसके सटीक HTML और कॉपी बटन के साथ जोड़ता है, और सभी 58 पेजों में फजी सर्च के लिए एक कमांड पैलेट है। थीमिंग prefers-color-scheme डिटेक्शन और गलत थीम के फ्लैश को रोकने के लिए एक प्री-पेंट स्क्रिप्ट के साथ लाइट और डार्क मोड का समर्थन करती है, और मैनुअल टॉगल्स localStorage में सुरक्षित रहते हैं। अरबी, हिब्रू और फारसी के लिए RTL लेआउट का समर्थन एक अलग मिरर stylesheet के बजाय html dir एट्रिब्यूट और CSS लॉजिकल प्रॉपर्टीज के माध्यम से किया गया है। एक्सेसिबिलिटी टच में स्किप-लिंक, फोकस रिंग्स, इंटरैक्टिव कंट्रोल्स पर ARIA लेबल्स, सिमेंटिक लैंडमार्क्स और स्क्रीन-रीडर-फ्रेंडली टेबल शामिल हैं। यह टेम्पलेट सर्विस वर्कर, ऑफलाइन शेल और इंस्टॉल करने योग्य मैनिफेस्ट के साथ PWA-रेडी भी है। नेविगेशन एक सिंगल NAV एरे से संचालित होता है, शेल को बिना किसी अनस्टाइल्ड कंटेंट फ्लैश के बिल्ड टाइम और रनटाइम पर इंजेक्ट किया जा सकता है, साइडबार व्यवहार में मोबाइल ड्रॉअर और डेस्कटॉप आइकन-ओनली रेल दोनों शामिल हैं जिसमें फ्लाईआउट सबमेनू हैं, और प्रति-पेज मेटा डिस्क्रिप्शन, Open Graph और Twitter Card टैग बिल्ड टाइम पर इंजेक्ट किए जाते हैं। डिजाइन टोकन CSS कस्टम प्रॉपर्टीज के रूप में रहते हैं, इसलिए प्राइमरी कलर बदलने से चार्ट्स और UI एलिमेंट्स तक प्रभाव पड़ता है। स्टैक को जानबूझकर छोटा रखा गया है: तीन प्रोडक्शन डिपेंडेंसी और दस डेव डिपेंडेंसी, जिसमें node_modules लगभग 165 MB है, जबकि पिछले वर्जन में यह लगभग 600 MB था। ECharts के अलावा, यह डिजाइन सिस्टम के अनुसार री-स्किन्ड DataTables.net 3 और केवल कस्टमर मैप पेज पर लोड होने वाले Leaflet 1.9, साथ ही Inter फॉन्ट का उपयोग करता है। Playwright एक डेव डिपेंडेंसी है जिसका उपयोग स्क्रीनशॉट पाइपलाइन और स्मोक टेस्ट के लिए किया जाता है जो हर पेज को रिक्वेस्ट करता है और HTTP 200 का दावा करता है। डेवलपर्स को डेव सर्वर, प्रोडक्शन और नॉन-मिनिफाइड बिल्ड्स, प्रीव्यू, बंडल एनालिसिस, एक जनरेटर के माध्यम से पेज स्कैफोल्डिंग (जो साइडबार एंट्रीज डाल सकता है), स्क्रीनशॉट कैप्चर, प्रति-फाइल कैश हेडर के साथ डिप्लॉयमेंट, लिंटिंग और फॉर्मेटिंग के लिए npm स्क्रिप्ट्स का एक सेट मिलता है। एक BASE_PATH वेरिएबल सबपाथ के तहत डिप्लॉय करने का समर्थन करता है, और बिल्ड आउटपुट स्टैटिक HTML और हैशेड एसेट्स है जो किसी भी स्टैटिक होस्ट के लिए उपयुक्त है। प्रोजेक्ट को npm पर भी पब्लिश किया गया है ताकि शेल, मोडाल और टोस्ट हेल्पर्स के ग्रैनुलर इम्पोर्ट्स, मॉड्यूल्स, स्टाइल्स और TypeScript डिक्लेरेशन के लिए सबपाथ एक्सपोर्ट्स मिल सकें, और प्री-बिल्ट dist और अनबंडल src प्रोटोटाइपिंग या डेमो पेजों के निरीक्षण के लिए jsDelivr के माध्यम से उपलब्ध हैं। Claude Code, Cursor, GitHub Copilot और agents.md-कम्पैटिबल असिस्टेंट्स के लिए हेल्पर फाइलें प्रदान की गई हैं, जो कन्वेंशन और रेसिपीज को डॉक्यूमेंट करती हैं। पूर्ण डॉक्यूमेंटेशन अलग से होस्ट किया गया है, जिसमें सेटअप, स्ट्रक्चर, आर्किटेक्चर, थीमिंग, टेबल्स, फॉर्म्स, ओवरले, PWA, डिप्लॉयमेंट और माइग्रेशन शामिल हैं। यह MIT-लाइसेंस प्राप्त है और व्यक्तिगत और व्यावसायिक उपयोग के लिए मुफ्त है।