Windows Forms Multi Threaded Background Job Application

When you are working on distributed architecture application using Multi Threads developer usually come across Cross Thread error.
Error Description : Cross-thread operation not valid: Control 'progressBar1' accessed from a thread other than the thread it was created on.

Whenever we try to access control object which are part of main thread and if you try to change that control object property value you will receive Cross Thread operation error.
It error description suggest that you are trying to do Cross-Thread operation which is not valid.

To produce this error in my example i am going to use small Windows Forms App ( Parent Child ).

1. Parent Form which is Main Form and it has menu items to open Child Form
2. Child Form which will start the small loop in thread using "Start Loop" button
3. From the loop we try to set value of Progress bar and Status label text.
4. Once you click "Start Loop" button you can see Cross Thread error because Progress bar control is a part of Main Thread and we are trying to access directly to sub thread.

WFBackgroundJob1.cs

This error you can resolve using Thread.Invoke but i am resolving this error using Background Job in my example. Let's take a look simple example which start Background Job under worked thread and it's progress using backgroundWorker1_ProgressChanged event.

Your job runs in background asynchronously and user able to continue working on system as system won't hang even we are running loop.

1. Parent Form which is same like previous Main Form and it has menu items to open Child Form
2. Child Form which start the small loop in backgroundWorker1_DoWork event using button "Start Loop" which start loop asynchronously backgroundWorker1.RunWorkerAsync();
3. DoWork report the progress using backgroundWorker1.ReportProgress method
4. In example 2 arguments added in ReportProgress method one is percentProgress and second is Progress Status as Text.
5. Background job control WorkerReportProgress property need to set True before using ReportProgress method

Please get the sample CSharp code as mentioned

WFBackgroundJob2.cs

Please post your questions or comments bellow. Thank you !

Visual Studio 2017 Community edition download & installation.

Visual Studio is one of famous IDE for Windows and Mac to develop apps for Android, iOS,Mac, Windows , Web and Cloud. Using this IDE we can write our code fast,Debug and Diagnose with ease.
Please get more details about Visual Studio here : Visual Studio

Visual Studio Community is free for all developers or students and in this post we will see step by step instructions to install Visual Studio Community 2017.

Step 1 : Go to link https://www.visualstudio.com/downloads/  to download VS 2017 community edition.

Step 2 : Click on Free Download button of Visual Studio Community 2017 IDE

Step 3: Run the downloaded setup executable file vs_community_xxx.exe

Step 4: Accept the Microsoft Terms and Conditions and click Continue

Step 5: Select VS 2017 different components as per your development preferences. I have selected following as per my preferences

1. Universal Windows Platform Development
2. .NET desktop development
3. ASP.NET and Web development
4. Mobile development with .NET using Xamarin
5. Mobile development with JavaScript 
6. Click on Install

Step 6: Once you click Install it will start installation as per your selection and necessary files will be copied to your system.

Step 7 : After successful installation please Launch the IDE.

Post your questions or comments bellow. Thank You!

AngularJS Expression , AngularJS Controller and Bootstrap example

Let's take a look example of area calculation of different shapes using AngularJS Expression and Controller.

• Square and Rectangle shape's Area calculation using AngularJS expression
• Circle and Triangle shape's Area calculation using AngularJS controller.

Mentioned page is also design using bootstrap to give nice look and feel.
Please check my previous blog post related to following topics as mentioned.

• What Is AngularJS? Introduction and Basic Example.
• What is Bootstrap? Setup and Basic Template Example !

Please check LIVE demo of given example here : Click Here

AngularJS Expression
AngularJS binds data to HTML using Expressions. It can be written inside double braces as
{{ expression }}. It can also written inside ng-bind directive. In example you will see Square and Rectangle area calculation expression inside AngularJS Expression. AngularJS will resolve the expression and return the value to the HTML element.

Square 
square variable which is width/height of shape and we are initializing variable using ng-init directive.
The same variable is bind with input textbox using ng-model directive.
The Square shape area calculation equation added inside AngularJS Expression as{{sqaure*sqaure}}

Rectangle 
Rectangle shape's width  rectwidth and height rectheight initialize using ng-init directive. Both variables are bind with input textbox using ng-model directive. The Rectangle Area calculation equation is added inside AngularJS Expression as {{rectwidth*rectheight}}

AngularJS Controller
AngularJS applications are controlled by controller. The ng-controller directive is used to define a controller object. AngularJS Controller is javascript object created using JavaScript Object Constructor notation.

In my application ng-app="myApp" directive which is defined AngularJS application. This application run inside define <div> element.The ng-controller="myCtrl" attribute is an AngularJS directive. It defines a controller. When Controller object initialized from JavaScript language it also passes $scope object. Within $scope object we are initializing variables for Circle and Triangle which also contain methods to perform Area calculations.

