இணையக் கூறுகள்: நவீன வலைக்கான மறுபயன்பாட்டு கூறுகளை உருவாக்குதல்

இன்றைய வேகமாக வளர்ந்து வரும் இணைய மேம்பாட்டுச் சூழலில், மட்டுப்படுத்தப்பட்ட, மறுபயன்பாட்டுக்கு உகந்த, மற்றும் பராமரிக்கக்கூடிய குறியீட்டை உருவாக்குவது மிக முக்கியமானது. இணையக் கூறுகள் (Web Components) இதற்கான ஒரு சக்திவாய்ந்த தீர்வை வழங்குகின்றன: வெவ்வேறு இணையத் திட்டங்கள் மற்றும் கட்டமைப்புகளில் பயன்படுத்தக்கூடிய தனிப்பயன், உள்ளடக்கப்பெற்ற, மற்றும் இயங்குதன்மை கொண்ட UI கூறுகள். இந்த விரிவான வழிகாட்டி இணையக் கூறுகளின் அடிப்படைக் கருத்துக்களை ஆராய்ந்து, அவற்றின் நன்மைகளை விளக்கி, நீங்கள் தொடங்குவதற்கு நடைமுறை உதாரணங்களை வழங்கும்.

இணையக் கூறுகள் என்றால் என்ன?

இணையக் கூறுகள் என்பவை, உள்ளடக்கப்பெற்ற பாணி மற்றும் நடத்தை கொண்ட மறுபயன்பாட்டு தனிப்பயன் HTML கூறுகளை உருவாக்க உங்களை அனுமதிக்கும் இணையத் தரநிலைகளின் ஒரு தொகுப்பாகும். அவை அடிப்படையில் HTML-இன் திறன்களை நீட்டிக்க உங்களை அனுமதிக்கின்றன, மற்ற எந்த நிலையான HTML கூறுகளைப் போலவே கையாளக்கூடிய தனிப்பயன் குறிச்சொற்களை உருவாக்குகின்றன.

இவற்றை இணையத்திற்கான லெகோ செங்கற்களாக நினையுங்கள். ஒவ்வொரு செங்கல்லும் (இணையக் கூறு) ஒரு குறிப்பிட்ட செயல்பாட்டைக் குறிக்கிறது, மேலும் இந்த செங்கற்களை இணைத்து சிக்கலான பயனர் இடைமுகங்களை நீங்கள் உருவாக்கலாம். இணையக் கூறுகளின் அழகு அவற்றின் மறுபயன்பாடு மற்றும் தனிமைப்படுத்தலில் உள்ளது; அவை எந்தவொரு இணையத் திட்டத்திலும், பயன்படுத்தப்படும் கட்டமைப்பு எதுவாக இருந்தாலும் (அல்லது ஒரு கட்டமைப்பு இல்லாமலும் கூட) பயன்படுத்தப்படலாம், மேலும் அவற்றின் உள் பாணி மற்றும் நடத்தை உங்கள் பயன்பாட்டின் மற்ற பகுதிகளுடன் தலையிடாது.

இணையக் கூறுகளின் முக்கிய தொழில்நுட்பங்கள்

இணையக் கூறுகள் நான்கு முக்கிய தொழில்நுட்பங்களின் மீது கட்டமைக்கப்பட்டுள்ளன:

தனிப்பயன் கூறுகள் (Custom Elements): உங்கள் சொந்த HTML கூறுகளை வரையறுத்து அவற்றின் நடத்தையை வரையறுக்க உங்களை அனுமதிக்கின்றன.
நிழல் DOM (Shadow DOM): பக்கத்தின் மற்ற பகுதிகளுடன் பாணி முரண்பாடுகளைத் தடுத்து, உறுப்பின் பாணி மற்றும் குறியீட்டிற்கு உள்ளடக்கத்தை வழங்குகிறது.
HTML வார்ப்புருக்கள் (HTML Templates): DOM-இல் குளோன் செய்து செருகக்கூடிய மறுபயன்பாட்டு HTML கட்டமைப்புகளை வரையறுக்க ஒரு வழியை வழங்குகின்றன.
HTML இறக்குமதிகள் (HTML Imports) (வழக்கொழிந்தது): தொழில்நுட்ப ரீதியாக அசல் இணையக் கூறுகளின் விவரக்குறிப்பின் ஒரு பகுதியாக இருந்தாலும், HTML இறக்குமதிகள் பெரும்பாலும் ஜாவாஸ்கிரிப்ட் தொகுதிக்கூறுகளால் மாற்றப்பட்டுள்ளன. நாம் நவீன ஜாவாஸ்கிரிப்ட் தொகுதி பயன்பாட்டில் கவனம் செலுத்துவோம்.

