Category Archives: .Net

Angular Tutorial Series

In this series of posts I would like to go in depth of Angular 7+ versions. This page is the index/table of contents page and would be updated as I add more content to this series and all the articles would be linked from here. All the topics which are linked have content and others which are not linked are in progress. 

Some part of the tutorial would need Backend service, for which I would be using in memory web api npm module which provides an easier way to mimic the actual server which can be replaced with actual backend server calls of your choice.

I would be using VS Code editor, but you can code in any editor of your choice. I would also provide link to each coding exercise wherever necessary.

Below are some of the topics which I would be covering in this.

  1. Setup Angular Development environment
  2. Angular CLI – Introduction & setting up the application
  3. Different development parts in Angular Application
    1. Components
    2. Directives
    3. Services & Dependency Injection
      1. Data Services
      2. Services with some reusable functionality
    4. Pipes
  4. Bootstrapping
  5. Components/Directives Lifecycle
  6. Component Interactions
    1. Parent to Child
    2. Child to Parent
    3. Siblings
    4. State Service
  7. Angular Forms
    1. Template Driven forms
    2. Reactive Forms
    3. Validations
      1. Angular Validations
      2. Custom Validations
  8. Routing
  9. Rxjs – Overview
  10. Angular Change Detection
  11. Internationalization
  12. Modules
  13. Libraries
  14. Angular Materials
  15. NgRx – Intro
  16. Unit Testing
  17. End to End Testing
  18. Angular Animations
  19. Deployment
  20. Server side rendering
  21. Sample Project – E Commerce Application
  22. References & where to learn more

Please feel free to add comment if you like me to add additional content on Angular and related technologies.

Advertisements

Angular Tutorial Series – Setup Angular Development environment

Some pre-requisites for setting up development environment are:

1. Install nodejs and npm

npm is a node package manager which is used to install various libraries needed for angular and related libraries. In order to install npm we need to install node.js. You can download node.js from https://nodejs.org. 

You can verify the node.js and npm by running the following commands in terminal/command prompt.

To check the node version, run the following command:

node -v

To check the npm version, run the following command:

npm -v

2. Install Visual Studio Code aka VS Code

VS Code is a very light weight cross platform Code Editor which supports many languages, intellisense, debugging and lot of extensions to extend VS Code. You can work on any other Code editor of your choice as well if you want, but I would highly recommend VS Code as I have not seen any other code editor which is better than VS Code and is free. You can install VS Code from https://code.visualstudio.com/download.

3. Install Angular CLI

Angular CLI or Angular Command Line Interface is a tool which lets you generate code using some specific command in terminal or command prompt. You can install Angular CLI using npm by using the following command.

 npm install -g @angular/cli

The above command would install angular cli globally i.e. it would be available in any directory. If you want to install angular cli in specific project only, then go to that folder in terminal/command prompt and run the following command.

 npm install @angular/cli

Delete all node modules in the directory

Sometimes when you are coding in VS Code and you want to clean up node_modules folder, you either delete the files directly or you can run the below command in VS Code’s PowerShell terminal which is pretty handy.

ls node_modules | ForEach-Object { npm uninstall $_.name}

Hope this might be useful to some people who want to automate things.

C# | Generic Converter

There are times when we need to dynamically convert/parse the object from its string value to its type.

Below is the generic converter code which we can use instead of creating method for each type.

SomeType temp;

var strVal = "StringValueofObject";
var converter = TypeDescriptor.GetConverter(typeof(temp));

temp = (SomeType)converter.ConvertFromString(strVal);

It basically gets the TypeConverter for the specified type and calls its method ConvertFromString. If we want to have similar functionality for our classes then we can create TypeConverters for our own custom classes.

ASP.NET WEB API | TypeConverter and ModelBinders

So its being a while working on WEB API and still it surprises with me everyday with the new way I can extend it. In this article I would like to share TypeConverters and ModelBinders, how they fit into everyday work and how they can make the API access easier for end clients.

Continue reading

C# | Nullables and null-coalescing operator

Nullables are the special value types which can contain their range of values along with null as an additional value.

Nullables are very useful especially when we deal with database or external systems where there is a possibility of empty or null value for an expected value type.

Lets see how nullables can be created and used.

Continue reading