Circle
Circle's radius variable or attribute is initialized inside controller object in javascript line  $scope.radius=6;  The variable is also bind with input textbox using ng-model directive. To perform circle area calculation we need MATH.PI variable so we are passing $window service also using AngularJS Service Injection feature. $scope.circleArea = function do the calculation and which is added in HTML using AngularJS Expression as {{circleArea()}}

 Triagle
Triangle's shape base and height variable or attributes are initialized inside controller object in javascript line $scope.base=4;    $scope.height=7;  Both variables are bind with input textboxes using
ng-model directive. $scope.triangleArea = function do the calculation and which is added in HTML using AngularJS Expression as {{triangleArea()}}

AngularExpression.html

Hope this example give you some basic idea about AngularJS Expression & Controller.

Please post your questions or comments bellow. Thank You !

What is Web API and why to use it ? What is REST?

The API is stand for "Application Program Interface" and web we commonly use for internet application so Web API means the service or interface or endpoint which available on internet to retrieve and update application data for the client.

Here client means general it can be Web Client , Mobile Client  etc etc possible on all available operating system.

Web Clients means all browsers like Internet Explorer, Google Chrome , Safari, Opera etc
Mobile Client means iPhone,iPad , Android Phones and tablets or Windows Phones and tablets

Today creating web application is not enough because Mobile devices like Phones and Tablets are so popular to reach maximum people so you need to design application which make data available across all possible clients.

Let's consider modern application architecture which has several clients on different platforms including Mobile and Web Clients.

If you can notice all client apps are having it's own bussiness logic to connect with database and process data accordingly. This architecture is complex to scale and enhance application. Adding single business rule change  also we need to add in all available business logic which introduce more defects,bugs and expensive also.

Now let's consider same application with central API along with common business layer.

Each clients are using common Application Program Interface and common business layers which will advantage over previous modern architecture.Now days creating Web API we are creating with one architecture pattern called REST and services which are following these pattern called as RESTfull services.

What is REST?
REST stands for ‘Representational State Transfer’ and it is an architectural pattern for creating an API that uses HTTP as its underlying communication method.

Almost every device that is connected to the internet already uses HTTP; it is the base protocol that the internet is built on which is why it makes such a great platform for an API.

HTTP is a request and response system; a calling client sends a request to an endpoint and the endpoint responds. The client and endpoint can be anything but a typical example is a browser accessing a web server or an app accessing and API.

Create pattern with "*" like as follows using While Loop in VB.NET.

Create pattern with "*" like as follows using  While Loop in VB.NET.

*                                              *                                                                 *
* *                                           * *                                                              * *
* * *                                        * * *                                                           * * *
                                                * * * *                                                        * * * *
                                                * * * * *                                                     * * * * *
In this post you will find one sample VB.NET console program which will print pattern like mentioned in the post using While Loop.

You will find same pattern solution using For Loop in my future post :

As you can see in post we need dynamic pattern so first we need to take user input to get number of cycle for this pattern output.

Once you have count you can use that count against While Loop to iterate your console output.

You will find 2 While Loop in this program. 1st Loop is required to perform number of iteration and with this loop only we will go to new line on console.

2nd while Loop is required to perform actual print of STAR ( * ).

Please find example and output of this VB.NET Program as mentioned.
Console Output :


Hope this simple program help any developers.

Please post your any questions or comments bellow on comment box. Thank You !                                                                                                           

This is is test post of Web API

This is is test post of Web API

AngularJS + Bootstrap Example ! step by step webpage coding.

In my previous post we have seen how to setup AngularJS & Bootstrap in your development machine.
If you are not clear with introduction of AngularJS & Bootstrap then first please review my following posts.

• What Is AngularJS? Introduction and Basic Example. 
• What is Bootstrap? Setup and Basic Template Example.

In this post we see one simple AngularJS + Bootstrap small example and it's page development step by step. Please check running page demo here : Click Here

We never get final expected webpage in straight one writing so i always go step by step approach of any webpage or application development.

Step 1:  First step is to create webpage with basic bootstrap template just to see our bootstrap require references are added proper or not.

<html>
  <head>
    <title>Bootstrap 101 Template</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    </head>
  <body>
    <h1>Hello, world!</h1>

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://code.jquery.com/jquery.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>
  </body>

</html>

Step 2 :  Once you check webpage change webpage title and webpage header"AngularJS & Bootstrap Example"

<title>AngularJS & Bootstrap Example</title>

<body>

<h2>AngularJS + Bootstrap Example</h2>

Step 3 : Go to the Bootstrap documentation page and find the component which you want to use in your page. I am going to use Panel for my "Order Summary" page so i will go to following link and get the sample of  Panel. https://getbootstrap.com/docs/3.3/components/#panels

<div class="panel panel-default">
  <div class="panel-body">
    Panel content
  </div>
  <div class="panel-footer">Panel footer</div>
