0% found this document useful (0 votes)
2 views26 pages

Web Technology Notes

Uploaded by

sixaf38696
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
2 views26 pages

Web Technology Notes

Uploaded by

sixaf38696
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

■ WEB TECHNOLOGY & ASP.

NET
[Link] Features | Classic ASP vs [Link] | Web Applications | Client-Server Architecture | Visual
Studio IDE | Creating Web Projects

■ Exam Gujarat Police Wireless PSI / Technical Operator

■ Subject Computer Engineering (Part B — Technical)

■ Importance MEDIUM-HIGH | Expected 6–10 Questions from this Topic

■ Chapters 6 Chapters | Complete Theory Coverage

Prepared exclusively for the Wireless PSI / Technical Operator Government Exam. All concepts are exam-focused,
concise, and aligned with the official syllabus.
■ TABLE OF CONTENTS

Chapter 1 — Introduction to Web Technology & [Link]


■ 1.1 What is Web Technology?
■ 1.2 Evolution of Web — Web 1.0, 2.0, 3.0
■ 1.3 What is [Link]?
■ 1.4 Key Features of [Link]
■ 1.5 [Link] Framework Architecture
■ 1.6 .NET Framework vs .NET Core vs .NET 5+

Chapter 2 — Classic ASP vs [Link] — Differences


■ 2.1 What is Classic ASP?
■ 2.2 Limitations of Classic ASP
■ 2.3 [Link] Improvements over Classic ASP
■ 2.4 Detailed Comparison Table
■ 2.5 [Link] Versions — 1.0 to Current

Chapter 3 — Web Applications, Webpages & Components


■ 3.1 What is a Website vs Web Application?
■ 3.2 Static vs Dynamic Webpages
■ 3.3 Components of a Web Application
■ 3.4 Web Application Tiers — Presentation, Logic, Data
■ 3.5 Technologies Used in Web Development
■ 3.6 [Link] Web Application File Types
■ 3.7 Code-Behind Model

Chapter 4 — Client-Server Architecture


■ 4.1 What is Client-Server Architecture?
■ 4.2 How HTTP Request-Response Works
■ 4.3 Types of Client-Server Models
■ 4.4 Two-Tier vs Three-Tier vs N-Tier Architecture
■ 4.5 Web Server vs Application Server vs Database Server
■ 4.6 IIS — Internet Information Services
■ 4.7 State Management in Web Applications

Chapter 5 — Visual Studio IDE — Introduction & Utilization


■ 5.1 What is Visual Studio?
■ 5.2 Visual Studio Editions
■ 5.3 Start Page
■ 5.4 Menu System — All Menus Explained
■ 5.5 Toolbars — Standard, Formatting, Debug
■ 5.6 Solution Explorer
■ 5.7 Toolbox
■ 5.8 Properties Window
■ 5.9 Output Window & Error List
■ 5.10 Server Explorer

Chapter 6 — Creating a Web Application in [Link]


■ 6.1 New Project Dialog Box
■ 6.2 [Link] Project Templates
■ 6.3 Graphical Designer — Design View
■ 6.4 Code Designer — Code-Behind Files
■ 6.5 ASPX Page Structure
■ 6.6 [Link] Web Controls Overview

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 2


■ 6.7 Page Life Cycle
■ 6.8 Simple Web Application — Step by Step
■ 6.9 Running and Debugging a Project

Quick Revision — Master Cheatsheet & Top 10 Exam Tips

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 3


Chapter 1

Introduction to Web Technology & [Link]

■ 1.1 What is Web Technology?

Web technology refers to the tools, languages, protocols, and frameworks used to build and maintain websites
and web applications that run over the internet or an intranet. It includes both client-side (browser) and
server-side (server) technologies.

Technology Type Examples Where it Runs

HTML, CSS, JavaScript, jQuery,


