Microsoft MCSA: Web Applications

MOC 20480C: Programming in HTML5 with JavaScript and CSS3

Module 1: Overview of HTML and CSS

This module reviews the basics of HTML and CSS, and introduces the tools that this course uses to create HTML pages and style sheets.

Lessons

• Overview of HTML
• Overview of CSS
• Creating a Web Application by Using Visual Studio 2017

Lab: Exploring the Contoso Conference Application

• Exploring the Contoso Conference Application
• Examining and Modifying the Contoso Conference Application

After completing this module, students will be able to:

• Explain how to use HTML elements and attributes to lay out a web page.
• Explain how to use CSS to apply basic styling to a web page.
• Describe the tools that Microsoft Visual Studio provides for building web applications.

Module 2: Creating and Styling HTML Pages

This module introduces HTML5, describes its new features, demonstrates how to present content by using the new features in HTML5, and how to style this content by using CSS.

Lessons

• Creating an HTML5 Page
• Styling an HTML5 Page

Lab: Creating and Styling HTML5 Pages

• Creating HTML5 Pages
• Styling HTML pages

After completing this module, students will be able to:

• Describe the purpose of and new features in HTML5, and explain how to use new HTML5 elements to lay out a web page.
• Explain how to use CSS to style the layout, text, and background of a web page.

Module 3: Introduction to JavaScript

This module introduces JavaScript programming and DOM.

Lessons

• Overview of JavaScript
• Introduction to the Document Object Model

Lab: Displaying Data and Handling Events by Using JavaScript.

• Displaying Data Programmatically
• Handling Events

After completing this module, students will be able to:

• Describe basic JavaScript syntax
• Write JavaScript code that uses the DOM to alter and retrieve info from a web page

Module 4: Creating Forms to Collect and Validate User Input

In this module, you will learn how to define input forms by using the new input types available in HTML5. You will also see how to validate data by using HTML5 attributes. Finally, you will learn how to perform extended input validation by using JavaScript code, and how to provide feedback to users when their input is not valid or does not match the application’s expectations.

Lessons

• Creating HTML5 Forms
• Validating User Input by Using HTML5 Attributes
• Validating User Input by Using JavaScript

Lab: Creating a Form and Validating User Input

• Creating a Form and Validating User Input by Using HTML5 Attributes
• Validating User Input by Using JavaScript

After completing this module, students will be able to:

• Create input forms by using HTML5
• Use HTML5 form attributes to validate data
• Write JavaScript code to perform validation tasks that cannot easily be implemented by using HTML5 attributes

Module 5: Communicating with a Remote Server

In this module, you will learn how to access a web service by using JavaScript code and to incorporate remote data into your web applications.

Lessons

• Async programming in JavaScript
• Sending and Receiving Data by Using the XMLHttpRequest Object
• Sending and Receiving Data by Using the Fetch API

Lab: Communicating with a Remote Data Source

• Retrieving Data
• Serialising and Transmitting Data
• Refactoring the Code by Using the jQuery ajax Method

After completing this module, students will be able to:

• Handle asynchronous JavaScript tasks using the new async programing technologies
• Send data to a web service and receive data from a web service by using an XMLHttpRequest object
• Send data to a web service and receive data from a web service by using the Fetch API

Module 6: Styling HTML5 by Using CSS3

In this module, you will examine the properties and values defined in several of these modules, the new selectors defined in CSS3, and the use of pseudo-classes and pseudo-elements to refine those selections.

Lessons

• Styling Text by Using CSS3
• Styling Block Elements
• Pseudo-Classes and Pseudo-Elements
• Enhancing Graphical Effects by Using CSS3

Lab: Styling Text and Block Elements by Using CSS3

• Styling the Navigation Bar
• Styling the Register Link
• Styling the About Page

After completing this module, students will be able to:

