WeCours > Development > Software Testing > Fondamentaux Angular from Scratch & Tests unitaires/Intégration
4.87 sur 5
4.87

Fondamentaux Angular from Scratch & Tests unitaires/Intégration

Entrez dans le développement Web avec une solide compréhension des bases angulaires et écrivez des tests pour que votre code soit un testeur White Box
Instructeur :
Mahefa Abel
English
AUCUNE connaissance préalable d'Angular n'est requise. Chaque concept, y compris les bases de TypeScript, est enseigné à partir de zéro
Obtenez une compréhension approfondie des fondamentaux d'Angular pour vous établir rapidement en tant que développeur frontend
Vous apprendrez les meilleures pratiques de test unitaire angulaire et de test d'intégration
Connaissance des outils de test unitaire comme Karma, Jest, Jasmine, Angular Bed etc
Comprendre comment effectuer des tests de composants, des tests de services, des tests de directives avec Angular
À la fin de ce cours, vous développerez des applications Web modernes, réactives et évolutives avec Angular

Ce cours est exclusivement conçu pour les débutants afin de comprendre les principes fondamentaux ANGULAR du développement Web frontal et la capacité d’effectuer des tests en boîte blanche, tels que les tests unitaires, les tests d’intégration pour le code à l’aide de divers cadres de test tels que Karma, Jest , AngularBed, Jasmine etc

Ce cours est divisé en 2 phases

Phase 1 :

Introduction au développement front-end – La phase 1 explique les principes fondamentaux d’Angular, y compris les principes fondamentaux de TypeScript pour développer des applications front-end en temps réel à partir de zéro.

Aucune expérience de programmation nécessaire pour commencer avec ce cours. J’ai couvert tout le nécessaire pour vous familiariser avec chaque concept enseigné dans le cours

Phase 2 :

Tests unitaires/d’intégration – Après une solide compréhension du développement frontal à l’aide d’Angular dans la phase 1, la phase 2 explique comment écrire des tests unitaires et des tests d’intégration pour le code de phase 1 développé à l’aide de frameworks de test comme comme Karma, Jest, AngularBed, Jasmine, Mock Services , classes, etc.

Tous les concepts des frameworks de test (test de la boîte blanche) sont également donnés avec une explication au niveau Scratch.

************ ******************************************************** *****
Veuillez noter que ce cours ne plongera pas profondément dans l’apprentissage HTML, mais cela ne vous affectera pas pour apprendre l’ANGULAR.

 

À la fin de ce cours, on peut commencer à créer des applications Web avec Angular et écrire des tests unitaires solides et des tests d’intégration pour tester leur code conformément aux normes de l’industrie

Ce cours peut être une excellente ressource pour Développeurs juniors et surtout aux SDET pour s’impliquer dans  Stratégies de test White Box pour mieux comprendre le code et écrire des tests unitaires/d’intégration solides.

Introduction to Angular & Course FAQ's

1
Introduction to Angular and Course FAQ's
2
Node.js and Visual Studio Code installation for Angular Setup
3
Please Note on sequence of Lectures

TypeScript Fundamentals for Beginners

1
What is Typescript? How different it is from JS?
2
Importance of Let and Const keywords in Typescript
3
Types Usage in Typescript
4
Understanding Classes,Methods and objects in Typescript
5
Importance of Constructor in Typescript
6
Exports,Imports and Functions usage in Typescript
7
Interfaces and objects Importance in defining contracts
8
Usage of Pipes for Anonymous Functions
9
Code Download

Building Angular Components for App development

1
Demo of the App which we will develop in this course
2
Where to download code files
3
Install Angular CLI dependencies and create the Project
4
What are Angular Components? Understand how to create one
5
What is Interpolation in Angular and how this can be used
6
How to display Array of items into HTML with Angular Interpolation

Structural Directives and ng Directives for Parent Child component relation

1
What are Built in Structural Directives and how it helps in populating data
2
What are ng-directives and how it helps to put conditions in HTML
3
Understand the concept of Child and Parent Components with Input Tag
4
Example of Input and Output Directives to communicate with parent and child
5
Understand the Event Binding and how to create Custom Events
6
Updating HTML Attributes of Angular with the Property and event Binding