இணையக் கூறுகளைப் பயன்படுத்துவதன் நன்மைகள்

உங்கள் மேம்பாட்டுப் பணிப்பாய்வுகளில் இணையக் கூறுகளை ஏற்றுக்கொள்வது பல நன்மைகளை வழங்குகிறது:

மறுபயன்பாடு: இணையக் கூறுகள் வெவ்வேறு திட்டங்கள் மற்றும் கட்டமைப்புகளில் அதிகளவில் மறுபயன்பாட்டுக்கு உகந்தவை. நீங்கள் ஒரு கூறை உருவாக்கியவுடன், அதை வேறு எந்த இணையப் பயன்பாட்டிலும் எளிதாக ஒருங்கிணைக்கலாம்.
உள்ளடக்கம் (Encapsulation): நிழல் DOM சிறந்த உள்ளடக்கத்தை வழங்குகிறது, பக்கத்தின் மற்ற பகுதிகளுடன் பாணி மற்றும் ஸ்கிரிப்ட் முரண்பாடுகளைத் தடுக்கிறது. இது உங்கள் கூறுகளை மேலும் வலுவானதாகவும் பராமரிக்க எளிதாகவும் ஆக்குகிறது.
இயங்குதன்மை (Interoperability): இணையக் கூறுகள் கட்டமைப்பு-சார்பற்றவை. அவற்றை எந்த ஜாவாஸ்கிரிப்ட் கட்டமைப்புடனும் (React, Angular, Vue.js, போன்றவை) அல்லது ஒரு கட்டமைப்பு இல்லாமலும் கூட பயன்படுத்தலாம்.
பராமரிப்புத்தன்மை (Maintainability): இணையக் கூறுகளின் மட்டுப்படுத்தப்பட்ட மற்றும் உள்ளடக்கப்பெற்ற தன்மை அவற்றை பராமரிக்கவும் புதுப்பிக்கவும் எளிதாக்குகிறது. ஒரு கூறில் செய்யப்படும் மாற்றங்கள் உங்கள் பயன்பாட்டின் மற்ற பகுதிகளைப் பாதிக்காது.
தரப்படுத்தல் (Standardization): இணையக் கூறுகள் இணையத் தரநிலைகளை அடிப்படையாகக் கொண்டவை, இது நீண்டகால இணக்கத்தன்மை மற்றும் உலாவி ஆதரவை உறுதி செய்கிறது.

ஒரு எளிய உதாரணம்: ஒரு தனிப்பயன் கவுண்டர் உறுப்பை உருவாக்குதல்

ஒரு அடிப்படை இணையக் கூறின் உருவாக்கத்தை விளக்குவோம்: ஒரு தனிப்பயன் கவுண்டர் கூறு.

1. தனிப்பயன் உறுப்பு வகுப்பை வரையறுத்தல்

முதலில், `HTMLElement` வகுப்பை நீட்டிக்கும் ஒரு ஜாவாஸ்கிரிப்ட் வகுப்பை வரையறுக்கிறோம்.

class MyCounter extends HTMLElement {
 constructor() {
 super();
 // உறுப்புடன் ஒரு நிழல் DOM-ஐ இணைக்கவும்.
 this.attachShadow({ mode: 'open' });

 // கவுண்டர் மதிப்பைத் துவக்கவும்.
 this._count = 0;

 // ஒரு பொத்தான் உறுப்பை உருவாக்கவும்.
 this.button = document.createElement('button');
 this.button.textContent = 'Increment';
 this.shadowRoot.appendChild(this.button);

 //எண்ணிக்கையைக் காட்ட ஒரு ஸ்பான் உறுப்பை உருவாக்கவும்.
 this.span = document.createElement('span');
 this.span.textContent = `Count: ${this._count}`;
 this.shadowRoot.appendChild(this.span);

 // பொத்தான் கிளிக் நிகழ்வுக்கு இன்கிரிமென்ட் முறையை இணைக்கவும்.
 this.button.addEventListener('click', this.increment.bind(this));
 }

 increment() {
 this._count++;
 this.span.textContent = `Count: ${this._count}`;
 }

 connectedCallback() {
 console.log('தனிப்பயன் உறுப்பு DOM உடன் இணைக்கப்பட்டது.');
 }