</div>

Step 4 :  Change panel "Header" , "Content" & "Footer" as per following code sample.You will see that i have used Bootstrap CSS in most of all HTML elements like Input,Label,Panel which give nice view on webpage.

Step 5 :  After you test your Page layout now it's time to add AngularJS Directives as per following

• Add reference of AngularJS library in your page

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>

• Add ng-app directive which  define root of Angular App
• Add ng-model="price1" , ng-model="price2",ng-model="price3"  which bind HTML element with data value.
• Add Total as Angular Expression like "{{ price1 + price2 + price3 }}"

AngularExample2.html

Please post your comments or questions. Thank you !

Disclaimer

This site and owner of this site provides the information service to the public and Website owners.
This site and owner is not responsible for, and expressly disclaims all liability for, damages of any kind arising out of use, reference to, or reliance on any information contained within the site.

 While the information contained within the site is periodically updated, no guarantee is given that the information provided in this Website is correct, complete, and up-to-date.

This site and owner of this site are not responsible for the content you stream to your device and we do not condone piracy so it is your responsibility that you or the sites accessed for streaming have the correct copyright agreements in place and you access these at your own risk.

This site and owner do not host, upload or download any type of video files, live streams.If you have any legal issues please contact the appropriate owner or host sites.

Although the site may include links providing direct access to other Internet resources, including Web sites, this site is not responsible for the accuracy, copyright, compliance, legality, decency, or any other type of the content of streamed from your device contained in these sites.

Links from this site to third-party sites do not constitute an endorsement by this site of the parties or their products and services. The appearance on the

Web site of advertisements and product or service information does not constitute an endorsement by this site.

What is Bootstrap? Setup and Basic Template Example !

Bootstrap is a free front-end framework for faster and easier web development.

Bootstrap includes HTML , JS and CSS based design templates for forms ,button, input, Nav, Navbar, Label , Grid, Table, Graphic icon etc...

The fastest way to get Bootstrap is to download the precompiled and minified versions of our CSS, JavaScript, and fonts.

In this post you will see download and setup of bootstrap with testing basic template.

Get latest bootstrap download link here . http://bootstrapdocs.com/v3.0.2/docs/

Extract Zip file "bootstrap-3.0.2-dist.zip" you will see something like this.

bootstrap/
├── css/
│   ├── bootstrap.css
│   ├── bootstrap.min.css
│   ├── bootstrap-theme.css
│   └── bootstrap-theme.min.css
├── js/
│   ├── bootstrap.js
│   └── bootstrap.min.js
└── fonts/
    ├── glyphicons-halflings-regular.eot
    ├── glyphicons-halflings-regular.svg
    ├── glyphicons-halflings-regular.ttf
    └── glyphicons-halflings-regular.woff

You can also add reference required files from following Bootstrap CDN location.

<!-- Latest compiled and minified CSS -->

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap-theme.min.css">
<!-- Latest compiled and minified JavaScript -->
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.2/js/bootstrap.min.js"></script>

Please check your setup with following basic template.

basictemplate.html                          Please check the page out here :  Click Here

<!DOCTYPE html>

<html>
  <head>
    <title>Bootstrap 101 Template</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    </head>
  <body>
    <h1>Hello, world!</h1>

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://code.jquery.com/jquery.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>
  </body>
</html>

Hope this post help any developer.

Please post your questions in comment below, Thank You !

What Is AngularJS? Introduction and Basic Example.

AngularJS is a structural framework for dynamic web apps. AngularJS extends HTML with new attributes.

AngularJS is a JavaScript framework. It can be added to an HTML page with a <script> tag.

AngularJS extends HTML attributes with Directives, and binds data to HTML with Expressions

AngularJS is perfect for Single Page Applications (SPAs).

It is a library written in JavaScript and can be added to a web page with a script tag:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>

Let's take a look basic example so you will come to know how AngularJS directives or attributes which are adding with HTML.

AngularJS Example : 

<!DOCTYPE html>

<html>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>

<body>

   <div ng-app="">  
            <h3>Name: <input type="text" ng-model="name"></h3>  
            <h2 ng-bind="name"></h2>
     </div>
</body>
</html>

Check example output here  : Test Page Here 

 AngularJS starts automatically when the web page has loaded.

The ng-app directive tells AngularJS that the <div> element is the "owner" of an AngularJS application.

The ng-model directive binds the value of the input field to the application variable name.

The ng-bind directive binds the innerHTML of the <h2> element to the application variable name.

SPA : Angular is very famous for Single Page Application due to this binding benefit and with AJAX call we can bring data from server using web api or other call mechanism and those modules attributes updates in javascript file and changes to UI automatically reflects.

We will learn more for AngularJS in my next post. Thank You !

This is test post of Mobile App Xamarin

This is test post of  Mobile App Xamarin