• Use the new features of CSS3 to style text elements
• Use the new features of CSS3 to style block elements
• Use CSS3 selectors, pseudo-classes, and pseudo-elements to refine the styling of elements
• Enhance pages by using CSS3 graphical effects

Module 7: Creating Objects and Methods by Using JavaScript

This module describes how to write well-structured JavaScript code by using language features such as namespaces, objects, encapsulation, and inheritance. These concepts might seem familiar if you have experience in a language such as Java or C#, but the JavaScript approach is quite different and there are many subtleties that you must understand if you want to write maintainable code.

Lessons

• Writing Well-Structured JavaScript Code
• Creating Custom Objects
• Extending Objects

Lab: Refining Code for Maintainability and Extensibility

• Object Inheritance
• Refactoring JavaScript Code to Use Objects

After this module, students will be able to:

• Write well-structured JavaScript code
• Use JavaScript code to create custom objects
• Implement object-oriented techniques by using JavaScript idioms

Module 8: Creating Interactive Pages by Using HTML5 APIs

This module describes how to create interactive HTML5 web applications that can access the local file system, enable the user to drag-and-drop data onto elements in a web page, play multimedia files, and obtain geolocation information.

Lessons

• Interacting with Files
• Incorporating Multimedia
• Reacting to Browser Location and Context
• Debugging and Profiling a Web Application

Lab: Creating Interactive Pages with HTML5 APIs

• Dragging and Dropping Images
• Incorporating Video
• Using the Geolocation API to Report the User's Current Location

After completing this module, students will be able to:

• Access the local file system, and add drag-and-drop support to web pages.
• Play video and audio files in a web page, without the need for plugins.
• Obtain information about the current location of the user.
• Use the F12 Developer Tools in Microsoft Edge to debug and profile a web application.

Module 9: Adding Offline Support to Web Applications

In this module, you will learn how to use these technologies to create robust web applications that can continue running even when a network connection is unavailable.

Lessons

• Reading and Writing Data Locally
• Adding Offline Support by Using the Application Cache

Lab: Adding Offline Support to Web Applications

• Caching Offline Data by Using the Application Cache API
• Persisting User Data by Using the Local Storage API

After completing this module, students will be able to:

• Save data locally on the user's device, and access this data from a web application
• Configure a web application to support offline operations by using the Application Cache

Module 10: Implementing an Adaptive User Interface

In this module, you will learn how to build a website that adapts the layout and functionality of its pages to the capabilities and form factor of the device on which it is being viewed. You will see how to detect the type of device being used to view a page, and learn strategies for laying out content that effectively targets particular devices.

Lessons

• Supporting Multiple Form Factors
• Creating an Adaptive User Interface

Lab: Implementing an Adaptive User Interface

• Creating a Print-Friendly Style Sheet
• Adapting Page Layout to Fit Different Form Factors

After completing this module, students will be able to:

• Describe the requirements in a website for responding to different form factors
• Create web pages that can adapt their layout to match the form factor of the device on which they are displayed

Module 11: Creating Advanced Graphics

This module describes how to create advanced graphics in HTML5 by using Scalable Vector Graphics (SVG) and the Microsoft Canvas API. You will learn how to use SVG-related elements such as and to display graphical content on a web page. You will also learn how to enable the user to interact with SVG elements through the use of events such as keyboard events and mouse events. The Canvas API is somewhat different than SVG.

Lessons

• Creating Interactive Graphics by Using SVG
• Drawing Graphics by Using the Canvas API

Lab: Creating Advanced Graphics

• Creating an Interactive Venue Map by Using SVG
• Creating a Speaker Badge by Using the Canvas API

After completing this module, students will be able to:

• Use SVG to create interactive graphical content
• Use the Canvas API to generate graphical content programmatically

Module 12: Animating the User Interface

This module describes how to enhance web pages by using CSS animations. You will learn how to apply transitions to property values. Next, you will learn how to apply 2D and 3D transformations to elements. At the end of this module, you will learn how to apply keyframe animations to elements.

Lessons