 disconnectedCallback() {
 console.log('தனிப்பயன் உறுப்பு DOM-இலிருந்து துண்டிக்கப்பட்டது.');
 }

 adoptedCallback() {
 console.log('தனிப்பயன் உறுப்பு ஒரு புதிய ஆவணத்திற்கு நகர்த்தப்பட்டது.');
 }

 attributeChangedCallback(name, oldValue, newValue) {
 console.log(`பண்புக்கூறு ${name}, ${oldValue} என்பதிலிருந்து ${newValue} ஆக மாற்றப்பட்டது.`);
 }

 static get observedAttributes() {
 return ['count'];
 }
}

2. நிழல் DOM-ஐ வரையறுத்தல்

`attachShadow({ mode: 'open' })` என்ற வரி உறுப்புக்கு ஒரு நிழல் DOM-ஐ இணைக்கிறது. `mode: 'open'` விருப்பம் வெளியிலிருந்து ஜாவாஸ்கிரிப்ட்டை நிழல் DOM-ஐ அணுக அனுமதிக்கிறது, அதேசமயம் `mode: 'closed'` வெளிப்புற அணுகலைத் தடுக்கும்.

3. தனிப்பயன் உறுப்பை பதிவு செய்தல்

அடுத்து, `customElements.define()` முறையைப் பயன்படுத்தி உலாவியில் தனிப்பயன் உறுப்பை பதிவு செய்கிறோம்.

customElements.define('my-counter', MyCounter);

4. HTML-இல் தனிப்பயன் உறுப்பைப் பயன்படுத்துதல்

இப்போது நீங்கள் உங்கள் HTML-இல் `` உறுப்பை மற்ற எந்த HTML உறுப்பையும் போலவே பயன்படுத்தலாம்.

<my-counter></my-counter>

இந்தக் குறியீடு "Increment" என்று பெயரிடப்பட்ட ஒரு பொத்தானையும், தற்போதைய எண்ணிக்கையைக் காட்டும் ஒரு ஸ்பானையும் (0-வில் தொடங்கி) உருவாக்கும். பொத்தானைக் கிளிக் செய்வது கவுண்டரை அதிகரித்து காட்சியையும் புதுப்பிக்கும்.

ஆழமாகச் செல்லுதல்: நிழல் DOM மற்றும் உள்ளடக்கம்

நிழல் DOM இணையக் கூறுகளின் ஒரு முக்கிய அம்சமாகும். இது கூறுக்கு ஒரு தனி DOM மரத்தை உருவாக்குவதன் மூலம் உள்ளடக்கத்தை வழங்குகிறது, அதன் பாணி மற்றும் நடத்தையை பக்கத்தின் மற்ற பகுதிகளிலிருந்து தனிமைப்படுத்துகிறது. இது பாணி முரண்பாடுகளைத் தடுக்கிறது மற்றும் சுற்றியுள்ள சூழலைப் பொருட்படுத்தாமல் கூறு கணிக்கக்கூடிய வகையில் செயல்படுவதை உறுதி செய்கிறது.

நிழல் DOM-க்குள், கூறின் உள் உறுப்புகளுக்கு மட்டுமே பொருந்தும் CSS பாணிகளை நீங்கள் வரையறுக்கலாம். இது வெளிப்புற CSS ஸ்டைல்ஷீட்களைச் சாராத தன்னிறைவான கூறுகளை உருவாக்க உங்களை அனுமதிக்கிறது.

உதாரணம்: நிழல் DOM பாணியமைத்தல்

constructor() {
 super();
 this.attachShadow({ mode: 'open' });

 // நிழல் DOM-க்கான ஒரு ஸ்டைல் உறுப்பை உருவாக்கவும்
 const style = document.createElement('style');
 style.textContent = `
 button {
 background-color: #4CAF50;
 color: white;
 padding: 10px 20px;
 border: none;
 cursor: pointer;
 }
 span {
 margin-left: 10px;
 font-weight: bold;
 }
 `;
 this.shadowRoot.appendChild(style);

 // கவுண்டர் மதிப்பைத் துவக்கவும்.
 this._count = 0;

 // ஒரு பொத்தான் உறுப்பை உருவாக்கவும்.
 this.button = document.createElement('button');
 this.button.textContent = 'Increment';
 this.shadowRoot.appendChild(this.button);

 //எண்ணிக்கையைக் காட்ட ஒரு ஸ்பான் உறுப்பை உருவாக்கவும்.
 this.span = document.createElement('span');
 this.span.textContent = `Count: ${this._count}`;
 this.shadowRoot.appendChild(this.span);

 // பொத்தான் கிளிக் நிகழ்வுக்கு இன்கிரிமென்ட் முறையை இணைக்கவும்.
 this.button.addEventListener('click', this.increment.bind(this));
 }

