அடுத்தது

Angular Tutorial

Angular ஐக் கற்றுக்கொள்ளுங்கள்

Angular டுடோரியல்

Angular என்பது HTML மற்றும் TypeScript இல் கிளையண்ட் பயன்பாடுகளை உருவாக்குவதற்கான ஒரு கட்டமைப்பாகும்.

குறிப்பு:

உங்கள் முன்னேற்றத்தைக் கண்காணிக்க உள்நுழையவும் - இது இலவசம்.

மேலோட்டம் & முன்நிபந்தனைகள்

எளிதில் பின்பற்றக்கூடிய பக்கங்கள் மற்றும் இயக்கக்கூடிய JavaScript-மட்டும் எடுத்துக்காட்டுகளுடன் படிப்படியாக Angular ஐக் கற்றுக்கொள்ளுங்கள்.

ஸ்டேண்டலோன் கூறுகள்

நாங்கள் NgModules தேவையின்றி நேரடியாகப் பயன்படுத்தக்கூடிய ஸ்டேண்டலோன் கூறுகளைப் பயன்படுத்துகிறோம், இது குறியீட்டை எளிமையாகவும் பராமரிக்கக்கூடியதாகவும் ஆக்குகிறது.

நவீன கட்டுப்பாட்டு ஓட்டம்

புதிய கட்டுப்பாட்டு ஓட்டத் தொடரியலைப் பயன்படுத்தி, இது அறிவிப்பு-அடிப்படையிலான டெம்ப்ளேட்டுகளை விட எளிமையானது மற்றும் மிகவும் படிக்கக்கூடியது.

உள்ளமைக்கப்பட்ட கருவிகள்

ஆங்குலரின் உள்ளமைக்கப்பட்ட ரூட்டர் மற்றும் HttpClient ஐ எடுத்துக்காட்டுகளில் பயன்படுத்தி, நடைமுறை பயன்பாட்டு வளர்ச்சியைக் காண்பிக்கிறோம்.

முன்நிபந்தனைகள்:

  • அடிப்படை HTML, CSS, மற்றும் JavaScript அறிவு
  • சில TypeScript அறிவு உதவியாக இருக்கும் ஆனால் தேவையில்லை
  • நவீன வலை மேம்பாட்டு கருத்துகள் பற்றிய அடிப்படைப் புரிதல்

எடுத்துக்காட்டுகள் மூலம் கற்றல்

எங்கள் "ஆங்குலரைக் காண்பி" கருவி Angular ஐ நிரூபிப்பதை எளிதாக்குகிறது.

இது குறியீடு மற்றும் முடிவு இரண்டையும் காட்டுகிறது.

எடுத்துக்காட்டு:

உங்கள் சொந்த ஆங்குலர் சேவையகத்தைப் பெறுங்கள்

main.ts

import { bootstrapApplication } from '@angular/platform-browser';
import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  standalone: true,
  template: `
Hello Angular!
`
})
export class App {}

bootstrapApplication(App);

index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Angular App</title>
</head>
<body>
  <app-root></app-root>
</body>
</html>

குறியீட்டு பகுப்பாய்வு

  • @Component - ஆங்குலர் கூறை வரையறுக்கிறது
  • standalone: true - NgModule தேவையில்லை
  • template - கூறின் HTML உள்ளடக்கத்தை வரையறுக்கிறது
  • bootstrapApplication() - பயன்பாட்டைத் தொடங்குகிறது

முடிவு

இந்தக் குறியீடு இயக்கப்படும் போது, பயனர் இடைமுகம் காண்பிக்கும்:

Hello Angular!

பயிற்சிகள் மூலம் கற்றல்

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

❓Angular என்பது ஒரு:

நூலகம் (Library)
✗ தவறானது! ரியாக்ட் ஒரு நூலகம், ஆனால் ஆங்குலர் ஒரு முழுமையான கட்டமைப்பு
கட்டமைப்பு (Framework)
✓ சரி! ஆங்குலர் TypeScript இல் எழுதப்பட்ட முன்-முனை கட்டமைப்பு ஆகும்
நிரலாக்க மொழி (Programming Language)
✗ தவறானது! ஆங்குலர் ஒரு நிரலாக்க மொழி அல்ல, இது TypeScript/JavaScript இல் உருவாக்கப்பட்ட கட்டமைப்பு

பயிற்சி ஆலோசனை:

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

அடுத்தது