This is test post for Mobile Cord

This is test post for Mobile Cordova App

Create pattern with "*" like as follows using C# or CSharp. Example of For Loop !

Create pattern with "*" like as follows using C# or CSharp. Example of For Loop !

*                                              *                                                                 *
* *                                           * *                                                              * *
* * *                                        * * *                                                           * * *
                                                * * * *                                                        * * * *
                                                * * * * *                                                     * * * * *
                                                                                                                   * * * * * *


In this post you will find one sample CSharp console program which will print pattern like mentioned in the post using For Loop.

You will find same pattern solution using While Loop in my future post :

As you can see in post we need dynamic pattern so first we need to take user input to get number of cycle for this pattern output.

Once you have count you can use that count against For Loop to iterate your console output.

You will find 2 For Loop in this program. 1st For Loop is required to perform number of iteration and with this loop only we will go to new line on console.

2nd For Loop is required to perform actual print of STAR ( * ).

Please find example and output of this CSharp Program as mentioned.

Console Output :

Hope this simple program help any developers.

Please post your any questions or comments bellow on comment box. Thank You !

Create simple calculator console program using CSharp or C#

This post is about simple calculator console application program using CSharp or C#.

Please find the code snippet as mentioned below which you can test either on Visual Studio IDE or .NET Fiddle online tool.

If you are not having an information about .NET Fiddle online tool then please check my previous blog post : Click Here

C# Code Sample


Output on Visual Studio IDE

Hope this simple program helps any developers to learn basic C# code techniques

Please post your questions on comments below. Thank You !

What is the MVC pattern?

The Model-View-Controller (MVC) architectural pattern separates an application into three main groups of components: Models, Views, and Controllers.Using this pattern you will achieve "Separation of Concern"  : Separate application into different layers so individual team can focus on their modules only. MVC pattern helps to create those layers and all layers are having their own responsibilities in the application which we will discuss later in this post.

All user client requests are routed to a Controller which is responsible for working with the Model to perform user actions and/or retrieve results of queries. The Controller chooses the View to display to the user, and provides it with any Model data it requires.View use that model data and rendered the final response and that will relay back to the client.

If your application is built if you keep all layers together then it will be difficult to scale,debug and enhance the application. MVC pattern come with different responsibilities on different layers which help to scale application easily. For Example UI changes are more compare with application business  rule change. so if you keep UI layers separate from business logic layers you will have chance to less errors during those UI change.

Both Controller and View depend on model however model is neither depend on Controller or View. This separation allow developer to test Model to be built and tested separately.

Now let's take a look individual responsibilities in details as mentioned.

Controller Responsibilities:-

• Controller is responsible to handle every user(client) requests, work with model and identify appropriate view to render final response.
•  Controller is the initial entry point, and is responsible for selecting which model types to work with and which view to render hence it's name is given as "Controlller"
• The view only displays information; the controller handles and responds to user input and interaction

Model Responsibilities 

• The Model in an MVC application represents application business logic or operations that should be performed by it.
• It also maintain the state of the application and notify the change in data.
• Model is responsible for storing and retrieving data from different data repositories. 
• Strongly-typed views will typically use ViewModel types specifically designed to contain the data to display on that view
•  The controller will create and populate these ViewModel instances from the model.

View Responsibilities 

• Views are responsible for presenting content through the UI.
• .Net use Razor view engine to embed .NET code in HTML markup
• We should keep minimum logic in view which is only related to present data.
• View use models and create final rendered HTML which will send to client as response.

Hope this article has given some basic idea of MVC pattern.

Please post your any questions in comments bellow. Thank You !

This is testing post for JQuery

This is testing post for JQuery

.Net Fiddle Great tool to check simple console C# program.

Few days ago i come across very simple but efficient online tool name as ".NET Fiddle" which is a great tool to test your C# program on internet.

Please get information about this tool on this link .NET Fiddle or https://dotnetfiddle.net/

It is efficient and time saving to test your simple C# logic quicker way no need of any other C# IDE like Visual Studio , etc...

They are a group of .NET developers who are sick and tired of starting Visual Studio, creating a new project and running it, just to test simple code or try out samples from other developers.

This tool was inspired by http://jsfiddle.net, which is just awesome.

Let's test simple "Hello World" C# program in this tool

using System;

public class Program
{
public static void Main()
{
            Console.WriteLine("Please Enter Name :");
            string strName = Console.ReadLine();
            Console.WriteLine("Hello " + strName);
            Console.WriteLine(".NET Fiddle Just Rocks!");
}
}

.NET Fiddle Tool :

The online tool is giving program intelligence and during update it is checking your syntax error also.

During update of program code tool compile the program and run automatically.

You can re-run same program by clicking "Run" icon or button.

Program Output :

Hope this information might be useful to any developers.

Please add your questions in the comment bellow. Thank You !