Client-Side (Frontend) Browser (user's computer)
React, Angular

[Link], PHP, Java Servlets,


Server-Side (Backend) Web Server
[Link], Python Django

SQL Server, MySQL, Oracle,


Database Database Server
MongoDB

Protocols HTTP, HTTPS, FTP, WebSocket Network layer

Markup Languages HTML5, XML, XHTML Browser parsing

JavaScript (client), VBScript, JScript


Scripting Browser / Server
(Classic ASP)

■ 1.2 Evolution of the Web

Generation Period Characteristics Technologies

Static pages — read-only web —


Web 1.0 1991–2004 one-way information flow — no user HTML, HTTP, FTP, static websites
interaction

Dynamic interactive web —


2004–presen AJAX, CSS3, JavaScript, Web APIs, Social
Web 2.0 user-generated content — social
t networks, Blogs, YouTube, Wikipedia
media — read-write web

Semantic web — AI-driven —


AI, Blockchain, Semantic markup, IoT, Big Data,
Web 3.0 Emerging decentralized — machine-readable —
Linked Data
personalized

Ultra-intelligent web — symbiotic


Web 4.0 Future Advanced AI, AR/VR, Brain-computer interface
human-machine — ubiquitous

✎ EXAM TIP: Web 1.0 = static read-only. Web 2.0 = dynamic interactive (AJAX, social media). Web 3.0 =
semantic + AI + decentralized. Most exam questions focus on Web 2.0 features!

■ 1.3 What is [Link]?

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 4


[Link] stands for Active Server Pages .NET. It is a server-side web application framework developed by
Microsoft as part of the .NET platform. It allows developers to build dynamic web pages, web applications, and
web services.

[Link] Parameter Details

Full Form Active Server Pages .NET

Developer Microsoft Corporation

First Release January 2002 ([Link] 1.0 with .NET Framework 1.0)

Type Server-side web application framework

Language Support C#, [Link], F# (any .NET language)

Runs On Internet Information Services (IIS) web server

Platform Originally Windows only; .NET Core = cross-platform

License Open Source (MIT License for .NET Core/5+)

File Extension .aspx (Web Forms), .cshtml (Razor), .vbhtml (VB Razor)

Current Version .NET 8 (Long Term Support)

■ 1.4 Key Features of [Link]

Feature Description

[Link] code is compiled (not interpreted line-by-line). First request compiles pages to
Compiled Code
native code — subsequent requests are very fast.

Language Independence Supports any .NET language — C#, [Link], F#. Developer can choose preferred language.

Rich set of server-side controls (TextBox, Button, GridView, etc.) that generate HTML
Server Controls
automatically with events.

Separates presentation (ASPX) from business logic (CS/VB code-behind file) — clean
Code-Behind Model
MVC-like separation.

Automatically maintains state of server controls across postbacks — stores values in hidden
ViewState
field on page.

Session & Application State Built-in state management — Session for per-user data, Application for global data.

Built-in Security Forms Authentication, Windows Authentication, Role-based security, Membership provider.

Caching Output caching, data caching, fragment caching — improves performance significantly.

Web Services & API Easy to create XML Web Services (.asmx) and RESTful APIs ([Link] Web API).

Consistent look across entire application using Master Pages (Web Forms) or Layouts
Master Pages / Layouts
(MVC/Razor).

Debugging Full integration with Visual Studio debugger — breakpoints, watch windows, step-through.

Third-Party Controls Rich ecosystem of third-party controls — Telerik, DevExpress, Infragistics.

Cross-Platform (.NET Core) [Link] Core runs on Windows, Linux, and macOS — not just Windows IIS.

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 5


Feature Description

Open Source [Link] Core is fully open source on GitHub under MIT license.

✎ EXAM TIP: Key [Link] features: compiled (fast), code-behind (separation), server controls,
ViewState, session management, built-in security, caching. "Compiled code" is the most asked feature!

■ 1.5 .NET Framework Architecture

Layers of .NET Framework (top to bottom):


[Link] Web Apps | Windows Forms | WPF | WCF | Console Apps [Link] (Data Access) Base Class
Library (BCL) Common Language Runtime (CLR) Operating System

Component Full Name Function

Common Language Execution engine — manages memory (garbage collection), JIT compilation,
CLR
Runtime security, exception handling

BCL Base Class Library Huge library of pre-built classes for collections, I/O, strings, math, networking, etc.

ActiveX Data Objects Data access layer — connects to databases using DataSet, DataReader,
[Link]
.NET SqlConnection, etc.

Active Server Pages


[Link] Web application framework — runs on top of CLR and BCL
.NET

Compiles MSIL (IL code) to native machine code at runtime — run once, cache for
JIT Just-In-Time Compiler
reuse

Microsoft Intermediate
MSIL/IL Intermediate code produced by .NET compilers — CLR executes this
Language

✎ EXAM TIP: CLR = heart of .NET = JIT compilation + garbage collection + security. Code compiled to IL
first, then JIT converts to machine code at runtime. This two-step compilation is unique to .NET!

■ 1.6 .NET Framework vs .NET Core vs .NET 5+

Feature .NET Framework .NET Core .NET 5 / 6 / 7 / 8

Cross-platform
Platform Windows only Cross-platform
(Win/Linux/Mac)

Release Year 2002 2016 2020+

Open Source Partially Yes (MIT) Yes (MIT)

Performance Good Better Best

Side-by-side
No Yes Yes
versioning

WinForms/WPF
Yes Limited Yes
support

Future Legacy (no new features) Merged into .NET 5+ Active development

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 6


Feature .NET Framework .NET Core .NET 5 / 6 / 7 / 8

[Link] Web Forms /


[Link] version [Link] Core [Link] Core
MVC

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 7


Chapter 2

Classic ASP vs [Link] — Differences

■ 2.1 What is Classic ASP?

Classic ASP (Active Server Pages) was Microsoft's first server-side scripting technology, introduced in 1996. It
used VBScript or JScript embedded directly in HTML pages to create dynamic content. Files had .asp
extension.

Classic ASP Limitations:


• Interpreted — Script executed line by line at each request — slow performance
• Spaghetti code — HTML and server code mixed in same file — hard to maintain
• Only VBScript/JScript — limited to two weakly-typed scripting languages
• No server controls — developer must write all HTML manually
• Poor error handling — limited built-in error handling mechanisms
• No object orientation — VBScript has very limited OOP support
• No compiled code — cannot use precompiled assemblies efficiently
• Session management issues — session stored on single server (scaling problem)
• Windows only — tied to IIS on Windows platform

■ 2.2 Classic ASP vs [Link] — Detailed Comparison

Feature Classic ASP [Link]

Year Introduced 1996 2002

File Extension .asp .aspx (Web Forms), .cshtml (Razor)

Language VBScript, JScript only Any .NET language: C#, [Link], F#

Execution Interpreted (slow) Compiled to IL then JIT (fast)

HTML and code mixed


Code Structure Code-behind separation (clean)
(spaghetti)

Limited (VBScript is
Object Orientation Full OOP — C# is strongly typed
weakly OO)

Controls No server controls Rich server controls (Button, Grid, etc.)

State Management Basic (Session, Cookies) ViewState, Session, Application, Cache

Limited, custom error


Error Handling Structured try-catch, custom error pages
pages

Security Limited built-in security Forms Auth, Windows Auth, Role-based

Difficult — no IDE
Debugging Full Visual Studio debugger integration
integration

Slow (interpreted each


Performance Fast (compiled, caching)
request)

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 8


Feature Classic ASP [Link]

Database Access ADO (classic) [Link] (strongly typed, DataSet)

Web Services Not built-in Built-in XML Web Services and Web API

Master Pages Not available Master Pages / Layouts for consistent UI

Configuration Registry settings [Link] XML file

Deployment Copy files to server Publish/deploy with full build

Platform Windows IIS only Windows IIS; .NET Core = Linux/Mac too

Scalability Poor Excellent — load balancing, web farms

Community/Support No longer updated Active development, large community

✎ EXAM TIP: Classic ASP = interpreted, VBScript, .asp extension, no server controls, code-mixed.
[Link] = compiled, any .NET language, .aspx extension, server controls, code-behind separation!

■ 2.3 [Link] Versions Timeline

Version Year .NET Framework Key Features Added

[Link] 1.0 2002 .NET 1.0 First release — Web Forms, server controls, code-behind

[Link] 1.1 2003 .NET 1.1 Bug fixes and improvements

[Link] 2.0 2005 .NET 2.0 Master Pages, Membership, Themes, Generics

[Link] 3.5 2007 .NET 3.5 LINQ, AJAX built-in, WCF, jQuery

[Link] 4.0 2010 .NET 4.0 Routing, MVC 2, Dynamic Data

[Link] MVC 5 2013 .NET 4.5 Scaffolding, [Link] Identity, OWIN

[Link] Core 1.0 2016 Cross-platform Completely rewritten, cross-platform, open source

[Link] Core 2.0 2017 .NET Core 2 Razor Pages, SignalR, Health Checks

[Link] Core 3.0 2019 .NET Core 3 Blazor, gRPC, Worker Services

[Link] 5/6/7/8 2020+ .NET 5+ Unified platform, minimal APIs, .NET MAUI

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 9


Chapter 3

Web Applications, Webpages & Components

■ 3.1 Website vs Web Application

Feature Website Web Application

Collection of static or dynamic


Definition Software application accessed via web browser
web pages

Mostly passive — user


Interaction Highly interactive — user performs actions
reads/views

Content Primarily informational content Functional — performs tasks (e-commerce, email, banking)

User input Minimal (forms, search) Extensive (data entry, transactions, processing)

Authentication Usually not required Usually required (login system)

News sites, blogs, company


Examples Gmail, Facebook, Amazon, online banking
info pages

Complexity Lower Higher — business logic, database, security

■ 3.2 Static vs Dynamic Webpages

Feature Static Webpage Dynamic Webpage

Fixed — same for every


Content Changes based on user, time, data, input
visitor

Technology HTML, CSS only [Link], PHP, JavaScript, database

Server Processing None — file served directly Server processes code before sending HTML

File extension .html, .htm .aspx, .php, .jsp, .cshtml

Database No database needed Usually requires database

Maintenance Manual file editing Updated through application/database

Very fast (no server


Speed Slightly slower (server processing)
processing)

Example Company brochure site E-commerce, social media, online banking

✎ EXAM TIP: Static page = same content always = HTML/CSS only. Dynamic page = content changes =
server-side processing = [Link]/PHP/database. .aspx = [Link] dynamic page!

■ 3.3 Components of a Web Application

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 10


Component Description [Link] Implementation

What user sees and interacts with —


Presentation Layer (UI) ASPX pages, Razor views, HTML helpers, server controls
HTML, CSS, JavaScript in browser

Business Logic Layer Processing and rules — application


Code-behind files (.cs), Class libraries, Business objects
(BLL) logic, calculations, validations

Database communication — CRUD [Link], Entity Framework, LINQ to SQL, stored


Data Access Layer (DAL)
operations procedures

Actual data storage — tables,


Database Layer SQL Server, Oracle, MySQL, SQLite
procedures, views

Handles HTTP requests and serves IIS (Internet Information Services) / Kestrel ([Link]
Web Server
responses Core)

Application settings and connection


Configuration [Link] (XML) / [Link] (.NET Core)
strings

Application-level events — start, end, [Link] file (Web Forms) / [Link] ([Link]
Global Application Class
error, session Core)

■ 3.4 [Link] Web Application File Types

File / Extension Purpose

.aspx [Link] Web Form page — contains HTML + server controls markup

.[Link] or .[Link] Code-behind file — C# or [Link] code for the .aspx page

.cs / .vb Class files — business logic, helper classes

[Link] XML configuration file — connection strings, app settings, HTTP handlers

[Link] Application-level events — Application_Start, Session_Start, Application_Error

[Link] Code-behind for [Link]

.master Master Page — shared layout template for all pages

.[Link] Code-behind for Master Page

.ascx User Control — reusable page fragment (custom control)

.asmx Web Service file — XML web service

App_Code Folder containing shared code classes accessible throughout application

App_Data Folder for database files (MDF) and XML data files

App_Themes Folder for themes — CSS, skins, images

bin Compiled assemblies (.dll files)

Bin/App_GlobalResources Resource files for localization/globalization

✎ EXAM TIP: .aspx = web form page. .[Link] = code-behind. [Link] = XML configuration.
[Link] = application events. .master = master page template. App_Code = shared classes!

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 11


■ 3.5 Code-Behind Model

The code-behind model separates the HTML markup from the server-side code. This is one of [Link]'s most
important improvements over Classic ASP.

Example — [Link] (Markup file):


<%@ Page Language="C#" CodeBehind="[Link]" Inherits="[Link]" %> <html> <body>
<form id="form1" runat="server"> <asp:TextBox ID="txtName" runat="server"></asp:TextBox>
<asp:Button ID="btnSubmit" Text="Click Me" runat="server" OnClick="btnSubmit_Click" />
<asp:Label ID="lblResult" runat="server"></asp:Label> </form> </body> </html>

Example — [Link] (Code-behind file):


using System; namespace MyApp { public partial class Default : [Link] { protected
void Page_Load(object sender, EventArgs e) { // Code runs when page loads } protected void
btnSubmit_Click(object sender, EventArgs e) { [Link] = "Hello, " + [Link]; } }
}

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 12


Chapter 4

Client-Server Architecture

■ 4.1 What is Client-Server Architecture?

Client-Server Architecture is a computing model where one program (the client) requests services and another
program (the server) provides those services. The client and server communicate over a network using standard
protocols like HTTP/HTTPS.

Role Description Examples

Initiates requests — sends request to server, Web browser (Chrome, Firefox, Edge), mobile app, desktop
Client
receives and displays response app

Listens for requests, processes them, and


Server IIS ([Link]), Apache (PHP), Nginx, Tomcat (Java)
sends back response

Medium of communication between client and


Network Internet, Intranet, LAN, WAN
server

■ 4.2 HTTP Request-Response Cycle

Step-by-Step HTTP Flow for [Link]:


Step Action Detail

1 User enters URL in browser e.g., [Link]

2 DNS Resolution Browser resolves domain name to server IP address

3 TCP Connection Browser establishes TCP connection to server (port 80 or 443)

4 HTTP Request sent Browser sends GET or POST request with headers

5 IIS receives request Web server (IIS) receives and routes request to [Link]

6 [Link] processes CLR loads page, executes code-behind, queries database

7 HTML generated [Link] renders HTML from server controls and data

8 HTTP Response sent Server sends HTML, CSS, JS back to browser

9 Browser renders page Browser parses HTML and displays webpage to user

10 TCP Connection closed Connection released (HTTP/1.1 may keep-alive)

✎ EXAM TIP: HTTP Request types: GET = retrieve data (no body). POST = submit data (has body).
[Link] processes request on server, generates HTML, sends back to browser. IIS is the web server!

■ 4.3 Application Architecture Tiers

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 13


Architecture Tiers Description Use Case

All components on single machine — no


One-Tier (Standalone) 1 Desktop apps, simple local apps
network

Two-Tier
2 Client talks directly to database server Small applications, thick clients
(Client-Server)

Presentation + Business Logic + Data


Three-Tier 3 Most web applications
tiers separated

Multiple specialized layers —


N-Tier N (4+) Enterprise, large-scale systems
microservices

Three-Tier Architecture (Most Important for [Link]):


Tier 1 — Presentation: Browser + [Link] ASPX pages (HTML, CSS, JS) Tier 2 — Business Logic:
[Link] Code-behind, Class Libraries, Business Rules Tier 3 — Data: SQL Server / Oracle
database

✎ EXAM TIP: Three-tier = Presentation + Business Logic + Data tiers. Benefits: scalability,
maintainability, security, separation of concerns. Most [Link] apps use three-tier architecture!

■ 4.4 IIS — Internet Information Services

IIS (Internet Information Services) is Microsoft's web server software that hosts [Link] applications. It listens
for HTTP/HTTPS requests on port 80/443 and routes them to the appropriate [Link] application.

IIS Feature Description

Application Pool Isolated process for running web applications — provides security and stability

Default Port HTTP = Port 80; HTTPS = Port 443

Virtual Directory Maps a URL path to a physical folder on server

ISAPI Filter Plugin to IIS for pre-processing or post-processing requests

Site Bindings Configure hostname, IP, and port for each website

Logging IIS logs all HTTP requests — useful for debugging and analytics

Authentication Windows Auth, Basic Auth, Anonymous — configured in IIS

SSL/HTTPS Configure SSL certificates in IIS for HTTPS

Kestrel (Core) Lightweight [Link] Core web server — can run behind IIS or standalone

■ 4.5 State Management in [Link]

HTTP is stateless — each request is independent. [Link] provides multiple mechanisms to maintain state
between requests.

Mechanism Scope Storage Location Timeout Best For

Hidden field in HTML Page


ViewState Page only Control values on same page
page postback

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 14


Mechanism Scope Storage Location Timeout Best For

Server memory (or 20 min


Session Per user User-specific data across pages
SQL/Redis) (default)

Application All users Server memory App lifetime Global shared data

Cookies Per user Client browser Configurable Small data, preferences, auth tokens

QueryString Per request URL string Request only Passing data between pages via URL

Page
Hidden Fields Page only HTML hidden input Storing values in HTML form
postback

Cache All users Server memory Configurable Frequently accessed, rarely changed data

✎ EXAM TIP: ViewState = page-level in hidden field. Session = per-user server-side. Application = global
server-side. Cookie = client-side. QueryString = URL parameter. ViewState is unique to [Link]!

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 15


Chapter 5

Visual Studio IDE — Introduction & Utilization

■ 5.1 What is Visual Studio?

Visual Studio is Microsoft's flagship Integrated Development Environment (IDE) for building .NET applications,
including [Link] web applications. It provides a comprehensive set of tools for writing, debugging, testing, and
deploying applications.

Visual Studio
Target User Cost Key Features
Edition

Students, individual
Community Free Full-featured, limited commercial use
developers, open source

Professional developers,
Professional Paid All Community features + CodeLens, profiling
small teams

Paid
Enterprise Large organizations All Professional + testing, architecture tools
(highest)

Lightweight editor — all


Visual Studio Code Free Extensions-based, not full IDE — separate product
platforms

✎ EXAM TIP: Visual Studio Community = FREE and full-featured for students. Visual Studio Code =
separate lightweight editor (not the same as Visual Studio). VS = Windows. VS Code = Cross-platform!

■ 5.2 Visual Studio Start Page

The Start Page (now called Start Window) is the first screen shown when Visual Studio launches. It provides
quick access to common tasks.

Start Page Section Content / Purpose

Recent Projects List of recently opened projects and solutions for quick access

Open a project Browse and open existing project/solution files (.sln, .csproj)

Create a new project Launch New Project dialog to start a new application

Clone a repository Clone a Git repository from GitHub, Azure DevOps, or other sources

News / What's New Visual Studio team blog, updates, announcements (if online)

Get Started Links to tutorials, documentation, and learning resources

■ 5.3 Menu System — All Menus Explained

Menu Key Functions

File New Project, Open Project, Open File, Save All, Close Solution, Recent Files, Exit

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 16


Menu Key Functions

Edit Undo, Redo, Cut, Copy, Paste, Find & Replace (Ctrl+H), Go To Definition, IntelliSense

View Solution Explorer, Properties Window, Toolbox, Output Window, Error List, Server Explorer, Team Explorer

Project Add New Item (web form, class, control), Add Existing Item, Project Properties, References

Build Build Solution (F6), Rebuild Solution, Clean Solution, Publish Website

Debug Start Debugging (F5), Start Without Debugging (Ctrl+F5), Step Into (F11), Step Over (F10), Breakpoints

Test Run All Tests, Test Explorer, Code Coverage

Analyze Code Analysis, Performance Profiler, Code Metrics

Tools NuGet Package Manager, Options (IDE settings), Extensions and Updates, Visual Studio Command Prompt

Window Arrange windows, New Window, Float windows, Split editor

Help Documentation, About Visual Studio, Check for Updates, Send Feedback

✎ EXAM TIP: Most used menus: File (new/open), Debug (run F5), Build (build F6), View (windows),
Project (add items). Ctrl+F5 = run without debugging. F5 = run with debugging!

■ 5.4 Toolbars

Toolbar Key Buttons / Purpose

New Project, Open File, Save, Save All, Undo, Redo, Start Debugging, Solution Configuration
Standard Toolbar
(Debug/Release)

Formatting Toolbar Font, Font Size, Bold, Italic, Underline, Text color — for HTML Design view editing

Debug Toolbar Step Into (F11), Step Over (F10), Step Out, Continue (F5), Stop Debugging, Breakpoints

Layout Toolbar Align controls, size controls, spacing in Design view — useful for Web Forms design

HTML Source Editing Format document, word wrap, show/hide line numbers

Text Editor Comment/uncomment code, indent, format selection

■ 5.5 IDE Windows — Utilization of Each Part

IDE Window Shortcut Purpose & How to Use

Shows project file hierarchy — all files, folders, references. Right-click to


Solution Explorer Ctrl+Alt+L
add/remove items. Double-click to open files.

Contains all [Link] server controls (TextBox, Button, Label, GridView, etc.)
Toolbox Ctrl+Alt+X
and HTML controls. Drag and drop onto Design view to add controls.

Shows properties of selected control (ID, Text, Color, Width, etc.). Change
Properties Window F4
properties here or directly in ASPX markup.

Shows build output messages, error messages, debug output. Shows "Build
Output Window Ctrl+Alt+O
succeeded" or error count after build.

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 17


IDE Window Shortcut Purpose & How to Use

Lists all errors, warnings, and messages. Double-click error to jump to that line in
Error List Ctrl+\, E
code.

Browse database connections, servers, services. Can create/view/query


Server Explorer Ctrl+Alt+S
database tables directly without leaving VS.

Class View Ctrl+Shift+C Shows all classes, methods, properties in project in tree format.

Browse all .NET framework classes and your project's classes with
Object Browser Ctrl+Alt+J
documentation.

Task List Ctrl+\, T Shows TODO comments, bookmarks, and task shortcuts in code.

Find & Replace Ctrl+H Find text and replace across single file, project, or entire solution.

Code Snippet Manager Ctrl+K, Ctrl+B Manage pre-built code templates — type shortcut + Tab to insert snippet.

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 18


Chapter 6

Creating a Web Application in [Link]

■ 6.1 New Project Dialog Box

The New Project Dialog is accessed via File → New → Project (shortcut: Ctrl+Shift+N). It allows you to select
the type of application to create.

Dialog Section Description

Left Panel — Templates Organized by language (C#, [Link]) and platform (.NET, .NET Core)

Center Panel — Template List Shows available templates filtered by selections

Name field Enter project name (no spaces — convention: PascalCase)

Location field Browse folder where project files will be saved

Solution Name Name for the solution (.sln file) — can contain multiple projects

"Create new solution" Creates solution file containing the project

"Add to solution" Adds new project to existing open solution

Framework dropdown Select .NET version (e.g., .NET 6.0, .NET 8.0, .NET Framework 4.8)

OK / Create button Creates the project with selected template and settings

■ 6.2 [Link] Project Templates

Template Description Best For

[Link] Web Application Traditional Web Forms with drag-drop


Beginners, RAD development, Windows only
(.NET Framework) designer — rich server controls

[Link] Web Application Model-View-Controller pattern —


Professional web apps, testable code
(MVC) separation of concerns

RESTful API service — returns


[Link] Web API Backend APIs consumed by mobile/SPA apps
JSON/XML, no UI

Razor Pages — page-focused web


[Link] Core Web App Modern web apps — cross-platform
application

MVC pattern on .NET Core —


[Link] Core MVC Modern cross-platform web apps
cross-platform

Empty project — configure everything


Blank Web Application Maximum control — advanced developers
yourself

Minimal API or controller-based API on


[Link] Core API Modern REST APIs
.NET Core

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 19


✎ EXAM TIP: For exams: [Link] Web Application (Web Forms) = drag-drop designer = server controls
= beginners. MVC = Model-View-Controller = professional = testable. API = RESTful services!

■ 6.3 Graphical Designer — Design View

The Design View (Graphical Designer) in Visual Studio provides a WYSIWYG (What You See Is What You Get)
interface for designing web pages. You can drag and drop controls from the Toolbox onto the design surface.

How to Use Design View:


• Open an .aspx file — click "Design" tab at bottom of editor window
• The design surface shows a visual representation of the webpage
• Drag controls from Toolbox onto the page surface
• Select a control → Properties Window shows its properties (ID, Text, etc.)
• Double-click a control → automatically switches to Code view and creates event handler
• Right-click control → "Properties" or "View Code" options available
• Use Format menu or Layout toolbar to align and size controls
• Switch between Design, Source, Split views using tabs at bottom of editor

Three View Modes in [Link] Editor:

View Mode Description When to Use

Visual WYSIWYG designer — drag-drop


Design View Designing page layout, adding controls visually
controls — see visual layout

HTML/ASPX markup editor — shows actual


Source View Fine-tuning markup, adding attributes, editing HTML directly
code — IntelliSense support

Shows Design and Source views


Split View When you want to see both visual and code at same time
simultaneously — side by side

✎ EXAM TIP: Design View = WYSIWYG drag-drop. Source View = HTML/ASPX markup. Split View = both
together. Double-clicking control in Design view creates event handler in code-behind!

■ 6.4 Code Designer — Code-Behind Files

The Code Designer (Code View) is the text editor for writing C# or [Link] code in code-behind files. It provides
IntelliSense, syntax highlighting, code navigation, and debugging support.

Key Code Editor Features:

Feature Description Shortcut

Auto-complete for code — shows


IntelliSense methods, properties, parameters as you Ctrl+Space
type

Different colors for keywords, strings,


Syntax Highlighting Automatic
comments, variables

Pre-written code templates — type


Code Snippets Ctrl+K, Ctrl+X
shortcut + Tab to insert

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 20


Feature Description Shortcut

Go To Definition Jump to where a method/class is defined F12

See everywhere a method/variable is


Find All References Shift+F12
used

Rename, extract method, change


Refactor Ctrl+R, Ctrl+R
signature safely

Bookmarks Mark lines for quick navigation Ctrl+K, Ctrl+K

Comment or uncomment selected code


Comment/Uncomment Ctrl+K, Ctrl+C / Ctrl+U
lines

Auto-format entire code file with correct


Format Document Ctrl+K, Ctrl+D
indentation

Collapse/Expand Collapse method/region for cleaner view Click grey minus icon

Red underline = error, green = warning —


Error Squiggles Hover mouse
hover for message

■ 6.5 [Link] Page Structure & Life Cycle

ASPX Page Structure:


<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="[Link]"
Inherits="[Link]" %> <!DOCTYPE html> <html xmlns="[Link]
<head runat="server"> <title>My Page</title> </head> <body> <form id="form1" runat="server">
<!-- Server controls go here --> <asp:Label ID="Label1" runat="server"
Text="Hello"></asp:Label> </form> </body> </html>

[Link] Page Life Cycle Events (in order):


Order Event Description

1 Page_PreInit Earliest event — set Master Page, Theme programmatically

2 Page_Init Controls initialized — access to ViewState not yet available

3 Page_InitComplete Initialization complete

4 Page_PreLoad Before ViewState loaded

5 Page_Load Most common event — ViewState available — check IsPostBack here

6 Control Events Button click, TextChanged, SelectedIndexChanged etc.

7 Page_PreRender Last chance to change page before rendering — update controls

8 Page_Render HTML generated — framework handles this automatically

9 Page_Unload Cleanup — release database connections, file handles

✎ EXAM TIP: Page life cycle order: PreInit → Init → Load → Control Events → PreRender → Render →
Unload. Page_Load is most used. Check IsPostBack in Page_Load to distinguish first load vs form
submit!

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 21


■ 6.6 Common [Link] Server Controls

Control Tag Purpose Key Properties

Display text —
Label asp:Label Text, CssClass, ForeColor
non-editable output

Text, TextMode (Single/Multi/Password),


TextBox asp:TextBox User text input field
MaxLength

Clickable button — Text, OnClick event handler,


Button asp:Button
triggers PostBack CausesValidation

Hyperlink-style button —
LinkButton asp:LinkButton Text, OnClick
PostBack

ImageButton asp:ImageButton Clickable image button ImageUrl, OnClick

Navigation link — no
HyperLink asp:HyperLink Text, NavigateUrl, Target
PostBack

CheckBox asp:CheckBox Single checkbox Text, Checked, OnCheckedChanged

Single radio button — use


RadioButton asp:RadioButton Text, Checked, GroupName
GroupName

Items, SelectedItem,
DropDownList asp:DropDownList Dropdown select list
OnSelectedIndexChanged

ListBox asp:ListBox Multi-select list Items, SelectionMode (Single/Multiple)

Tabular data display — DataSource, AutoGenerateColumns,


GridView asp:GridView
sort, page, edit AllowPaging

Flexible data binding —


Repeater asp:Repeater DataSource, ItemTemplate
custom template

Container for grouping


Panel asp:Panel Visible, CssClass, GroupingText
controls

Image asp:Image Display image ImageUrl, AlternateText

FileUpload asp:FileUpload File upload control HasFile, FileName, SaveAs()

Calendar asp:Calendar Date picker calendar SelectedDate, OnSelectionChanged

ValidationSummar
asp:ValidationSummary Shows all validation errors DisplayMode, ShowMessageBox
y

✎ EXAM TIP: All [Link] server controls use runat="server" attribute. They generate HTML
automatically. GridView = tabular data. TextMode="Password" hides text. ID is used in code-behind!

■ 6.7 Simple Web Application — Step by Step

Creating a Simple "Hello World" Web Application:

Step Action Details

1 Open Visual Studio Launch Visual Studio IDE

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 22


Step Action Details

2 Create New Project File → New → Project (Ctrl+Shift+N)

3 Select Template Choose "[Link] Web Application (.NET Framework)" → C#

4 Configure Project Enter Name: "HelloWorldApp", choose Location, click OK

5 Select Template Type Choose "Web Forms" in template selection → click OK

6 Project Created Solution Explorer shows [Link], [Link], [Link]

7 Open [Link] Double-click [Link] in Solution Explorer

8 Switch to Design View Click "Design" tab at bottom of editor

9 Add Controls Drag TextBox from Toolbox → drag Button → drag Label

10 Set Properties Select Button → Properties → Text = "Say Hello"

11 Create Event Double-click Button → code-behind opens with click handler

12 Write Code Type: [Link] = "Hello, " + [Link] + "!";

13 Build Press F6 or Build → Build Solution

14 Run Press F5 (with debug) or Ctrl+F5 (without debug)

15 Test Browser opens — enter name → click button → see result

■ 6.8 Running and Debugging

Action Shortcut Description

Start Debugging F5 Run app with debugger — can use breakpoints, watch variables

Start Without Debug Ctrl+F5 Run app faster — no debugger overhead

Stop Debugging Shift+F5 Stop running application

Set Breakpoint F9 Toggle breakpoint on current line — execution pauses here

Step Into F11 Execute next line — goes inside method calls

Step Over F10 Execute next line — does NOT go inside method calls

Step Out Shift+F11 Run until current method returns

Continue F5 Resume execution after paused at breakpoint

Debug →
Watch Window Windows → Monitor variable values during debugging
Watch

Immediate Window Ctrl+Alt+I Execute code expressions during debug pause

Debug →
Locals Window Windows → See all local variable values automatically
Locals

Build Solution F6 / Ctrl+Shift+B Compile entire solution — check for errors

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 23


✍ QUICK REVISION CHEATSHEET

All key facts in one place

Concept / Parameter Key Fact

[Link] full form Active Server Pages .NET

[Link] developer Microsoft Corporation

[Link] first release January 2002 (with .NET Framework 1.0)

[Link] language support Any .NET language: C#, [Link], F#

Classic ASP extension .asp file extension

[Link] extension .aspx (Web Forms), .cshtml (Razor MVC)

Classic ASP language VBScript and JScript only

Classic ASP execution Interpreted (slow)

[Link] execution Compiled to IL then JIT (fast)

Code-behind purpose Separates HTML markup from server-side code

Code-behind file extension .[Link] (C#) or .[Link] ([Link])

[Link] XML configuration file — connection strings, app settings

[Link] Application-level events — Application_Start, Session_Start

Master Pages .master file — shared layout template for all pages

User Controls .ascx file — reusable page fragment

App_Code folder Shared code classes accessible throughout application

App_Data folder Database files (MDF) and XML data

ViewState Maintains control state across postbacks — stored in hidden field

Session Per-user server-side data — default timeout 20 minutes

Application state Global server-side data — all users share

Cookie Client-side storage — stored in browser

QueryString Data passed in URL after ? symbol

IIS full form Internet Information Services — Microsoft web server

IIS HTTP port Port 80 (HTTP) and Port 443 (HTTPS)

CLR full form Common Language Runtime — .NET execution engine

CLR functions JIT compilation, garbage collection, security, exception handling

JIT full form Just-In-Time compiler — converts IL to native machine code

MSIL/IL Microsoft Intermediate Language — produced by .NET compilers

Three-tier architecture Presentation + Business Logic + Data tiers

HTTP GET Retrieve data — no request body — appears in URL

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 24


Concept / Parameter Key Fact

HTTP POST Submit data — has request body — data not in URL

Static webpage Same content for all visitors — HTML/CSS only

Dynamic webpage Content changes per user/data — server-side processing

Web 1.0 Static read-only web (1991-2004)

Web 2.0 Interactive user-generated content (2004+) — AJAX, social media

Web 3.0 Semantic AI-driven decentralized web

Visual Studio Community Free full-featured IDE for students and individuals

New Project shortcut Ctrl+Shift+N

Build solution shortcut F6 or Ctrl+Shift+B

Run with debug F5

Run without debug Ctrl+F5

Set breakpoint F9

Step Into F11

Step Over F10

Solution Explorer Ctrl+Alt+L — project file hierarchy

Toolbox Ctrl+Alt+X — drag-drop server controls

Properties Window F4 — properties of selected control

Output Window Ctrl+Alt+O — build messages and debug output

Error List Ctrl+\+E — errors, warnings, messages

IntelliSense shortcut Ctrl+Space — auto-complete code

Design View WYSIWYG drag-drop visual designer for web forms

Source View HTML/ASPX markup code editor

Split View Design + Source side by side simultaneously

runat="server" Required attribute for all [Link] server controls

asp:TextBox User text input control — TextMode for Password

asp:GridView Tabular data display — supports paging, sorting, editing

asp:Button OnClick Event raised when button clicked — triggers PostBack

Most common page event — check IsPostBack to detect first load vs


Page_Load
submit

IsPostBack True if page loaded due to form submit; False if first visit

Page life cycle order PreInit→Init→Load→ControlEvents→PreRender→Render→Unload

.NET Framework vs Core .NET Framework = Windows only. .NET Core = cross-platform

WYSIWYG What You See Is What You Get — Design View mode

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 25


■ TOP 10 EXAM TIPS

High-probability points — memorize before exam day

[Link] = Active Server Pages .NET. Developer = Microsoft. Year = 2002. Files = .aspx (Web Forms)
Tip 1
or .cshtml (Razor/MVC)

Classic ASP = interpreted + VBScript only + .asp extension + code mixed with HTML. [Link] =
Tip 2
compiled + any .NET language + code-behind separation!

Code-behind = separates HTML (aspx) from logic ([Link]) — biggest improvement over Classic ASP.
Tip 3
Double-click control = auto-creates event handler in code-behind!

[Link] = XML config file. [Link] = application events. .master = Master Page layout.
Tip 4
App_Code = shared classes. App_Data = database files!

State: ViewState=page(hidden field). Session=per user(server, 20min). Application=global(server).


Tip 5
Cookie=client browser. QueryString=URL parameter!

Three-tier architecture: Presentation(ASPX/browser) + Business Logic(code-behind/classes) +


Tip 6
Data(SQL Server). Most web apps use three-tier!

IIS = Internet Information Services = Microsoft web server = hosts [Link] apps. HTTP port=80.
Tip 7
HTTPS port=443. Application Pool = isolated app process!

CLR = Common Language Runtime = heart of .NET. JIT = compiles IL to native code. Garbage
Tip 8
Collection = automatic memory management. This makes [Link] faster than Classic ASP!

VS shortcuts: New Project=Ctrl+Shift+N. Build=F6. Run+Debug=F5. Run=Ctrl+F5. Breakpoint=F9.


Tip 9
Step Into=F11. Step Over=F10. Properties=F4. Toolbox=Ctrl+Alt+X!

Page Life Cycle: PreInit→Init→Load→ControlEvents→PreRender→Render→Unload. Page_Load is


Tip 10
most used. Check IsPostBack in Page_Load to detect first load vs form submit!

All the best for your Wireless PSI / Technical Operator Exam! Prepare smart, revise daily, practice
MCQs regularly. ■

Wireless PSI / TO Exam Prep | Web Technology & [Link] Page 26

You might also like