• Applying CSS Transitions
• Transforming Elements
• Applying CSS Keyframe Animations

Lab: Animating the User Interface

• Applying CSS Transitions
• Applying Keyframe Animations

After completing this module, students will be able to:

• Apply transitions to animate property values to HTML elements
• Apply 2D and 3D transformations to HTML elements
• Apply keyframe animations to HTML elements

Module 13: Implementing Real-time Communication by Using Web Sockets

This module introduces web sockets, describes how they work, and explains how to create a web socket connection that can be used to transmit data in real time between a web page and a web server.

Lessons

• Introduction to Web Sockets
• Using the WebSocket API

Lab: Performing Real-time Communication by Using Web Sockets

• Receiving Messages from a Web Socket
• Sending Messages to a Web Socket
• Handling Different Web Socket Message Types

After completing this module, students will be able to:

• Describe how using web sockets helps to enable real-time communications between a web page and a web server
• Use the Web Sockets API to connect to a web server from a web page, and exchange messages between the web page and the web server

Module 14: Performing Background Processing by Using Web Workers

This module describes how web workers operate and how you can use them in your web applications.

Lessons

• Understanding Web Workers
• Performing Asynchronous Processing by Using Web Workers

Lab: Creating a Web Worker Process

• Improving Responsiveness by Using a Web Worker

After completing this module, students will be able to:

• Explain how web workers can be used to implement multithreading and improve the responsiveness of a web application
• Perform processing by using a web worker, communicate with a web worker, and control a web worker

Module 15: Packaging JavaScript for Production Deployment

Tools such as Node.js, Webpack, and Babel enable the use of new language features along with support for different browsers in order to avoid harming the user experience. In this module we will introduce the theory behind these tools, when we need to used them, and the different options for use.

Lessons

• Understanding Transpilers And Module bundling
• Creating Separate Packages for Cross Browser Support

Lab: Setting Up Webpack Bundle for Production

• Creating and Deploying Packages using WebPack

MOC 20486D: Developing ASP.NET Core MVC Web Applications

Module 1: Exploring ASP.NET Core MVC

This module can help you create and host dynamic, powerful, and extensible web applications. It also allows you to use the latest HTML standard and Front-End frameworks such as Angular, React, and more.

Lessons

• Overview of Microsoft Web Technologies
• Overview of ASP.NET 4.x
• Introduction to ASP.NET Core MVC

Lab: Exploring ASP.NET Core MVC

• Exploring a Razor Pages Application
• Exploring a Web API Application
• Exploring an MVC Application

After completing this module, you’ll be able to:

• Understand the variety of technologies available in the Microsoft web stack
• Describe the different programming models available for developers in ASP.NET
• Choose between ASP.NET Core and ASP.NET 4.x.
• Describe the role of ASP.NET Core MVC in the web technologies stack, and how to use ASP.NET Core MVC to build web applications
• Distinguish between MVC models, MVC controllers, and MVC views

Module 2: Designing ASP.NET Core MVC Web Applications

In this module, you will learn how to create powerful and complex web applications. You need to know how to identify a set of business needs and plan the Model-View-Controller (MVC) web application to meet those needs. The project plan that you create assures stakeholders that you understand their requirements and communicates the functionality of the web application, its user interface, structure, and data storage to the developers.

Lessons

• Planning in the Project Design Phase
• Designing Models, Controllers and Views

Lab: Designing ASP.NET Core MVC Web Applications

• Planning Model Classes
• Planning Controllers
• Planning Views
• Architecting and MVC Web Application

After completing this module, you’ll be able to:

• Plan the overall architecture of an ASP.NET Core MVC web application and consider aspects such as state management
• Plan the models, controllers, and views that are required to implement a given set of functional requirements

Module 3: Configure Middlewares and Services in ASP.NET Core

In this module, you will learn how to leverage the ASP.NET Core framework to handle requests and responses via existing and custom middleware. You will also learn how to configure services for use in middleware and throughout other parts of the application, such as controllers.

