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
सिग्नल इनपुट के साथे 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 आ मिलनसार इंसान तक पहुँचे के रास्ता बा। आ अगर कवनो ट्यूटोरियल अउर साफ हो सकेला, हमनी के बताईं — हमनी खुशी से सुधारब।