இந்த எடுத்துக்காட்டில், `style` உறுப்புக்குள் வரையறுக்கப்பட்ட CSS பாணிகள் `my-counter` கூறின் நிழல் DOM-க்குள் உள்ள பொத்தான் மற்றும் ஸ்பான் உறுப்புகளுக்கு மட்டுமே பொருந்தும். இந்த பாணிகள் பக்கத்தில் உள்ள வேறு எந்த பொத்தான்களையும் அல்லது ஸ்பான்களையும் பாதிக்காது.

HTML வார்ப்புருக்கள்: மறுபயன்பாட்டு கட்டமைப்புகளை வரையறுத்தல்

HTML வார்ப்புருக்கள், DOM-இல் குளோன் செய்து செருகக்கூடிய மறுபயன்பாட்டு HTML கட்டமைப்புகளை வரையறுக்க ஒரு வழியை வழங்குகின்றன. சிக்கலான கூறு தளவமைப்புகளை உருவாக்குவதற்கு அவை குறிப்பாக பயனுள்ளதாக இருக்கும்.

உதாரணம்: HTML வார்ப்புருக்களைப் பயன்படுத்துதல்

<template id="counter-template">
 <style>
 button {
 background-color: #4CAF50;
 color: white;
 padding: 10px 20px;
 border: none;
 cursor: pointer;
 }
 span {
 margin-left: 10px;
 font-weight: bold;
 }
 </style>
 <button>Increment</button>
 <span>Count: <span id="count-value">0</span></span>
</template>

<script>
class MyCounter extends HTMLElement {
 constructor() {
 super();
 this.attachShadow({ mode: 'open' });

 const template = document.getElementById('counter-template');
 const templateContent = template.content;
 this.shadowRoot.appendChild(templateContent.cloneNode(true));

 this.button = this.shadowRoot.querySelector('button');
 this.span = this.shadowRoot.querySelector('#count-value');
 this._count = 0;
 this.span.textContent = this._count;
 this.button.addEventListener('click', this.increment.bind(this));
 }

 increment() {
 this._count++;
 this.span.textContent = this._count;
 }
}

customElements.define('my-counter', MyCounter);
</script>

இந்த எடுத்துக்காட்டில், `counter-template` என்ற ஐடியுடன் ஒரு HTML வார்ப்புருவை வரையறுக்கிறோம். வார்ப்புருவில் எங்கள் கவுண்டர் கூறுக்கான HTML கட்டமைப்பு மற்றும் CSS பாணிகள் உள்ளன. `MyCounter` வகுப்பினுள், வார்ப்புரு உள்ளடக்கத்தை குளோன் செய்து அதை நிழல் DOM-இல் சேர்க்கிறோம். இது `my-counter` கூறின் ஒவ்வொரு நிகழ்விற்கும் வார்ப்புரு கட்டமைப்பை மீண்டும் பயன்படுத்த அனுமதிக்கிறது.

பண்புக்கூறுகள் மற்றும் பண்புகள்

இணையக் கூறுகளுக்கு பண்புக்கூறுகள் (attributes) மற்றும் பண்புகள் (properties) இரண்டும் இருக்கலாம். பண்புக்கூறுகள் HTML குறியீட்டில் வரையறுக்கப்படுகின்றன, அதேசமயம் பண்புகள் ஜாவாஸ்கிரிப்ட் வகுப்பில் வரையறுக்கப்படுகின்றன. பண்புக்கூறுகளில் ஏற்படும் மாற்றங்கள் பண்புகளில் பிரதிபலிக்கலாம், மற்றும் நேர்மாறாகவும் இருக்கலாம்.

உதாரணம்: பண்புக்கூறுகளை வரையறுத்தல் மற்றும் பயன்படுத்துதல்

class MyGreeting extends HTMLElement {
 constructor() {
 super();
 this.attachShadow({ mode: 'open' });
 this.shadowRoot.innerHTML = `<p>வணக்கம், <span id="name"></span>!</p>`;
 this.nameSpan = this.shadowRoot.querySelector('#name');
 }

 static get observedAttributes() {
 return ['name'];
 }

