WEEK 1

What is Active Server Pages (ASP)?

● ASP is a server-side scripting language created by Microsoft.

● ASP is based on the scripting language VBScript.
● The first version of ASP was released in 1996.

Concepts:

●
● Server-side scripting: A type of scripting technology where scripts are executed on the server before the web
page is sent to the user.
● Dynamic web page: A web page that can change its content depending on the user's input or other variables.

What is ASP.NET?

● ASP.Net is a web development framework developed by Microsoft.

● It's used to create dynamic websites and web apps.
● It is a web framework that is a part of. NET allows building dynamic web applications.ASP.NET extends the .NET
developer platform with tools and libraries specifically for building web apps.
● It is cross-platform and runs on Windows, Linux, macOS, and Docker.
● ASP.Net was first released in 2002.

Understanding the .NET Framework

● Powerful platform for creating Windows applications

● .NET is a developer platform made up of tools, programming languages, and libraries for building many different
types of applications.
● Developers can create both web and mobile applications
● Supports multiple languages and libraries
● The .NET Framework is used to create applications for Windows, iOS, Android, and Mac OS.
● Microsoft released its first version of the .NET Framework in 2002.

Concepts:

→ CLR: Common Language Runtime is the virtual machine component of the .NET Framework that manages the
execution of code written in different languages.

→ C#: C# is an object-oriented programming language derived from C and C++ that was developed by Microsoft.

→ .NET Core: .NET Core is a cross-platform, open-source, and modular .NET platform for creating modern web
apps, microservices, libraries, and console applications.

→ Dynamic Websites: Websites with content that is generated in response to user actions.

Object-oriented programming (OOP)

Object-oriented programming (OOP) is a programming paradigm based on the concept of "objects", which can contain
data and code. The data is in the form of fields (often known as attributes or properties), and the code is in the form of
procedures (often known as methods).
 ● Object-oriented programming (OOP) is a programming language model organized around objects rather than
actions and data rather than logic.
● In OOP, objects interact with one another to carry out tasks. This contrasts with procedural programming, which
consists of a series of commands and instructions to complete a task.
● OOP uses classes, objects, inheritance, abstraction, polymorphism, and encapsulation to create programs.

An Introduction to Visual Studio

● Visual Studio is an integrated development environment (IDE) created by Microsoft

● It offers a complete set of development tools for building applications
● Visual Studio supports many different languages and platforms

Concepts:

→ Integrated Development Environment (IDE): A software application that provides comprehensive facilities to
computer programmers for software development.

→ Development Tools: Software programs used to create, debug, maintain, and document the source code of
applications, websites, and other software.

→ Programming Languages: A set of instructions that can be used to produce different types of output or to
control the operation of a computer or other device.

→ Visual Studio is the most popular IDE for developing in .NET

→ The first version of Visual Studio was released in 1997

→ Visual Studio Code is a lightweight version of Visual Studio designed for web development

Installing Visual Studio Express 2013 for Web

 1. Start by browsing www. Microsoft t. com/ express/ and follow the instructions to download VSEW 2013. You can
install directly by choosing the Download and then the Install Now link or you can download an ISO file that you
can burn on a DVD or mount on Windows as a virtual drive. Make sure you download Visual Studio Express 2013
for the Web, and not one of the other free Express editions or older versions. If this link is ever changed or no
longer provides direct access to the VSEW download, search the web for “install Visual Studio Express 2013 for
Web” and you’ll be taken to a download page where you can start the installation.
2. When the download completes, start the installer. You should see a screen similar to Figure 1-1.
Check the checkbox for the license terms and privacy policy.
If you’re installing the full version of Visual Studio, click the Next button that appeared when you agreed to the
license terms. You see a screen similar to Figure 1-2. Make sure you select at least the Microsoft Web Developer
Tools option.
3. In both cases, click the Install button to start the installation process.
4. After a while, you should see a message indicating that Visual Studio has been installed successfully. The installer
may need to reboot your machine during or after the installation. Once the installer has finished, Visual Studio is
ready for use.

A TOUR OF THE IDE

