resume pic
I.T
Make IT Work for You

CODE SAMPLES

Many time we need to align text vertical and we use css property vertical-align. However, this property don't work this way, it has different meaning than aligning text inside an element. I gone through many web pages, I found this page best explain its meaning with visual example. Then, how can we middle align text inside say div element?

Padding-Top or Top: Simplest is to use css properties 'padding-top' or 'top' to set vertical position of text anywhere inside parent element.

Top & Line-Height: You can use top & line-height properties together to positioned content vertically having more control on exact position.
Suppose you want to bottom align text inside a div element of height:200px; following css code can be used:

line-height:20px;
top:180px;

Line-Height: If you need to middle align one-line text vertically, you can set line-height property equal to height of container to align text in middle of container vertically as given in following example:

border:1px solid gray;
height:80px;
line-height:80px;
Middle Aligned

Position & Transform: Another trick to vertically position the text is by using 'top' property and 'translateY' together. Also Text container should be placed inside another container set us 'position:relative' whereas text container should be set as 'position:absolute' as given in the following example:

.myContainer {
border:1px double gray;
width:50%;
height:100px;
position:relative;
}
.myParagraph {
top: 50%;
transform: translateY(-50%);
position:absolute;
}

It will produce the following result:

Middle Aligned

To learn more about it, please visit w3schools here.

Use following classes to vertical align text in bootstrap 4: d-flex align-items-center or align-self-center

NOTE: 'valign' tag is depricated and should not be used anymore

For any questions, please contact me

Text-Shadow: This CSS property is used to decorate text. Sometime your text color do not look prominent on background. If you do not want to change text color and background, you can add text shadow to make it prominent and beautify as given in following example:

Text Without Shadow
Text With Shadow

Color of both text is same, difference is text-shadow. Following line of css code is used:
text-shadow: 1px 1px 2px black;
This shadow can be explained as:
1px along x-axis
1px along y-axix
2px blur radius
black color
For more details please visit w3schools here.

Routing enables http request or url to map towards a handler. In ASP.NET MVC, routing do not map an http request or url to a specific file in website. When a user request is received by mvc application, request is routed to specific controller. Controller then gather required data and pass it to corresponding view. This view is then randared to display requested page. How an HTTP request is directed to appropriate controller? This is where routing engine play its role. Routing engine is not specific for mvc, instead it is a part of asp.net runtime and hence can be used for asp.net webforms as well. It makes url better readable and memorable instead of ending with .aspx extention. Requested url contain information about controller and its specific action to call. Controller is a class in which each method is called as action. When a user request an MVC page, it first goes to Global.asax file where application start event is fired.

Following is code:

using System.Web.Mvc;
using System.Web.Routing;

namespace MyMVCapp
{
public class MvcApplication : System.Web.HttpApplication
{
protected void Application_Start()
{
RouteConfig.RegisterRoutes(RouteTable.Routes);
}
}
}

When you create mvc application, you may find this line of code in global.asax file: AreaRegistration.RegisterAllAreas(); it exist by default, however it is not required unless you add an area in your application. Area help in managing rounting for large application. Global.asax file calls RouteConfig class that may exist in separate file RouteConfig.cs under App_Start folder. If you want, you can place this class in Global.asax file. By default it exist in separate file as discussed because global.asax file contain application level events and methods. Therefore, it is good practice to declare routing pattern in separate file to keep code neat and clean. RouteConfig class calls a method 'RegisterRoutes which in turn creates route table. By default, one route is registered in this table that is called as default route. You can find it in RouteConfig.cs file, code is given below:

using System.Web.Mvc;
using System.Web.Routing;

namespace myMVCapp
{
public class RouteConfig
{
public static void RegisterRoutes(RouteCollection routes)
{
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

routes.MapRoute(
name: "Default",
url: "{controller}/{action}/{id}",
defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
);
}
}
}

You can register all the routes of your mvc application here.
IgnoreRoutes is an extension method of RouteCollection class used to ignore specific http request or url so that files need to be secured like resource files couldn't be accessed.

MapRoute an extension method of RouteCollection class accepts three parameters labelled as 'name', 'url' and 'defaults'. 'name' is used for identification of route and should be unique for each route. 'url' defines url pattern in which paranthesis {} are used as placeholders. When an http request comes in the form of something.com/a/b/c, then 'a' is the controller name, 'b' is the action name, and 'c' is an ID parameter that will be used by 'b' action method. 'defaults' contain default values for controller, action and id when no values are given in http request. Default value of id is null. Let us look into another example:

routes.MapRoute(
name: "Customer",
url: "customer/{id}",
defaults: new{ controller = "Customer", action = "all", id = UrlParameter.Optional }
);

Notice that in above example, we didn't specify action in 'url'. When an http request with a url say domain.com/customer is received, it will be handled by 'Customer' controller and always 'all' action method shall be called that may recieve a parameter if given in the url.

