உண்மையான பயன்பாடுகளில் Lily ஐப் பாருங்கள்
ஏழு செயல்படும் எடுத்துக்காட்டுத் திட்டங்கள் தலையற்ற கூறுகளை எடுத்து, பாணியிடலை அடுக்கி, உண்மையான வலைத்தளத்தை வெளியிடுவது எப்படி என்று காட்டுகின்றன. நீங்கள் பயன்படுத்தும் கட்டமைப்பைத் தேர்ந்தெடுங்கள்.
முழு CSS மற்றும் வழித்தடத்துடன் டெமோ பயன்பாடுகள்
HTML JavaScript
எளிய HTML பக்கங்கள், வெண்ணிலா JavaScript, உருவாக்கக் கருவிகள் இல்லை. எந்த நிலையான ஹோஸ்ட்டிலும் பொருந்தும் — சிறிய தளங்களுக்கும் படிப்படியான மேம்பாட்டுக்கும் சிறந்தது.
Svelte + SvelteKit
Svelte 5 ரூன்களைப் பயன்படுத்தும் SvelteKit 3 பயன்பாடு. கூறு வழிகள், கோப்பு-அடிப்படை வழித்தடம், மற்றும் ஒவ்வொரு கூறின் பாணியிடப்பட்ட storybook.
React + Next.js
ஒவ்வொரு கூறையும் சூழலில் காட்டும் Next.js 16 பயன்பாடு, முழுவதும் TypeScript மற்றும் கூட்டு வடிவங்களுக்கான டெமோ பக்கங்களுடன்.
Vue + Nuxt.js
Nuxt 4 பயன்பாடு. <script setup> மற்றும் Composition API ஒவ்வொரு டெமோ வழியிலும்.
Angular + Analog
Angular 22 + Analog.js பயன்பாடு. கோப்பு-அடிப்படை வழித்தடம், சிக்னல்கள், மண்டலமற்ற மாற்றக் கண்டறிதல், மற்றும் முழு SSG முன்-வழங்கல்.
Blazor Web
Razor கூறுகளுடன் Blazor Web பயன்பாடு. சர்வர்- மற்றும் WebAssembly-நட்பு, .NET 10 அடிப்படையுடன்.
Nunjucks + Eleventy
Nunjucks மேக்ரோக்களைப் பயன்படுத்தும் Eleventy தளம். இன்னும் உண்மையான கூறு அமைப்பை விரும்பும் உள்ளடக்கம் நிறைந்த நிலையான தளங்களுக்கு ஏற்றது.
ஒவ்வொரு எடுத்துக்காட்டு பயன்பாட்டுக்கும் ஒரே வடிவம்
கட்டமைப்புகளுக்கு இடையே தாவுவதைப் பழக்கமாக உணர வைக்க, ஒவ்வொரு எடுத்துக்காட்டு பயன்பாடும் வழங்குவது:
- இங்கே ஒரு வரவேற்பு வழி
/அது திட்டத்தை அறிமுகப்படுத்துகிறது. - இங்கே ஒரு கூறு அட்டவணை
/componentsஅது ஒவ்வொரு கூறையும் பட்டியலிடுகிறது. - இங்கே ஒவ்வொரு கூறுக்கும் ஒரு டெமோ பக்கம்
/components/<component>. - உண்மையான CSS — சுருக்கமான வடிவமைப்புக் குறிகள் அல்ல — அதனால் பாணிகளை நேரடியாக இரவல் வாங்கலாம்.
- பெட்டியிலிருந்தே வேலை செய்யும் விசைப்பலகை வழிசெலுத்தல் மற்றும் குவிப்பு மேலாண்மை.
ஒற்றைக் கூறு எப்படிப் பாணியிடப்பட்டுள்ளது என்று பார்க்க வேண்டுமா?
தொடர்புடைய எடுத்துக்காட்டு பயன்பாட்டைத் திறந்து, இங்கே செல்லுங்கள்
/components/<name>மற்றும் மார்க்அப், CSS ஐ உங்கள் சொந்த திட்டத்தில் நகலெடுங்கள். எடுத்துக்காட்டு பயன்பாடுகள் வேண்டுமென்றே எளிய (அல்லது கிட்டத்தட்ட எளிய) CSS ஐப் பயன்படுத்துகின்றன, அதனால் நீங்கள் விரும்பும் எந்த அமைப்புக்கும் மாற்றியமைக்கலாம்.
அதற்குப் பதிலாக தலையற்றது வேண்டுமா?
எந்த எடுத்துக்காட்டு பயன்பாட்டையும் அதன் தொடர்புடைய தலையற்ற தொகுப்புடன் இணையுங்கள் — அவை அதே கூறுகளை எந்த CSS உம் இல்லாமல் வெளியிடுகின்றன, உங்கள் சொந்த வடிவமைப்புக் குறிகளுக்குத் தயார்.