Visual Studio is by far the most complete and feature-packed integrated development environment [IDE] for making
ASP.NET web pages. The term "IDE" stands for "Integrated Development Environment." It means that all of the tools you
need to build complex web applications are put together in a single environment. Instead of writing code in a text editor,
compiling code at the command line, writing HTML and CSS in a separate program, and managing your database in yet
another, VS lets you do all of these things and more from the same environment. This makes it easier to learn new parts
of VS because many of the built-in tools work the same way. It also saves time because you don't have to switch tools all
the time.

The Main Development Area

Take a look at Figure 1-9 to learn more about the many tools that come with VS. It shows the same screen you saw after
making your first website in VS, but now the most important parts of the screen are highlighted. If you know how to use
an older version of Visual Studio, you can skip this section and pick up where you left off with the next Try It Out exercise
later in this chapter.
If you have a previous version of Visual Studio installed, your screen may look different because Visual Studio 2013 is
able to import settings from older versions.

Choosing Your Development Profile

VSEW is for both people who are new to ASP.NET development and people who have been doing it for a long time.
Because of this, it has different developer profiles, such as "Basic Settings," "Code Only," and "Expert Settings." In Basic
Settings mode, many menu items you don't use often are hidden or put in their own submenu. The Code Only profile is
great for times when you just want to code and don't care about things like Design View or the Toolbox. You can use all
of VSEW's features when you're in Expert Settings mode. Use the Tools > Settings menu to switch between settings. This
book assumes that you will start out in Expert Settings mode. You might not need all the features you see right away,
but by the end of the book, you will have used most of them. Because the location of menu items changes depending on
which profile you choose, I decided to use Expert Settings mode right away to make it easier to find a specific menu item
or feature. In the paid versions of Visual Studio, you don't have this option because Expert Settings are already turned
on.

● The Main Menu

The main menu is at the top of the application, right below the Windows title bar. This menu bar has things like the
File, Edit, and Help menus found in many other Windows programs. It also has menus that are unique to VS, like
the Website and Debug menus. The menu changes based on the task you're working on, so as you move through
the application, you'll see menu items appear and disappear. You can set up both online and offline help using the
Help Set Help Preference menu. Before you can use offline help, you have to install it and be connected to the
Internet to use online help. On the far right, you'll see a link that says "Sign in." This lets you sign in with your
Microsoft account and allow VS settings to be shared between machines.

● The Notification Window

The application's title bar has a small flag icon to the left of the Windows Close, Minimize, and Maximize buttons.
When you click on the flag icon, the notification window appears. This is where Visual Studio tells you important
things. It will show things like new documentation content, licenses that have expired, product updates, and more
that can be downloaded. The color of the flag icon in the title bar changes depending on how important the
notifications are. You can also get to the Notifications window from the View menu. If you installed the RTM
version of Visual Studio, you may see a few updates that you can safely install now.

● The Toolbar Area

The toolbar area is right below the menu. It can show different toolbars that give you quick access to VS's most-
used features. In Figure 1-9, only two of the toolbars are turned on, but Visual Studio comes with a lot of other
toolbars that you can use for different tasks. Some toolbars show up automatically when you're working on a task
that needs a certain toolbar, but you can also turn toolbars on and off as you like. To turn on or off a toolbar, right-
click an existing toolbar or the menu bar and choose the toolbar from the menu that appears.

● The Toolbox
The toolbox tab is on the left side of the main screen, near the edge of VS. If you click on the tab, the Toolbox opens
up and shows you what it has. If you click the little pin icon in the upper-right corner of the Toolbox (or any of the
other panels that have this pin icon), it gets pinned to the IDE so it stays open.

Just like the menu bar and toolbars, the Toolbox automatically updates to show content that is relevant to the task
you are working on. When you edit a standard ASPX page, the Toolbox shows you all of the controls you can use on
that page. You can just drag an item from the Toolbox and drop it where you want it to show up on your page. In
Chapter 4, a lot more is said about these controls. Note that there is also a pointer icon in each Toolbox category.
But this isn't controlled by itself. In other Visual Studio designers, like Win Forms, this icon is used to get out of
drawing mode. In ASP.NET, however, it isn't very useful. The Toolbox has several categories that you can expand or
collapse to make it easier to find the tool you need. You can also change the order of the items in the list, add and
remove items from the Toolbox, and even add your own tools to it. We will talk about customizing the IDE later in
this chapter.