 attributeChangedCallback(name, oldValue, newValue) {
 if (name === 'name') {
 this.nameSpan.textContent = newValue;
 }
 }
}

customElements.define('my-greeting', MyGreeting);

<my-greeting name="உலகம்"></my-greeting>
<my-greeting name="ஆலிஸ்"></my-greeting>

இந்த எடுத்துக்காட்டில், `my-greeting` கூறுக்கு ஒரு `name` பண்புக்கூறை வரையறுக்கிறோம். `observedAttributes` கெட்டர், எந்த பண்புக்கூறுகளில் ஏற்படும் மாற்றங்களைக் கண்காணிக்க வேண்டும் என்று உலாவிக்குச் சொல்கிறது. `name` பண்புக்கூறு மாறும் போது, `attributeChangedCallback` முறை அழைக்கப்படுகிறது, மேலும் நாங்கள் `span` உறுப்பின் உள்ளடக்கத்தை புதிய பெயருடன் புதுப்பிக்கிறோம்.

வாழ்க்கை சுழற்சி அழைப்புகள் (Lifecycle Callbacks)

இணையக் கூறுகளுக்கு பல வாழ்க்கை சுழற்சி அழைப்புகள் உள்ளன, அவை கூறின் வாழ்க்கைச் சுழற்சியின் வெவ்வேறு கட்டங்களில் குறியீட்டை இயக்க உங்களை அனுமதிக்கின்றன:

connectedCallback(): உறுப்பு DOM-உடன் இணைக்கப்படும்போது அழைக்கப்படுகிறது.
disconnectedCallback(): உறுப்பு DOM-இலிருந்து துண்டிக்கப்படும்போது அழைக்கப்படுகிறது.
adoptedCallback(): உறுப்பு ஒரு புதிய ஆவணத்திற்கு நகர்த்தப்படும்போது அழைக்கப்படுகிறது.
attributeChangedCallback(): உறுப்பின் பண்புக்கூறு மாற்றப்படும்போது அழைக்கப்படுகிறது.

இந்த அழைப்புகள், கூறின் வாழ்க்கைச் சுழற்சி தொடர்பான துவக்கம், சுத்தம் செய்தல் மற்றும் பிற பணிகளைச் செய்ய வாய்ப்புகளை வழங்குகின்றன.

உலாவி இணக்கத்தன்மை மற்றும் பாலிஃபில்கள்

இணையக் கூறுகள் அனைத்து நவீன உலாவிகளாலும் ஆதரிக்கப்படுகின்றன. இருப்பினும், பழைய உலாவிகளுக்குத் தேவையான செயல்பாட்டை வழங்க பாலிஃபில்கள் (polyfills) தேவைப்படலாம். `webcomponents.js` பாலிஃபில் நூலகம் பழைய உலாவிகளில் இணையக் கூறுகளுக்கு விரிவான ஆதரவை வழங்குகிறது. பாலிஃபில்லைச் சேர்க்க, பின்வரும் ஸ்கிரிப்ட் குறிச்சொல்லைப் பயன்படுத்தவும்:

<script src="https://unpkg.com/@webcomponents/webcomponentsjs@2.6.0/webcomponents-loader.js"></script>

உலாவி இணையக் கூறுகளை ஆதரிக்கவில்லை என்றால் மட்டுமே பாலிஃபில்லை ஏற்றும் ஒரு அம்சத்தைக் கண்டறியும் அணுகுமுறையைப் பயன்படுத்துவது பொதுவாகப் பரிந்துரைக்கப்படுகிறது.

மேம்பட்ட நுட்பங்கள் மற்றும் சிறந்த நடைமுறைகள்

கூறு கலவை (Component Composition)

இணையக் கூறுகளை ஒன்றாக இணைத்து மேலும் சிக்கலான UI கூறுகளை உருவாக்கலாம். இது மிகவும் மட்டுப்படுத்தப்பட்ட மற்றும் மறுபயன்பாட்டுக்கு உகந்த பயன்பாடுகளை உருவாக்க உங்களை அனுமதிக்கிறது.

நிகழ்வு கையாளுதல் (Event Handling)

இணையக் கூறுகள் தனிப்பயன் நிகழ்வுகளை அனுப்பலாம் மற்றும் கேட்கலாம். இது கூறுகள் ஒன்றுக்கொன்று மற்றும் பயன்பாட்டின் மற்ற பகுதிகளுடன் தொடர்பு கொள்ள அனுமதிக்கிறது.

