GOODWILL CHRISTIAN COLLEGE FOR WOMEN
C# AND DOT NET
FRAMEWORK
UNIT 1 INTRODUCTION TO .NET
TECHNOLOGIES
KAVITHA RAJALAKSHMI D
KAVITHA RAJALAKSHMI D INTRODUCTION TO .NET TECHNOLOGIES
Introduction to Web Technologies
Web Technology refers to the various tools and techniques that are utilized in the process of
communication between different types of devices over the internet. A web browser is used
to access web pages. Web browsers can be defined as programs that display text, data,
pictures, animation, and video on the Internet. Hyperlinked resources on the World Wide
Web can be accessed using software interfaces provided by Web browsers.
Web Technology can be classified into the following sections:
World Wide Web (WWW): The World Wide Web is based on several different
technologies: Web browsers, Hypertext Markup Language (HTML) and Hypertext
Transfer Protocol (HTTP).
Web Browser: The web browser is an application software to explore www (World
Wide Web). It provides an interface between the server and the client and requests to
the server for web documents and services.
Web Server: Web server is a program which processes the network requests of the
users and serves them with files that create web pages. This exchange takes place
using Hypertext Transfer Protocol (HTTP).
Web Pages: A webpage is a digital document that is linked to the World Wide Web
and viewable by anyone connected to the internet has a web browser.
Web Development:
Web development refers to the building, creating, and maintaining of websites. It includes
aspects such as web design, web publishing, web programming, and database management. It
is the creation of an application that works over the internet i.e. websites.
Web Development can be classified into two ways:
Frontend Development: The part of a website that the user interacts directly is
termed as front end. It is also referred to as the ‘client side’ of the application.
GOODWILL CHRISTIAN COLLEGE FOR WOMEN Page 1
KAVITHA RAJALAKSHMI D INTRODUCTION TO .NET TECHNOLOGIES
Backend Development: Backend is the server side of a website. It is the part of the
website that users cannot see and interact. It is the portion of software that does not come
in direct contact with the users. It is used to store and arrange data.
Frontend Languages:
The front end portion is built by using some languages which are discussed below:
HTML: HTML stands for Hypertext Markup Language. It is used to design the front-
end portion of web pages using a markup language. HTML is the combination of
Hypertext and Markup language. Hypertext defines the link between the web pages. The
markup language is used to define the text documentation within the tag which defines
the structure of web pages.
CSS: Cascading Style Sheets fondly referred to as CSS is a simply designed language
intended to simplify the process of making web pages presentable. CSS allows you to
apply styles to web pages. More importantly, CSS enables you to do this independent of
the HTML that makes up each web page.
JavaScript: JavaScript is a famous scripting language used to create magic on the sites
to make the site interactive for the user. It is used to enhancing the functionality of a
website to running cool games and web-based software.
AJAX: Ajax is an acronym for Asynchronous Javascript and XML. It is used to
communicate with the server without refreshing the web page and thus increasing the
user experience and better performance.
There are many other languages through which one can do front-end development depending
upon the framework for example Flutter user Dart, React uses JavaScript and Django uses
Python, and much more.
Backend Languages:
The back end portion is built by using some languages which are discussed below:
PHP: PHP is a server-side scripting language designed specifically for web
development. Since PHP code executed on the server-side, so it is called a server-side
scripting language.
GOODWILL CHRISTIAN COLLEGE FOR WOMEN Page 2
KAVITHA RAJALAKSHMI D INTRODUCTION TO .NET TECHNOLOGIES
Node.js: Node.js is an open-source and cross-platform runtime environment for
executing JavaScript code outside a browser. You need to remember that NodeJS is
not a framework, and it’s not a programming language. Most people are confused and
understand it’s a framework or a programming language. We often use Node.js for
building back-end services like APIs like Web App or Mobile App. It’s used in
production by large companies such as Paypal, Uber, Netflix, Wallmart, and so on.
Python: Python is a programming language that lets you work quickly and integrate
systems more efficiently.
Ruby: Ruby is a dynamic, reflective, object-oriented, general-purpose programming
language. Ruby is a pure Object-Oriented language developed by Yukihiro
Matsumoto. Everything in Ruby is an object except the blocks but there are
replacements too for it i.e procs and lambda. The objective of Ruby’s development
was to make it act as a sensible buffer between human programmers and the
underlying computing machinery.
Java: Java is one of the most popular and widely used programming languages and
platforms. It is highly scalable. Java components are easily available.
JavaScript: JavaScript can be used as both (front end and back end) programming.
Golang: Golang is a procedural and statically typed programming language having
the syntax similar to C programming language. Sometimes it is termed as Go
Programming Language.
C# :C# is a general-purpose, modern and object-oriented programming language
pronounced as “C sharp”.
DBMS: The software which is used to manage database is called Database
Management System (DBMS).
Data Format:
Format of data is used by web applications to communicate with each other. It is light weight
text based data interchange format which means, it is simpler to read and write.
Below are two common data formats used in web development.
XML: Extensible Markup Language (XML) is a markup language that defines a set
of rules for encoding documents in a format that is both human-readable and
machine-readable.
JSON: JSON or JavaScript Object Notation is a format for structuring data.
API:
API is an abbreviation for Application Programming Interface which is a collection of
communication protocols and subroutines used by various programs to communicate between
them.
Web Protocols:
Web protocols are set of rules followed by everyone communicating over the web.
GOODWILL CHRISTIAN COLLEGE FOR WOMEN Page 3
KAVITHA RAJALAKSHMI D INTRODUCTION TO .NET TECHNOLOGIES
HTTP: The Hypertext Transfer Protocol (HTTP) is designed to enable
communications between clients and servers. HTTP works as a request-response
protocol between a client and server. A web browser may be the client, and an
application on a computer that hosts a web site may be the server.
Other Protocols:
TCP/IP Model
UDP
FTP
SMTP
SOAP
Graphics:
Graphical elements are one of the key feature of any webpage. They can be used to convey
important points better than text does and beautify the webpage.
Canvas: The HTML “canvas” element is used to draw graphics via JavaScript.
SVG: SVG stands for Scalable Vector Graphics.It basically defines vector-based
graphics in XML format.
HTML Basics
What is HTML ?
HTML stands for HyperText Markup Language. It is used to design web pages using the
markup language. HTML is the combination of Hypertext and Markup language. Hypertext
defines the link between the web pages and markup language defines the text document
within the tag that define the structure of web pages.
What is HTML used for ?
HTML is used to create the structure of web pages that are displayed on the World Wide
Web (www). It contains Tags and Attributes that are used to design the web pages. Also, we
can link multiple pages using Hyperlinks.
HTML Basic Format Page Structure
The basic structure of an HTML page is laid out below. It contains the essential building-
block elements (i.e. doctype declaration, HTML, head, title, and body elements) upon which
all web pages are created.
GOODWILL CHRISTIAN COLLEGE FOR WOMEN Page 4
KAVITHA RAJALAKSHMI D INTRODUCTION TO .NET TECHNOLOGIES
<DOCTYPE! html> – A doctype or document type declaration is an instruction that tells the
web browser about the markup language in which the current page is written. It is not an
element or tag. The doctype declaration is not case-sensitive.
<html> – This tag is used to define the root element of HTML document. This tag tells the
browser that it is an HTML document. It is the second outer container element that contains
all other elements within it.
<head> – This tag is used to define the head portion of the HTML document that contains
information related to the document. Elements within the head tag are not visible on the
front-end of a webpage.
<body> – The body tag is used to enclose all the visible content of a webpage. In other
words, the body content is what the browser will show on the front end.
Example 1: This example illustrates the HTML basic structure.
<!DOCTYPE html>
<html>
<head>
<!-- Information about the page -->
<!--This is the comment tag-->
GOODWILL CHRISTIAN COLLEGE FOR WOMEN Page 5
KAVITHA RAJALAKSHMI D INTRODUCTION TO .NET TECHNOLOGIES
<title> HTML basic structure.</title>
</head>
<body>
<!--Contents of the webpage-->
</body>
</html>
HTML Headings:
These tags help us to give headings to the content of a webpage. These tags are mainly
written inside the body tag. HTML provides us with six heading tags from <h1> to <h6>.
Every tag displays the heading in a different style and font size.
Example: This example illustrates the use of 6 heading tags from <h1> to <h6> in HTML.
<html>
<head>
<title>Headings <h1> to <h6></title>
</head>
<body>
<h1>Hello Headings h1</h1>
<h2>Hello Headings h2</h2>
<h3>Hello Headings h3</h3>
<h4>Hello Headings h4</h4>
<h5>Hello Headings h5</h5>
<h6>Hello Headings h6</h6>
</body>
</html>
GOODWILL CHRISTIAN COLLEGE FOR WOMEN Page 6
KAVITHA RAJALAKSHMI D INTRODUCTION TO .NET TECHNOLOGIES
HTML Paragraph:
These tags help us to write paragraph statements on a webpage. They start with the <p> tag
and ends with </p>.
HTML Break:
These tags are used for inserting a single line type break. It does not have any closing tag. In
HTML the break tag is written as <br>.
Example: This example illustrates the use of the <p> tag for writing a paragraph statement in
HTML.
<html>
<head>
<title>Paragraph Example</title>
</head>
<body>
<h1>Hello GCCW</h1>
<p> A Computer Science portal for geeks<br>
A Computer Science portal for geeks<br>
A Computer Science portal for geeks<br>
</p>
</body>
</html>
HTML Horizontal Line:
The <hr> tag is used to break the page into various parts, creating horizontal margins with
help of a horizontal line running from the left to right-hand side of the page. This is also an
empty tag and doesn’t take any additional statements.
Example: This example illustrates the use of the <hr> tag for the horizontal line in HTML.
<html>
<head>
<title>Horizontal Line Example</title>
</head>
GOODWILL CHRISTIAN COLLEGE FOR WOMEN Page 7
KAVITHA RAJALAKSHMI D INTRODUCTION TO .NET TECHNOLOGIES
<body>
<h1>Hello GeeksforGeeks</h1>
<p>
A Computer Science portal for geeks<br>
A Computer Science portal for geeks<br>
A Computer Science portal for geeks<br>
</p>
<hr>
<p>
A Computer Science portal for geeks<br>
A Computer Science portal for geeks<br>
A Computer Science portal for geeks<br>
</p>
<hr>
<p>
A Computer Science portal for geeks<br>
A Computer Science portal for geeks<br>
A Computer Science portal for geeks<br>
</p>
<hr>
</body>
</html>
HTML Images:
The image tag is used to insert an image into our web page. The source of the image to be
inserted is put inside the <img src=”source_of_image“> tag.
GOODWILL CHRISTIAN COLLEGE FOR WOMEN Page 8
KAVITHA RAJALAKSHMI D INTRODUCTION TO .NET TECHNOLOGIES
Image can be inserted in the image tag in two formats: –
If the image is in the same folder, then we can just write the name of the image and
the format as the path.
If the image is in another folder, then we do need to mention the path of the image
and the image name as well as the format of the image.
Example: This example illustrates the use of the <img> tag for inserting the images in
HTML.
<html>
<head>
<title>Image Example </title>
</head>
<body>
<img src="https://images.unsplash.com/photo-1610447847416-40bac442fbe6" width="50">
</body>
</html>
Core attributes
Core attributes may also be applied across almost the entire range of HTML elements.
Core attributes are
id
title
class
style
lang
dir
id
The id attribute of an HTML element provides a unique identifier for an element within
the document.
The value of id attribute must be absolutely unique.
The id attribute value must begin with an alphabet and followed by any combination of
digit, hyphens (-), underscores (_), colons (:), and periods (.).
The id value is case sensitive.
Syntax:
<element id=“value”>
GOODWILL CHRISTIAN COLLEGE FOR WOMEN Page 9
KAVITHA RAJALAKSHMI D INTRODUCTION TO .NET TECHNOLOGIES
Example:
<div id=“mnu”>
title
The title attribute specifies extra information about an element.
The information is displayed in a tooltip when the mouse pointer is placed over the
element.
Syntax:
<element title=“text”>
Example:
<h1 title=“about JavaScript”>JavaScript</h1>
class
The class attribute is used to specify the class of element.
This attribute is used to associate an element with a style sheet.
One or more class names can be specified for an element.
Syntax:
<element class="classname">
Example:
<div class="applycolor">Welcome to CareerRide Info</div>
style
The style attribute specifies an inline style for the element.
This attribute provides the facility to specify Cascading Style Sheet (CSS) rules within
the element.
Example:
<p style="font-family:arial; color:#800080; text-align:center">CareerRide Info</p>
lang
The lang attribute specifies the language of the element’s content along with the
language of any attribute content.
This attribute is used to identify the language of the content on a web page.
The language of the document is declared in the <html> tag.
Syntax:
<element lang=“language_code”>
Example:
<html lang="en">
dir
The dir attribute specifies the reading direction for text as left to right or right to left.
GOODWILL CHRISTIAN COLLEGE FOR WOMEN Page 10
KAVITHA RAJALAKSHMI D INTRODUCTION TO .NET TECHNOLOGIES
The dir attribute tells the browser the direction in which the displayed text is intended
to be read.
The dir attribute can take one of the following two values.
Ltr - Left to right direction
Rtl - Right to left direction
Syntax:
<element dir="ltr">
Example:
<p dir="rtl"> content </p>
OVERVIEW OF CLIENT SIDE TECHNOLOGIES AND SERVER SIDE
TECHNOLOGIES
Web Application Development involves communication between the client browser and the
server. The web applications are developed by using different scripting languages in addition
to HTML and CSS. The most commonly used scripting languages/ technologies are
JavaScript, VBScript, ASP, Perl, Python, PHP, Ruby on Rails to mention a few. These
scripting technologies can be categorized as Client Side and Server Side Scripting
Technologies depending upon where these scripts are executed.
Scripting language codes needs to be embedded in another document like an HTML
document since one cannot develop a standalone application with a scripting language unlike
a programming language.
Client-side Scripting Technology
In this category the browser of the user requesting a web page executes the scripts written or
embedded in the requested web document. When a user requests a web page from the server,
the server sends the source code of the requested page to the client machine over the internet.
GOODWILL CHRISTIAN COLLEGE FOR WOMEN Page 11
KAVITHA RAJALAKSHMI D INTRODUCTION TO .NET TECHNOLOGIES
Browser processes the source code and presents the page to the user. A user is able to see the
code of a client-side scripted page by opening the source (in browser window open view
menu and select “View Source” or right click in the document window in browser and select
“View Source” or “View Page Source”).
In case of client side scripting, the processing of the embedded scripts will be done by
browser only if the scripting language is enabled on the client browser. Scripts received from
the internet may pose security threats since hackers can send the script along with a web page
to compromise a computer. It is preferable to disable scripting option to protect a computer
from unknown internet threats. In such case when a page contains a client-side script the
browser pops up a message and ask for the user’s permission to run such a script.
Commonly used Client Side Scripting technologies-
HTML (Hypertext Markup Language) and CSS (Cascading Style Sheets). CSS is used
for page formatting, controlling text size, color, placement and layout. It can also be
used to control the timing of appearance of various elements on a webpage.
VBScript and JavaScript are used for event handling and controlling results of the
defined event
Ajax (Asynchronous JavaScript and XML)
Java applets for embedding standalone applications in webpages
Flash Animation in which the actions are controlled with ActionScript
Server-side Scripting Technology
In this category when a user requests a webpage the script contained in it is executed by the
web server and only the results are returned to the client. The user request is responded by the
server that runs the script and generates HTML page. This dynamically generated HTML
document is sent to the client machine where the browser that displays it to the user. A user is
not able to see the code of a server side scripted page by opening the source.
Server-side scripting is a better alternative in case the web application needs to be customised
depending on the options chosen by the user or depending upon her requirements. This is the
most common mechanism to create interactive web sites like database applications, online
stores, feedback or order forms etc.
Commonly used Server Side Scripting languages or technologies-
PHP
ASP
NET
Ruby on Rails
Perl
Python
GOODWILL CHRISTIAN COLLEGE FOR WOMEN Page 12
KAVITHA RAJALAKSHMI D INTRODUCTION TO .NET TECHNOLOGIES
Difference Between Client Side And Server Side Scripting Technologies
Client Side Scripting Technologies Server Side Scripting Technologies
Scripts are processed or interpreted by the Scripts are processed or interpreted by the
browser web server
The response is faster Response is slower
The server sends only the HTML after
The browser receives the source code from
processing the requested page and script to
the server
the browser
The Scripting codes cannot access resources The Scripting codes can access resources
stored at web server stored at web server
The user can see only the output. She
The user can see the source code
receives the response in form of HTML
Needs to have a scripting language enabled Does not need to have a scripting language
browser enabled browser
Can result in processing overhead on server
No processing overhead on the server and lowering down the performance of a
website
Client-side scripting requires more time and
effort from the developers. The dynamic The source code will be processed by the
WebPages will be used on any kind of server so the developer or programmer just
browsers and the developer have to create has to code the pages according to the
codes that are compatible with the variety of scripting technology used on the server.
browsers that the users may use.
Client-side code is best option for the
applications where the page elements do not Server-Side coding is the better option where
depend on the database. Changing the color the data presented to the user is stored in a
or look of elements, changing fonts or hiding database. User validation, online reservation,
elements on the basis of user’s choice are saving data entered by user are examples
examples where Client-side scripting can be where Server-side scripting Is needed
used.
Advantages of Client-side Scripting
There are many great benefits of scripting on the client side, including:
The scripting language for clients is very simple to master and utilize. It requires no
programming expertise or prior experience.
The primary benefit of scripting on the client side can be that it's light and easy to use
(syntax not too complicated). Editing and executing code is quick.
The processing of data happens by the client, not the server, making it easier to scale
apps with large volumes of users. Thus, the servers are less burdened.
Data validation on the client side can be achieved with the help of a client-side
scripting programming language such as JavaScript.
The execution of scripts that are client-side is faster because once the Script has been
downloaded from the server, it's executable by the browser right on the computer of
the user.
Mathematical assessment is also a possibility by using scripting on the client side.
The client-side software helps complete complicated tasks in a few steps.
GOODWILL CHRISTIAN COLLEGE FOR WOMEN Page 13
KAVITHA RAJALAKSHMI D INTRODUCTION TO .NET TECHNOLOGIES
Only script code can be executed by the browser without being connected to the
server.
It takes less time to run script code.
Browser will respond instantly when a user presses any key or mouse moves or clicks,
etc.
Disadvantages of Client-side Scripting
There are some disadvantages to client-side scripting, which are as follows:
The biggest drawback to client-side scripting is it's not secure because the code is
transmitted in the form of a message to the client and, therefore, accessible to it when
the user checks the sources of his website page. In other words, the code is typically
visible.
Client-side programming is not a viable option for accessing databases or sending
sensitive information via the internet.
There is no assurance that the user has turned on JavaScript on the browser of his
personal computer. So, any necessary functionality is required to be loaded on the
server, despite possible instances that the server might be disabled.
The running of the Script (or program) is dependent on the browser used by the client
and its configuration, as well as the security level.
The web-based application that is based on robust JavaScript can be difficult to
troubleshoot and maintain.
Languages that Script on the client side are typically less functional than server-side
scripting languages.
Advantages of server-side scripting
Allows running programs in programming languages that aren’t supported by the
browser.
Enables you to program dynamic web applications browser- independently,
Client-side programming features such as Java applets, Dynamic Html, and
ActiveX controls, all of which are browsed specifically.
Can provide the client (browser) with data that does not reside at the client.
Provides improved security measures, since you can write code that can never be
viewed from the browser.
Disadvantages of server-side scripting
Increases the workload of the server.
Many scripts and content management systems tools require databases in order to
store dynamic data.
It requires the scripting software to be installed on the server.
The nature of dynamic scripts creates new security concerns, in some cases
making it easier for hackers to gain access to servers exploiting code flaws.
GOODWILL CHRISTIAN COLLEGE FOR WOMEN Page 14