If the Toolbox isn't showing up on the screen, you can open it by pressing Ctrl+Alt+X or by going to View > Toolbox
if you have Expert Settings selected in the Tools > Settings menu.

● The Solution Explorer

The Solution Explorer is on the right side of the screen. The Solution Explorer is an important window because it
gives you an overview of all the files that make up your website. With Solution Explorer, you can store your files in
separate folders instead of putting them all in one big folder. This makes your site's structure more logical and
organized. You can use Solution Explorer to add new files to your site, move existing files around by dragging and
dropping or cutting and pasting, rename files and delete them from the project, and do other things. A lot of
Solution Explorer's features are hidden in the right-click menu, which changes depending on what you right-click
on.

At the top of the Solution Explorer is a small toolbar that gives you quick access to some functions related to your
website. For example, you can quickly refresh the Solution Explorer window, nest related files, or set up your
website by clicking on one of these buttons. Most of these features will be talked about later in the book.

You can get to the Solution Explorer by choosing View > Solution Explorer from the main menu or by pressing
Ctrl+Alt+L.

● The Server Explorer

This window lets you work with your databases and other services. In Figure 1-9, it is hidden behind the Solution
Explorer.

You can get to the Server Explorer by choosing View > Server Explorer or by pressing Ctrl+Alt+S.

The chapters about databases go into more depth about the Server Explorer.

● The Team Explorer

This window, hidden behind the Solution Explorer in Figure 1-9, is used to connect to and work with Microsoft's
Application Lifecycle Management tool Team Foundation Server (TFS), which is used for source control, tracking
work items, and more. Check out http://tfs.visualstudio.com for more information and to sign up for a free hosted
account for TFS. Team Explorer and TFS are not talked about in this book.

● The Properties Grid

 With the Properties Grid, you can see and change the properties of many things in Visual Studio, such as files in the
Solution Explorer, controls on a web page, the properties of the page itself, and much more. The window is always
updated to show the item that was chosen. By pressing F4, you can quickly open the Properties Grid. You can use
this same keyboard shortcut to force the Properties Grid to show the details of a selected item.

● The Document Window

The Document Window dominates the application. The action is mostly here. The Document Window lets you edit
ASPX, HTML, CSS, JavaScript, VB, C#, XML, text, and picture files. The same window lets you manage databases,
generate duplicates of your site, examine its pages in the built-in mini-browser, and more.

By default, the Document Window can host many documents, each with a tab containing the filename at the top.
Each tab's right-click menu has shortcuts for saving, closing, and opening File Explorer's parent folder.

To switch documents, use Ctrl+Tab, click the tab, or click the down arrow in the upper-right corner of the
Document Window, adjacent to the Solution Explorer (Figure 1-9). The down arrow displays a list of open
documents for easy selection.

Ctrl+Tab + Ctrl is another technique to swap documents. The right-hand column of the pop-up window lets you
choose a document. Use the cursor keys to scroll through the open document list. This simplifies file selection.

The dialog box lists all active tool windows. Clicking a window in the list displays it on-screen, moving it if necessary.

Click a file in Solution Explorer to preview it without modifying it. A file in preview mode has its tab docked to the
right of the tab row, unlike open files, which are docked to the left.

Figure 1-9 shows Design, Split, and Source buttons underneath the Document Window. Markup files like ASPX
pages automatically display these buttons. They let you view a page's Design View, Markup View, or both at once.
For now, know that you can move between Markup, Split, and Design View by clicking one of the three buttons.
Chapter 2 explains how this works. Markup View is often called Source View or Code View. This book utilizes
Markup View exclusively to avoid confusion with the Code Behind code editor.

● The Start Page

The Document Window loads the Start Page when VS starts. Start iPage lets you easily develop and open websites
and other projects. The Start Page links to web development news and resources. Click the pin symbol to the left of
your favorite projects in the recent projects list to pin them to the Start Page. Right-click a project to unpin it. View
O Start Page reopens the Start Page.

WEEK 2
CREATING WEBSITES WITH VISUAL STUDIO

