What is Angular (Angular एंगुलर क्या है ) | Angular कैसे काम करता है | Angular एंगुलर से वेब एप्लिकेशन कैसे बनाया जाता है |

जय हिंद दोस्तों आज हम जानेंगे Google के Frontend Framework Angular के बारे में ।

Angular एंगुलर क्या है ।

Angular एक open source JavaScript framework है, जो Google द्वारा developed और maintained होता है। यह web applications बनाने के लिए उपयोग में लाया जाता है। Angular एक front-end framework है, जो HTML, CSS, और JavaScript से बने web pages को संभवतः सुंदर और interactive बनाने में मदद करता है। Angular एक Model-View-Controller (MVC) framework है, जो कि web application में data को organize करने के लिए उपयोग में लाया जाता है। Angular सिर्फ web applications ही नहीं, बल्कि mobile applications बनाने के लिए भी उपयोग में लाया जा सकता है।

Angular कैसे काम करता है।

• Model: Angular में model data को represent करता है। यह data एक web application के विभिन्न pages में प्रदर्शित होने वाला होता है।

• View: Angular में view web application के विभिन्न pages होते हैं। यह pages HTML, CSS, और JavaScript से बने होते हैं।

• Controller: Angular में controller model और view को connect करता है। यह controller data को manipulate करता है और उसे view में प्रदर्शित करता है।

• Angular काम करने के लिए HTML, CSS, और JavaScript से बने web pages को संभवतः सुंदर और interactive बनाता है। यह web applications बनाने में मदद करता है और उसमें data को organize करने में मदद करता है।

Angular से वेब एप्लिकेशन कैसे बनाया जाता है ।

Angular से web application बनाने की process इस प्रकार होती है:

• Angular सेटअप: Angular सेटअप करने से पहले, Node.js और npm (Node Package Manager) install कर लेना होगा। npm से Angular को install करना होगा।

• Angular project बनाना: Angular project बनाने के लिए, Angular CLI (Command Line Interface) का उपयोग करना होगा। Angular CLI से एक new project बनाने के लिए, "ng new project-name" कमांड चलाया जाना होगा।

• Components बनाना: Angular project में components बनाने के लिए, Angular CLI का उपयोग करना होगा। Components बनाने के लिए, "ng generate component component-name" कमांड चलाया जाना होगा।

• Routing सेट करना: Angular project में routing सेट करने के लिए, एक routing module बनाना होगा और उसे app.module.ts में import करना होगा। इसके बाद, अपने components में routerLink और router-outlet डेटा टैग का उपयोग करना होगा।

• Services बनाना: Angular project में services बनाने के लिए, Angular CLI का उपयोग करना होगा। Services बनाने के लिए, "ng generate service service-name" कमांड चलाया जाना होगा।

Angular का सबसे बड़ा फायदा क्या है ।

Angular एंगुलर का सबसे बड़ा फायदा यह है कि यह Model-View-Controller (MVC) framework है। यह MVC framework है, जो कि web application में data को organize करने के लिए उपयोग में लाया जाता है। Angular MVC framework में data को model में represent किया जाता है, view में प्रदर्शित किया जाता है, और controller में data को manipulate किया जाता है।

इससे अधिक फायदा, Angular का यह फायदा है कि यह web application में data को real-time में update करने की सुविधा प्रदान करता है। इससे अधिक फायदा, Angular में components का उपयोग करने से web application की development को आसान बनाया जा सकता है। Angular components का उपयोग करने से web application में code reuse होता है और development को आसान बनाया जा सकता है।

साथ ही, Angular एक open source framework है और उसमें एक बहुत बड़ा community है। इसलिए, Angular में किसी भी तरह की समस्या या सुझाव होने पर, आपको सहायता मिल सकती है।

Angular एंगुलर में routing कैसे किया जाता है ।

Angular में routing करने के लिए आपको Angular router मॉड्यूल का उपयोग करना होगा। आपको अपने Angular ऐपलिकेशन में routing सेटअप करने के लिए कुछ स्टेप्स करने होंगे:

• अपने Angular ऐपलिकेशन में @angular/router मॉड्यूल का इंस्टाल करें।
• अपने Angular ऐपलिकेशन में रूटिंग कॉन्फ़िगर करने के लिए एक नई मॉड्यूल बनाएं जिसका नाम आपके पसंद हो (जैसे कि app-routing.module.ts)।
• अपने मॉड्यूल में RouterModule इम्पोर्ट करें और Routes टाइप डिफ़ाइन करें।
• Routes टाइप का उपयोग करके अपने ऐपलिकेशन के विभिन्न पृष्ठों के लिए रूट निर्धारित करें। जैसे कि:

const routes: Routes = [

  { path: 'home', component: HomeComponent },

  { path: 'products', component: ProductsComponent },

  { path: 'customers', component: CustomersComponent },

  { path: '**', component: PageNotFoundComponent }

];

• RouterModule.forRoot(routes) का उपयोग करके अपने रूटों को अपने मॉड्यूल में इंपोर्ट करें।
• अपने मॉड्यूल को अपने Angular ऐपलिकेशन में इंपोर्ट करें और अपने @NgModule डिक्लेरेशन के imports में इंक्लूड करें।
• अपने ऐपलिकेशन में एक सिंगल-पेज आउटलेट (SPO) को जोड़ें जैसे कि <router-outlet></router-outlet>। यह आपके ऐपलिकेशन में रूटेड पृष्ठों को दिखाने का स्थान होगा।
• अपने पृष्ठों पर जाने के लिए अपने एप्लिकेशन में एक लिंक बनाएं जैसे कि <a routerLink="/home">Home</a>

Angular Video Tutorial

..Thank You..

Programming Questions

1. Text Wrap Hackerrank Solution In Python 3

2. Lists in Python - Hacker Rank Solution

3. introduction to Sets - Hacker Rank Solution

4. set.union Operators in Python-Hacker Rank Solution 

5. Find Angle MBC Hackerrank Solution In Python

Python Tutorial

1. Python Programming In Hindi

2. Python Download And Installation Instructions

3. Python String

4. Python String Formatting

5. Python String Indexing

6. Python String Methods

 7. Python Control Statements

 8. Python For Loops and While Loops

 9. Python function

10.Python List 

यह भी पढ़ें