தரவு பிணைப்பு (Data Binding)

இணையக் கூறுகள் உள்ளமைக்கப்பட்ட தரவு பிணைப்பு வழிமுறைகளை வழங்காவிட்டாலும், தனிப்பயன் குறியீட்டைப் பயன்படுத்தி அல்லது தரவு பிணைப்பு நூலகத்துடன் ஒருங்கிணைப்பதன் மூலம் தரவு பிணைப்பை செயல்படுத்தலாம்.

அணுகல்தன்மை (Accessibility)

உங்கள் இணையக் கூறுகள் மாற்றுத்திறனாளிகள் உட்பட அனைத்து பயனர்களுக்கும் அணுகக்கூடியதாக இருப்பதை உறுதி செய்வது முக்கியம். உங்கள் கூறுகளை வடிவமைக்கும்போதும் செயல்படுத்தும்போதும் அணுகல்தன்மைக்கான சிறந்த நடைமுறைகளைப் பின்பற்றவும்.

நிஜ உலகில் இணையக் கூறுகள்: சர்வதேச உதாரணங்கள்

நவீன மற்றும் மறுபயன்பாட்டு பயனர் இடைமுகங்களை உருவாக்க உலகெங்கிலும் உள்ள நிறுவனங்கள் மற்றும் அமைப்புகளால் இணையக் கூறுகள் பயன்படுத்தப்படுகின்றன. இதோ சில உதாரணங்கள்:

கூகிள்: அதன் மெட்டீரியல் டிசைன் கூறுகள் நூலகத்தில் இணையக் கூறுகளை விரிவாகப் பயன்படுத்துகிறது.
சேல்ஸ்ஃபோர்ஸ்: அதன் லைட்னிங் இணையக் கூறுகள் கட்டமைப்பில் இணையக் கூறுகளைப் பயன்படுத்துகிறது.
SAP: அதன் Fiori UI கட்டமைப்பில் இணையக் கூறுகளைப் பயன்படுத்துகிறது.
மைக்ரோசாப்ட்: வடிவமைப்பு அமைப்புகளை உருவாக்க, திறந்த மூல இணையக் கூறு அடிப்படையிலான கட்டமைப்பான FAST-ஐப் பயன்படுத்துகிறது.

இவை நிஜ உலகில் இணையக் கூறுகள் எவ்வாறு பயன்படுத்தப்படுகின்றன என்பதற்கு சில எடுத்துக்காட்டுகள் மட்டுமே. மட்டுப்படுத்தப்பட்ட, மறுபயன்பாட்டுக்கு உகந்த மற்றும் பராமரிக்கக்கூடிய இணையப் பயன்பாடுகளை உருவாக்குவதற்கான அதன் நன்மைகளை டெவலப்பர்கள் அங்கீகரிப்பதால் இந்த தொழில்நுட்பம் பெருகிய முறையில் ஏற்றுக்கொள்ளப்பட்டு வருகிறது.

முடிவுரை

இணையக் கூறுகள் நவீன வலைக்கான மறுபயன்பாட்டு UI கூறுகளை உருவாக்குவதற்கான ஒரு சக்திவாய்ந்த அணுகுமுறையை வழங்குகின்றன. தனிப்பயன் கூறுகள், நிழல் DOM மற்றும் HTML வார்ப்புருக்களைப் பயன்படுத்துவதன் மூலம், வெவ்வேறு திட்டங்கள் மற்றும் கட்டமைப்புகளில் பயன்படுத்தக்கூடிய தன்னிறைவான கூறுகளை நீங்கள் உருவாக்கலாம். இணையக் கூறுகளை ஏற்றுக்கொள்வது மேலும் மட்டுப்படுத்தப்பட்ட, பராமரிக்கக்கூடிய மற்றும் அளவிடக்கூடிய இணையப் பயன்பாடுகளுக்கு வழிவகுக்கும். இணையத் தரநிலைகள் বিকশিত થતાં, இணைய மேம்பாட்டின் எதிர்காலத்தை வடிவமைப்பதில் இணையக் கூறுகள் தொடர்ந்து ஒரு முக்கியப் பங்கு வகிக்கும்.

மேலும் அறிய

இன்றே இணையக் கூறுகளுடன் பரிசோதனை செய்யத் தொடங்குங்கள் மற்றும் உங்கள் இணைய மேம்பாட்டுத் திட்டங்களில் மறுபயன்பாட்டு UI கூறுகளின் சக்தியைத் திறந்திடுங்கள்!