The preceding chapter gave you a quick overview of creating a website in VS. You simply chose New Web Site from the
File menu, selected a language, selected the standard ASP.NET Web Forms Site template, and clicked OK. However,
there’s more to the New Web Site dialog box than you saw in the previous chapter. You may have noticed that you can
choose among a number of different templates that enable you to create different kinds of sites. But before looking at
the different templates on which you can base your new website, you need to know a little more about the different
project types that are available in Visual Studio.
Websites and web applications

ASP.NET offers three web application development frameworks: Web Forms, ASP.NET MVC, and ASP.NET Web Pages.
You can construct excellent web applications with any of the three frameworks because they are all mature and robust.
No matter which framework you choose, you will always have access to the benefits and functionality of ASP.NET.

Each framework targets a unique development methodology. The one you choose depends on a combination of your
programming assets (knowledge, abilities, and development experience), the type of application you're producing, and
the development style you're comfortable with.

Following is a summary of each framework, as well as some guidance on how to pick amongst them. See Building
Websites with ASP.NET and What is Web Tools for video introductions.

Framework If you have experience in Development style Expertise

Web Forms Win Forms, WPF, .NET Rapid development using a rich library Mid-Level,
of controls that encapsulate HTML Advanced RAD
markup

MVC Ruby on Rails, .NET Full control over HTML markup, code Mid-Level,
and markup separated, and easy to Advanced
write tests. The best choice for mobile
and single-page applications (SPA).

Web Pages Classic ASP, PHP HTML markup and your code together New, Mid-
in the same file Level

learn.microsoft.com

Web Forms

With ASP.NET Web Forms, you can use a familiar drag-and-drop, event-driven model to build dynamic websites. With a
design surface and hundreds of controls and components, you can quickly make sophisticated, powerful sites with data
access that are driven by the user interface.

MVC
ASP.NET MVC gives you a powerful, pattern-based way to build dynamic websites that makes it easy to separate
concerns and gives you full control over markup for fun, agile development. ASP.NET MVC has many features that make
it easy to create sophisticated applications that use the latest web standards quickly and with TDD.

ASP.NET Web Pages

ASP.NET Web Pages and the Razor syntax make it easy to combine server code and HTML to make dynamic web content
in a way that is quick and light. You can link to social networking sites, add video, connect to databases, and do a lot
more to make beautiful sites that meet the latest web standards.

Web APIs

ASP.NET Web API is a framework that makes it easy to build HTTP services that can be used by a wide range of clients,
such as browsers and mobile devices. On the.NET Framework, ASP.NET Web API is the best way to build RESTful
applications.

Notes about Web Forms, MVC, and Web Pages

All three ASP.NET frameworks are built on the.NET Framework and have many of the same core features of both.NET
and ASP.NET. For example, all three frameworks offer a login security model based on membership, and they all share
the same core ASP.NET facilities for managing requests, handling sessions, and so on.

Also, the three frameworks are not completely separate, and using one does not mean you can't use the others. Since
different frameworks can be used in the same web application, it's not unusual for different frameworks to be used to
make different parts of an application. For example, the parts of an app that the customer sees might be built with MVC
to improve the markup, while the parts that deal with data access and administration might be built with Web Forms to
make use of data controls and easy data access.

Open the "Create a new project" dialog

In Visual Studio, there are many ways to start a new project. When you open Visual Studio for the first time, you see the
start window. From there, you can choose Create a new project.
If Visual Studio's development environment is already open, choose File > New > Project from the menu bar to start a
new project. You can also press Ctrl+Shift+N.

or click the New Project button on the toolbar.

Select a template type

If you're not using the recently used templates, you can sort all of the available project templates by Language (like C#
or C++), Platform (like Windows or Azure), and Project type (for example, Desktop or Web). You can also type words like
"ASP.Net" into the search box to narrow down the templates even more.

Tip

If you don't see the template you're looking for, you might be missing a workload for Visual Studio. To install additional
workloads, for example, Azure Development or Mobile Development with .NET, select the Install more tools and
features link to open Visual Studio Installer. From there, select the workloads you want to install, and then select
Modify. After that, additional project templates will be available to choose from.
Select a template and then select Next.

WEEK 3
Paste here the content of the lesson.

1. Make sure the contents are properly arranged.

2. Ensure that videos can be played.
3. Images are always centered.

WEEK 4