BootStrap CSS to bring Styling to Angular Component HTML Pages

1
What are ng-templates and ng-container and where to use it effectively
2
Introduction to Boostrap and how it helps to build effective CSS
3
Bring the Custom Bootstrap template for Product List page

Angular Routing for Page Navigations and Data Session Storage

1
What is Angular Routing and how it helps to navigate between pages
2
Add Router Link to the Product details page to land on Product Shop page
3
Implementing Route Params to get the specific Product date to render
4
Get Bootstrap template to display Product Details page into Angular html
5
Implement Add to Cart functionality and change Button properties on Select
6
Implement Website Header Navigation Bars with Bootstrap template

Injecting Angular Service Providers for Data into Components

1
Understanding Angular Services and implementing process into Framework
2
Build Cart Component and consume the date from Angular Service
3
What are Template reference variables? And KeyUp event to listen user Input

Build Functional logic into Component methods and dynamically update from HTML

1
Implemeting Logic to retrieve Product Price from ng-init hook
2
Implement logic to update the Product Quantity using ONKEY Event
3
Implement logic to update the Product Total and apply routerLink to Checkout
4
Implment logic for Removing Products from the Cart and cleanup the code

Create Angular Forms with ng-model two way Binding Directives

1
What are Angular Forms- Getting Started with forms
2
What is ng-model Directive ? Apply ng-model to the Angular forms
3
Submitting the Form and storing the details with ng-form directive
4
Creating Domain class to store form data for reusing in any component

Consuming HTTP Rest Service Json data into Angular Components to render

1
Creating Thankyou Page Template and implement toggling to Hide and unhide
2
How to Consume Rest API"s data into Angular App - Example
3
Created Book Interface to cast the API response to the book object
4
Implement Library Page with Table using ng-for directive and API data
5
Build Home page to App with proper router Navigations to respective pages

Unit Testing the Angular Components with Angular Test Bed Utilities

1
Introduction to Angular Unit /Integration Testing and its types
2
What is Karma and Angular Test Bed and how it used for White box testing
3
Build Unit Test for the method defined in the component classes
4
Configuring Test Bed and creating HTML fixture to render the html on fly
5
Test the Alert Details Component with ng-if condition logic validation
6
How to load Stub Data into instance to test component in isolated way

Use Stub Data for Testing Input Output Directives in the Angular Framework

1
Testing Input Output Event emmitters with Stub data required for the component
2
Create Mock Service class for Cart data to Test Cart component in isolated
3
Perform Integration testing by viewing the results on browser with nativeElement
4
Use SPY object to Implement Tests for Library Dashboard component

Integration Testing to test the components on UI & SPY object Usage

1
Use return value for created Spy object and inject into Test Data as Mocking
2
Implement validations on Angular Forms and test on the browsers
3
Understand how to fire DispatchEvents with QuerySelector for Integration testing

Project Code Download

1
Download Code
You can view and review the lecture materials indefinitely, like an on-demand channel.
Definitely! If you have an internet connection, courses on WeCours are available on any device at any time. If you don't have an internet connection, some instructors also let their students download course lectures. That's up to the instructor though, so make sure you get on their good side!
4.9
4.9 sur 5
Notes20

Détails des Notes

Étoiles 5
16
Étoiles 4
4
Étoiles 3
0
Étoiles 2
0
Étoiles 1
0
Suivre un cours
Paiement unique S'inscrire avec l'adhésion
Garantie de remboursement de 30 jours

Inclut

11 heures de vidéo à la demande
Accès complet à vie
Accès sur le mobile et la télévision
Certificat d'achèvement

Archive

Working hours

Monday 9:30 am - 6.00 pm
Tuesday 9:30 am - 6.00 pm
Wednesday 9:30 am - 6.00 pm
Thursday 9:30 am - 6.00 pm
Friday 9:30 am - 5.00 pm
Saturday Closed
Sunday Closed