Lessons

• Configuring Middlewares
• Configuring Services

Lab: Configuring Middleware and Services in ASP.NET Core

• Working with Static Files
• Creating custom middleware
• Using dependency injection
• Injecting a service to a controller

After completing this module, you'll be able to:

• Use existing middleware to set up an ASP.NET Core application
• Create your own middleware and use it to define custom behaviour
• Understand the basic principles behind Dependency Injection, and how it is used in ASP.NET Core
• Know how to create a custom service, configure its scope, and inject it to both middleware and ASP.NET Core MVC controllers

Module 4: Developing Controllers

In this module, you’ll be introduced to building web applications by using the Model-View-Controller (MVC) architectural pattern.

Lessons

• Writing Controllers and Actions
• Configuring Routes
• Writing Action Filters

Lab: Developing Controllers

• Adding controllers and actions to an MVC application
• Configuring routes by using the routing table
• Configuring routes using attributes
• Adding an action filer

After completing this module, you’ll be able to:

• Add a controller to a web application that responds to user actions that are specified in the project design
• Add routes to the ASP.NET Core routing engine and ensure that URLs are user-friendly in an MVC web application
• Write code in action filters that runs before or after a controller action

Module 5: Developing Views

In this module you’ll learn how to define the user interface for your web application by creating views.

Lessons

• Creating Views with Razor Syntax
• Using HTML Helpers and Tag Helpers
• Reusing Code in Views

Lab: Developing Views

• Adding Views to an MVC Application
• Adding a partial view
• Adding a view component

After completing this module, you'll be able to:

• Create an MVC view and add Razor mark-up to it to display data to users
• Use HTML helpers and tag helpers in a view
• Reuse Razor mark-up in multiple locations throughout an application

Module 6: Developing Models

In this module, you will learn how to create the code for models. The model class describes the properties of each type of object and can include business logic that matches business processes. Therefore, the model is a fundamental building-block in an MVC application.

Lessons

• Creating MVC Models
• Working with Forms
• Validate MVC Application

Lab: Developing Models

• Adding a model
• Working with Forms
• Add Validation

After completing this module, you’ll be able to:

• Add a model to an MVC application and write code in it to implement the business logic
• Use display and edit data annotations
• Validate user input with data annotations

Module 7: Using Entity Framework Core in ASP.NET Core

The objective of this module is to teach you how to render webpages that use data from a data store, so you can create a web application that changes continually in response to user input, administrative actions, and publishing events. You will see how to build a database-driven website in MVC.

Lessons

• Introduction to Entity Framework Core
• Working with Entity Framework Core
• Use Entity Framework Core to connect to Microsoft SQL Server

Lab: Using Entity Framework Core in ASP.NET Core

• Adding Entity Framework Core
• Use Entity Framework Core to retrieve and store data
• Use Entity Framework Core to connect to Microsoft SQL Server

After completing this module, you’ll be able to:

• Connect an application to a database to access and store data
• Explain EF Core
• Work with Entity Framework Core
• Use EF Core to connect to a database including Microsoft SQL Server

Module 8: Using Layouts, CSS and JavaScript in ASP.NET Core MVC

In this module, you will learn the importance of presentation and functionality of your web application, and explore JavaScript.

Lessons

• Using Layouts
• Using CSS and JavaScript
• Using jQuery

Lab: Using Layouts, CSS and JavaScript in ASP.NET Core

• Applying a layout and link views to it
• Using CSS
• Using JavaScript
• Using jQuery

After completing this module, you’ll be able to:

• Apply a consistent layout to ASP.NET Core MVC applications
• Add JavaScript code to your web application
• Use the jQuery library in your web application

Module 9: Client-Side Development

In this module, you'll learn client-side tools that will allow you to create extensive web applications on any scale. You'll also learn how to use the Bootstrap framework to style your web application, and then how to use Sass and Less.

Lessons

