Lily शिका, टप्प्याटप्प्याने
स्वागत! प्रत्येक ट्युटोरियल शून्यापासून सुरू होते आणि तीच लहान गोष्ट बनवते — एक सुलभ, शैलीबद्ध फॉर्म — सुमारे 10 मिनिटांत, म्हणजे तुम्ही फ्रेमवर्कची बरोबरीने तुलना करू शकता. नंतर थीमिंग आणि वापरकर्ता पसंतींसह अधिक खोलात जा.
सुरू करण्यापूर्वी
तुम्हाला आश्चर्यकारकपणे कमी लागते:
- HTML ट्युटोरियलसाठी — फक्त ब्राउझर आणि मजकूर संपादक. तेच संपूर्ण साधनसंच आहे.
- Svelte, React, Vue, Angular किंवा Nunjucks साठी — git, Node 26, आणि pnpm 10 किंवा नवीन.
- Blazor साठी — git आणि .NET SDK 8 किंवा नवीन.
हेडलेस घटकांसाठी नवीन आहात? तुम्ही योग्य ठिकाणी आहात — प्रत्येक ट्युटोरियल काय चालले आहे ते स्पष्ट करते, आणि प्रत्येक पायरी कॉपी करण्यासाठी अचूक कोड दाखवते.
शून्यापासून शिपपर्यंत चार पायऱ्या
- तुमचा पहिला घटक (~5 मिनिटे) — खाली तुमचा फ्रेमवर्क निवडा, कोड मिळवा आणि Button रेंडर करा.
- जोडा आणि शैली द्या (~5 मिनिटे) — लेबल असलेला फॉर्म बनवा आणि केबाब-केस क्लास हुकच्या आधारे त्याला शैली द्या (प्रत्येक फ्रेमवर्क ट्युटोरियलचा भाग).
- त्याला थीम द्या (~15 मिनिटे) — तुमचे हाताने लिहिलेले CSS 57 तयार थीमपैकी एकाने बदला, मग वापरकर्त्यांना रनटाइमला बदलू द्या: थीमिंग ट्युटोरियल.
- पसंतींचा आदर करा (~15 मिनिटे) — पसंती सहाय्यकांसह भाषा आणि मजकूर-आकार निवड जोडा: सहाय्यक ट्युटोरियल.
तुमचा फ्रेमवर्क निवडा
HTML
क्लास हुकसह सेमँटिक HTML कॉपी करा आणि चला — ब्राउझर आणि संपादक पुरेसे आहेत.
Svelte
Svelte 5 रून, स्निपेट आणि bind:value द्विमार्गी बाइंडिंग.
React
फंक्शन घटक value + onChange आणि उर्वरित-प्रॉप प्रसारासह.
Vue
Vue 3 एकल-फाइल घटक v-model समर्थनासह.
Angular
सिग्नल इनपुट आणि [(value)].
Blazor
पॅरामीटर असलेले Razor घटक, ChildContentआणि bUnit चाचण्या.
Nunjucks
Eleventy आणि कोणत्याही Node टेम्प्लेट पाइपलाइनसाठी सर्व्हर-रेंडर मॅक्रो.
द्विधा आहात? याने सुरू करा: HTML — हे इतर प्रत्येक फ्रेमवर्क वाटून घेतो तो क्लास हुक करार शिकवते, आणि थेट फाइलमधून चालते.
अधिक खोलात जा
थीमिंग
57 तयार थीमपैकी एक जोडा — NHS, GOV.UK, USWDS, हलकी, गडद आणि बरेच — ती तुमच्या स्वतःच्या CSS ने ओव्हरराइड करा, आणि theme-picker सहाय्यकासह रनटाइम थीम बदल जोडा.
पसंती सहाय्यक
वापरकर्त्यांना थीम, भाषा, मजकूर आकार, गती, शोध, पृष्ठ दुवे, शेअरिंग आणि तारीख/वेळ नोंदीचे नियंत्रण द्या theme-picker, locale-picker, text-size-picker, motion-picker, search-picker, link-picker, share-picker आणि date-time-picker सह: टिकाऊपणा, SSR सुरक्षितता आणि स्वयंचलित RTL शोधासह हेडलेस नियंत्रणे.
ट्युटोरियलनंतर
- घटक कॅटलॉग पहा — प्रत्येक घटक त्याचे प्रॉप, ARIA करार आणि कीबोर्ड वर्तन दस्तऐवजीकृत करतो.
- उदाहरण अॅप क्लोन करा म्हणजे सर्व 571 घटक शैलीबद्ध आणि एकत्र काम करताना दिसतील — CSS तुम्ही आत्ताच वापरलेल्या त्याच क्लास हुकला लक्ष्य करते, त्यामुळे त्यातील कोणताही भाग तुमच्या प्रकल्पात कॉपी करा आणि हवे तसे जुळवा.
- प्रश्न? मदत पृष्ठावर उत्तरे, FAQ आणि मैत्रीपूर्ण माणसापर्यंत पोहोचण्याचे मार्ग आहेत. आणि एखादे ट्युटोरियल अधिक स्पष्ट असू शकत असेल तर, आम्हाला सांगा — आम्ही ते आनंदाने सुधारू.