To learn more about routs, please open the following links:
ASP.NET Routing - MSDN
ASP.NET MVC Routing - TutorialsPoint.com
Routing in MVC - TutorialsTeacher.com
Coming Soon

When we run a program or process or method multiple times to perform multiple operations concurrently, it is termed as multithreading programming. By default each program has one thread. Let us consider the following code:

  1. Imports System.Threading
  2. Dim EmailThread As Thread
  3. EmailThread = New Thread(AddressOf sendEmails)
  4. EmailThread.Start(credentials)
  1. Using System.Threading;
  2. Thread EmailThread;
  3. EmailThread = new Thread(sendEmails);
  4. EmailThread.Start(credentials);
Background: We need to send bulk emails. If we send emails in a queue, it can take time to send one by one, however if we send multiple emails simultaneously, it can save our time and bulk emails can be sent in short time.

Explanation: ‘sendEmails’ is a function used to send an email. ‘credentials’ is argument of type arraylist that include all information required to send email that is ‘To’ and ‘From’ email ids, Password, SMTP Server, SSL, Port etc.

  1. First we need System.Threading namespace to import
  2. ‘EmailThread’ is a variable declared as Thread.
  3. ‘New’ keyword is used to instantiate ‘Thread’ delegate that will be used to associate its instance with function ‘sendEmails’ through operator ‘AddressOf’, and assigned it to variable ‘EmailThread’. In C# ‘AddressOf’ operator isn’t needed.
  4. ‘sendEmails’ function receives argument ‘credentials’ as explained above which is passed while starting thread by using ‘EmailThread.Start’ method.
You can place code that start a new thread in a timer tick event or loop to start as many threads as you want. There are many properties and methods available to manage and control threads.

Examples of properties are:
ThreadState Gets current state of thread i.e. running, stopped, suspended etc.
Priority: Gets or sets scheduling priority of thread from these values Highest, AboveNormal, Normal, BelowNormal, Lowest.
CurrentCulture: Gets or Sets culture for current thread i.e. default format of date, time, currency etc.
IsAlive: Returns true if thread is executing, otherwise false.
Name: Gets or sets name of the thread. Returns null if no name is set.

Examples of methods are:
Start(): Begins thread execution.
Sleep(Integer): Suspends thread for specified milliseconds in integral value.
Abort(): Raises an exception that can be handled in code, usually used to terminate thread.
Interrupt(): Throws an exception when thread is blocked. You can handle this exception in your code.
Join(): Blocks the calling thread say A.Start() until the thread say B.Join() whose Join method is called has completed.

For more details, please visit the following links: Microsoft docs - Multithreading
Tutorialspoint - Multithreading
Microsoft msdn - Multithreading

For any questions, please contact me

GoTo in vb.net or goto in C# are Jump statements because they jump Instruction Pointer or Program Counter (PC) directly to another statement anywhere in the code. It works in pair with label. Label is used to jump Instruction Pointer or Program Counter (PC) directly to label mentioned in goto statement. Following example of jump statement works as loop:

Dim i as Integer
i = 0
myLabel:
If i < 10 Then
i = i+1
System.Console.WriteLine("{0}",i)
GoTo myLabel
End If
System.Console.WriteLine("Exited from Loop")
int i = 0;
myLoop:
i++;
if (i <= 10)
{
Console.WriteLine("{0} ",i);
goto myLoop;
}
else
{
Console.WriteLine("End Loop");
}

JSON stands for JavaScript Object Notation. It is JavaScript readable text format primarily used to interchange data between a server and web application. It is important to note that in order to obtain data in JSON format through browser by some application ‘same origin policy’ should be satisfied to protect data from being accessed by unwanted resources. It mean protocol, port and primary domain should be the same for two applications exchanging data.

To understand how json can be used, consider the following example:

1- var jsObj = { rollno: 31, name: "Adam", grade: "O-level", marks: 459 };
2- var jsonString = JSON.stringify(jsObj);
3- window.location = "../examples/myjson.aspx?" + jsonString;

Explanation:
  1. JavaScript object is assigned a value consist of several properties. JS object and JSON has close resemblance.
  2. jsObj is converted into JSON string by using a JavaScript method stringify(jsObj)
  3. Opens web page myjson.aspx. '?' is used to distinguish url from query string that contain JSON data in our case.

Note URL of the new page opens when you press the 'Run Code' button, jsonString is passed to the page myjson.aspx as query string. You will find same JSON data on the opened page as well. This is because of the following code on the page that can be seen by viewing source code:

1- var pageurl = decodeURIComponent(window.location.href);  //get decoded url
2- var jsoninurl = pageurl.slice(pageurl.indexOf("?"));  //separate query string from url
3- jsoninurl = jsoninurl.slice(1);  //get rid of '?' which is not a part of query string
4- document.getElementById("example").innerHTML = jsoninurl;  //Display JSON