• Applying Styles
• Using Task Runners
• Responsive design

Lab: Client-Side Development

• Use gulp to run tasks
• Styling using Sass
• Using Bootstrap

After completing this module, you’ll be able to:

• Use Bootstrap, Sass and Less in a Microsoft ASP.NET Core application
• Use task runners in an ASP.NET Core application
• Ensure that a web application displays correctly on devices with different screen sizes

Module 10: Testing and Troubleshooting

In this module, you’ll examine how your one web application requires multiple complex components, and because they are often written by different developers, there are always possibilities for inaccuracies. You'll learn how to identify bugs from all sources and how to eliminate them.

Lessons

• Testing MVC Applications
• Implementing an Exception Handling Strategy
• Logging MVC Applications

Lab: Testing and troubleshooting

• Testing a Model
• Testing a controller using a fake repository
• Implementing a repository in MVC project
• Add exception handling
• Add logging

After completing this course, you’ll be able to:

• Run unit tests against the Model–View–Controller (MVC) components, such as model classes and controllers, and locate potential bugs
• Build a Microsoft ASP.NET Core MVC application that handles exceptions smoothly and robustly
• Run logging providers that benefit your applications and run them by using a common logging API

Module 11: Managing Security

In this module, you’ll be learning how to manage security via making decisions on which users can perform, which need protection, and making sure your application is safe from malicious third parties with possible access.

Lessons

• Authentication in ASP.NET Core
• Authorization in ASP.NET Core
• Defending from Attacks

Lab: Managing Security

• Use Identity
• Add Authorization
• Avoid the Cross-Site Request Forgery Attack

After completing this module, you’ll be able to:

• Add basic authentication to your application
• Configure Microsoft ASP.NET Core Identity
• Add basic authorization to your application
• Utilize several different authorization approaches
• Know how security exploits work and how to better defend against them

Module 12: Performance and Communication

In this module, you’ll learn the practice of ‘caching’; which allows you to store commonly repeated requests. You can also reuse data that has already been loaded and present it to the user.

Lessons

• Implementing a Caching Strategy
• Managing State
• Two-way communication

Lab: Performance and Communication

• Implementing a Caching Strategy
• Managing state
• Two-Way communication

After completing this module, you’ll be able to:

• Implement caching in a Microsoft ASP.NET Core application
• Use state management technologies to improve the client experience, by providing a consistent experience for the user
• Implement two-way communication by using SignalR, allowing the server to notify the client when important events occur

Module 13: Implementing Web APIs

In this module, you will examine how most web applications require integration with external systems. Through using Web APIs, you’ll have the ability to promote application interaction with external systems to using server-side code and jQuery code to effectively implement REST-style Web APIs in your application.

Lessons

• Introducing Web APIs
• Developing a Web API
• Calling a Web API

Lab: Implementing Web APIs

• Adding Actions and Call Them Using Microsoft Edge
• Calling a Web API using server-side code
• Calling a Web API using jQuery

After completing this module, you’ll be able to:

• Create services by using ASP.NET Core Web API
• Call a Web API from server-side code and jQuery

Module 14: Hosting and Deployment

In this module, you’ll learn how to provide a service to multiple users simultaneously while only requiring the server to be installed, and for the clients to use browsers to access it. You will create highly desirable applications which do not rely on the user installing dedicated software, and ensuring it is accessible by clients on a wide variety of machines.

Lessons

• On-premise hosting and deployment
• Deployment to Microsoft Azure
• Microsoft Azure Fundamentals

Lab: Hosting and Deployment

• Deploying a Web Application to Microsoft Azure
• Upload an Image to Azure Blob Storage

After completing this module, you’ll be able to:

• Host and Deploy an ASP.NET Core MVC application on IIS
• Host and Deploy an ASP.NET Core MVC application on Microsoft Azure
• Be able to utilize services offered by Microsoft Azure to improve the capabilities of your web applications

Se Exam Track...