You can convert back JSON into JavaScript object by using the method JSON.parse(jsoninurl) and use it according to your requirements.

For more details, please visit here

For any questions, please contact me

AJAX Stands for Asynchronous JavaScript And XML, commonly used to communicate with server asynchronously. It mean we can update webpage content without refreshing whole webpage. It is now an essential part of modern web development. XMLHttpRequest object plays a key role in AJAX communication. This object has methods and properties. In our example, we shall use the following methods and properties:

METHODS:
open(method, url, async, user, pswd): ‘method’ and ‘url’ parameters are required for this method, others are optional. ‘method’ parameter can have values ‘GET’, ‘POST’ or ‘HEAD’. ‘url’ parameter specify file location. ‘async’ if true means asynchronous and synchronous if ‘false’.
send(): Sends request to the server.

PROPERTIES:
onreadystatechange: It calls function when readystate property is changed
readyState: It may have any of 5 numeric values from 0 to 4. Explanation is as follows:
0 when request is not initialized.
1 when connection with server is established.
2 when request is received by server.
3 when received request is in process.
4 when request is completed and response is ready.
status: Returns status code of request e.g. 200 for “OK”, 403 for “Forbidden”, 404 for “Not Found”.
responseText: Returns response data as string.

EXAMPLE:
I have set up a json file on this location: /examples/jsoncode.json. Following code sample sends request to server and in response the server sends data in jsoncode.json file:

<script>
function fetchjson() {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
var myjson = JSON.parse(this.responseText);
document.getElementById("jsondata").innerHTML = JSON.stringify(myjson);
document.getElementById("pair1").innerHTML = "Roll No = " + myjson.rollno;
document.getElementById("pair2").innerHTML = "Name = " + myjson.name;
document.getElementById("pair3").innerHTML = "Grade = " + myjson.grade;
document.getElementById("pair4").innerHTML = "Marks = " + myjson.marks;
}
};
xhr.open("GET", "jsoncode.json", true);
xhr.send();
}
</script>

You can find above code running on this page. View its source code to see html as well.

To learn more about AJAX, please visit w3schools and tutorialspoint.

For any questions, please contact me

Coming as soon as I find time to compile this topic

In early 21st century, metatags were considered important to rank higher your website in search engines. People start misusing it and filled them with desired keywords unnaturally. Search engines also noticed it and changed their algorithms, start banning such websites and changed ways to rank websites according to search terms to best meet user requirements. Nowadays, search engines are smart enough to detect unnatural ways used to populate a website with keywords to rank higher in search results. Therefore, a developer should design a website targeting audience and not search engines. However, still there are some tips a developer should follow to guide search engines what your site is all about so that you get a fair chance to have better ranking in search results.

  1. Keywords: First of all pick keywords for which you want to optimize your website. Google keywords planner can help you in this regard.
  2. Meta Tags: You can still use meta keywords and meta description tags to guide search engines about your website, however, make sure your meta tags are according to content of your website. Do not repeat keywords and do not give too many keywords, keep 150 alphabets round about for description and keywords each. Metatags given on this page are:

    <meta name="description" content="Code samples and explanation to express skills in the field of IT. People who are looking for web development or application development should contact.">
    <meta name="keywords" content="Code, IT, web development, application, development, SEO, services, website, programming, MVC, WebGL, animation, C#, SQL, bootstrap, IT skills, SQL server">
    <meta name="author" content="Adeel Rauf">

  3. Alt Tags: It is a good practice to give your images descriptive alt tags and name so that search engines could understand what this image is about and it helps in image optimization.
  4. Clean URL: Having keyword in URL is good practice for SEO. Avoid to have permalink having no descriptive name like c956321.htm, instead having clear name like codesample.htm. Do not change page name often.
  5. Page Title: It is important to have your keyword in Page Title. Page Title may have description as well, however long description in title adversely affect SEO.
  6. Heading: Main heading of page should have keyword, sub-headings are also important.
  7. Content: Page content should be relevant to keywords. Also websites having updated content usually rank higher.
  8. Internal Links: Your site should be integrated strongly. Website hierarchy should be clear. Navigation bar should be given on all pages. Sitemap also positively affect the SEO process. Big websites may have breadcrumb links.
  9. External Links: External links are most important in SEO. More the external links you have, better is your website ranking. Links from your website to popular website that match with your website content are also helpful.
  10. Indexing: Make sure your website is indexed by google. Normally google crawler keep crawling www and index all the websites unless you include noindex tag on your webpage as follows:

    <meta name="robots" content="noindex">

    for quick indexing you can submit your website to google search console.
For more details, please visit: Google SEO Guide

For any questions, please contact me