Skip to content

Commit 3911186

Browse files
committed
date fix
1 parent 1add2b9 commit 3911186

16 files changed

Lines changed: 466 additions & 0 deletions
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
### YamlMime:ModuleUnit
2+
uid: learn.wwl.guided-project-deploy-static-website-blob-storage.introduction
3+
title: Introduction
4+
metadata:
5+
title: Introduction
6+
description: "Introduction"
7+
ms.date: 03/25/2026
8+
author: wwlpublish
9+
ms.author: robbarefoot
10+
ms.topic: unit
11+
ms.custom:
12+
- N/A
13+
durationInMinutes: 2
14+
content: |
15+
[!include[](includes/1-introduction.md)]
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
### YamlMime:ModuleUnit
2+
uid: learn.wwl.guided-project-deploy-static-website-blob-storage.exercise-create-storage-enable-hosting
3+
title: Exercise - Create storage account and enable hosting
4+
metadata:
5+
title: Exercise - Create storage account and enable hosting
6+
description: "Exercise - Create storage account and enable hosting"
7+
ms.date: 03/25/2026
8+
author: wwlpublish
9+
ms.author: robbarefoot
10+
ms.topic: unit
11+
ms.custom:
12+
- N/A
13+
durationInMinutes: 7
14+
content: |
15+
[!include[](includes/2-exercise-create-storage-enable-hosting.md)]
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
### YamlMime:ModuleUnit
2+
uid: learn.wwl.guided-project-deploy-static-website-blob-storage.exercise-upload-verify-content
3+
title: Exercise - Upload and verify site content
4+
metadata:
5+
title: Exercise - Upload and verify site content
6+
description: "Exercise - Upload and verify site content"
7+
ms.date: 03/25/2026
8+
author: wwlpublish
9+
ms.author: robbarefoot
10+
ms.topic: unit
11+
ms.custom:
12+
- N/A
13+
durationInMinutes: 7
14+
content: |
15+
[!include[](includes/3-exercise-upload-verify-content.md)]
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
### YamlMime:ModuleUnit
2+
uid: learn.wwl.guided-project-deploy-static-website-blob-storage.exercise-update-site-content
3+
title: Exercise - Update the site content
4+
metadata:
5+
title: Exercise - Update the site content
6+
description: "Exercise - Update the site content"
7+
ms.date: 03/25/2026
8+
author: wwlpublish
9+
ms.author: robbarefoot
10+
ms.topic: unit
11+
ms.custom:
12+
- N/A
13+
durationInMinutes: 6
14+
content: |
15+
[!include[](includes/4-exercise-update-site-content.md)]
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
### YamlMime:ModuleUnit
2+
uid: learn.wwl.guided-project-deploy-static-website-blob-storage.validate-success
3+
title: Validate success
4+
metadata:
5+
title: Validate success
6+
description: "Validate success"
7+
ms.date: 03/25/2026
8+
author: wwlpublish
9+
ms.author: robbarefoot
10+
ms.topic: unit
11+
ms.custom:
12+
- N/A
13+
durationInMinutes: 10
14+
content: |
15+
[!include[](includes/5-validate-success.md)]
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
### YamlMime:ModuleUnit
2+
uid: learn.wwl.guided-project-deploy-static-website-blob-storage.clean-up-resources
3+
title: Clean up resources
4+
metadata:
5+
title: Clean up resources
6+
description: "Clean up resources"
7+
ms.date: 03/25/2026
8+
author: wwlpublish
9+
ms.author: robbarefoot
10+
ms.topic: unit
11+
ms.custom:
12+
- N/A
13+
durationInMinutes: 5
14+
content: |
15+
[!include[](includes/6-clean-up-resources.md)]
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
### YamlMime:ModuleUnit
2+
uid: learn.wwl.guided-project-deploy-static-website-blob-storage.summary
3+
title: Summary
4+
metadata:
5+
title: Summary
6+
description: "Summary"
7+
ms.date: 03/25/2026
8+
author: wwlpublish
9+
ms.author: robbarefoot
10+
ms.topic: unit
11+
ms.custom:
12+
- N/A
13+
durationInMinutes: 2
14+
content: |
15+
[!include[](includes/7-summary.md)]
Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
This guided project focuses on deploying a static website using Azure Blob Storage.
2+
3+
Azure Blob Storage can serve HTML, CSS, and image files directly to browsers without a web server. When you enable the static website hosting feature on a storage account, Azure creates a public endpoint and a special container where you upload your site files.
4+
5+
## Scenario
6+
7+
Your marketing team needs to publish a product landing page quickly without provisioning virtual machines or web servers. The team wants to upload content, verify it's live, push an update, and confirm the change — all through the Azure portal.
8+
9+
- Exercise 1 - Create a storage account and enable static website hosting.
10+
- Exercise 2 - Upload HTML content and verify the live site.
11+
- Exercise 3 - Update the site content and confirm the change.
12+
13+
:::image type="content" source="../media/overview-architecture.png" alt-text="Diagram showing a static website on Azure Blob Storage with storage account, $web container, and public endpoint." border="false":::
14+
15+
By the end of this project, you have a working public website hosted entirely from blob storage, and you understand how to publish and update content with minimal cost.
16+
17+
> [!NOTE]
18+
> This is a guided project module where you complete a project by following step-by-step instructions.
19+
20+
## Skilling areas
21+
22+
In this project, you practice skills in the following areas:
23+
24+
**Create and configure a storage account**
25+
+ Create a resource group and storage account.
26+
+ Enable static website hosting and configure index and error documents.
27+
+ Locate the primary endpoint URL.
28+
29+
**Upload and manage blob content**
30+
+ Upload HTML files to the $web container.
31+
+ Overwrite existing blobs to publish content updates.
32+
+ Review blob properties including access tier and content type.
33+
34+
**Verify a public endpoint**
35+
+ Browse to the static website endpoint and confirm content.
36+
+ Test a custom 404 error page.
37+
+ Verify that content updates appear immediately.
38+
39+
> [!IMPORTANT]
40+
> This project uses the Azure portal for every step. No prior Azure experience is required.
Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
This guided project consists of the following exercises:
2+
3+
- **Create storage account and enable hosting**
4+
- Upload and verify site content
5+
- Update the site content
6+
7+
In this exercise, you create a resource group, set up a storage account, and turn on the static website hosting feature. By the end, you have a public URL ready to serve web content — even though you haven't uploaded any files yet.
8+
9+
This exercise includes the following tasks:
10+
11+
- Prepare the environment
12+
- Create the storage account
13+
- Enable static website hosting
14+
15+
**Outcome:** A storage account with static website hosting enabled and a public endpoint ready to serve content.
16+
17+
> [!TIP]
18+
> Pause after each major action and confirm the page status before moving on. This habit prevents compounding mistakes.
19+
20+
## Task 1: Prepare the environment
21+
22+
Set up your Azure environment before you begin. You create a resource group to organize all the resources for this project together, which makes cleanup easier when you finish.
23+
24+
> [!WARNING]
25+
> This project creates Azure resources that may incur charges. Complete the clean-up unit when you're done to avoid unintended expenses.
26+
27+
1. Sign in to the [Azure portal](https://portal.azure.com) with an account that has permissions to create storage resources.
28+
2. In the portal search bar, search for **Resource groups** and select **Resource groups**.
29+
3. Select **+ Create**. Name the resource group **rg-gp-static-website**, choose your preferred region, and select **Review + create** then **Create**.
30+
31+
## Task 2: Create the storage account
32+
33+
Create a general-purpose storage account that will host your website files. Azure Blob Storage can serve static HTML, CSS, and image files directly to browsers without requiring a web server.
34+
35+
1. In the portal search bar, search for **Storage accounts** and select **Storage accounts**.
36+
2. Select **+ Create**.
37+
3. On the Basics tab, select **rg-gp-static-website** as the resource group.
38+
4. For **Storage account name**, enter a globally unique name (for example, **stgpstaticsite** followed by your initials and a number). Storage account names must be 3-24 characters, lowercase letters and numbers only.
39+
5. For **Region**, choose the same region as the resource group.
40+
6. For **Preferred Storage Type**, select **Azure Blob Storage or Azure Data Lake Storage Gen 2**.
41+
7. For **Performance**, select **Standard**.
42+
8. For **Redundancy**, select **Locally-redundant storage (LRS)**.
43+
9. Select **Review + create** and then select **Create**.
44+
10. When deployment finishes, select **Go to resource**.
45+
46+
## Task 3: Enable static website hosting
47+
48+
Turn on the built-in static website feature. This creates a special container named **$web** where you upload your site files, and provides a public URL that serves those files to visitors.
49+
50+
1. In the storage account left menu, under **Data management**, select **Static website**.
51+
2. Set Static website to **Enabled**.
52+
3. For **Index document name**, enter **index.html**.
53+
4. For **Error document path**, enter **404.html**.
54+
5. Select **Save**.
55+
6. Note the **Primary endpoint** URL that appears after saving. This is the public URL for your website.
56+
57+
> [!NOTE]
58+
> **Validation step:** Confirm that static website hosting shows **Enabled**, and that a Primary endpoint URL is displayed.
59+
60+
> [!NOTE]
61+
> Each exercise includes validation steps like this one. Track your results as you go — you'll review them all in the validation unit at the end of this module.
62+
63+
> [!NOTE]
Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
This guided project consists of the following exercises:
2+
3+
- Create storage account and enable hosting
4+
- **Upload and verify site content**
5+
- Update the site content
6+
7+
In this exercise, you create an HTML page and a custom error page, upload both to the $web container, and visit your live site to confirm everything works. This is where your static website goes from an empty endpoint to a real page that anyone can visit.
8+
9+
This exercise includes the following tasks:
10+
11+
- Create the HTML file locally
12+
- Upload the file to the $web container
13+
- Create and upload a custom error page
14+
- Verify the live site and error page
15+
16+
**Outcome:** A live public website displaying your Version 1 content.
17+
18+
## Task 1: Create the HTML file locally
19+
20+
Create a simple HTML file on your computer that will serve as the initial version of your website. This file represents the content your team wants to publish.
21+
22+
1. On your local computer, open a text editor (such as Notepad).
23+
2. Paste the following content:
24+
25+
```html
26+
<!DOCTYPE html>
27+
<html>
28+
<head><title>Product Landing Page</title></head>
29+
<body>
30+
<h1>Version 1 - Landing Page</h1>
31+
<p>Welcome to our product page. This is the initial published version.</p>
32+
</body>
33+
</html>
34+
```
35+
36+
3. Save the file as **index.html**.
37+
38+
## Task 2: Upload the file to the $web container
39+
40+
Upload your HTML file to the special **$web** container that Azure created when you enabled static website hosting. Files in this container are automatically served to visitors who browse to your site endpoint.
41+
42+
1. In the Azure portal, return to your storage account.
43+
2. In the left menu, under **Data storage**, select **Containers**.
44+
3. Select the **$web** container.
45+
4. Select **Upload**.
46+
5. Select **Browse for files**, select the **index.html** file you created, and upload it.
47+
6. Confirm that **index.html** appears in the container file list.
48+
49+
## Task 3: Create and upload a custom error page
50+
51+
Create a custom 404 error page that visitors see when they browse to a page that doesn't exist. Without this file, visitors get a generic XML error, which looks unprofessional.
52+
53+
1. On your local computer, open a text editor.
54+
2. Paste the following content:
55+
56+
```html
57+
<!DOCTYPE html>
58+
<html>
59+
<head><title>Page Not Found</title></head>
60+
<body>
61+
<h1>404 - Page Not Found</h1>
62+
<p>The page you requested does not exist. Return to the <a href="/">home page</a>.</p>
63+
</body>
64+
</html>
65+
```
66+
67+
3. Save the file as **404.html**.
68+
4. In the Azure portal, return to the **$web** container.
69+
5. Select **Upload**, select **Browse for files**, select the **404.html** file, and upload it.
70+
6. Confirm that both **index.html** and **404.html** appear in the container.
71+
72+
> [!NOTE]
73+
> **Validation step:** The **$web** container should list both **index.html** and **404.html**.
74+
75+
## Task 4: Verify the live site and error page
76+
77+
Open the public endpoint in a browser to confirm your website is live, and then test the custom error page. This validates that static website hosting is correctly configured for both normal pages and missing pages.
78+
79+
1. In the Azure portal, navigate back to your storage account (use the portal search bar to search for **Storage accounts** and select your account if needed).
80+
2. In the left menu, under **Data management**, select **Static website**.
81+
3. Select the **Primary endpoint** link to open the site in a new browser tab.
82+
3. Confirm the page displays **Version 1 - Landing Page** and the welcome message.
83+
4. In the browser address bar, add **/fakepage** to the end of the URL and press Enter.
84+
5. Confirm the custom 404 page appears with the **Page Not Found** heading and a link back to the home page.
85+
6. Select the **home page** link and confirm it returns to the Version 1 landing page.
86+
87+
> [!NOTE]
88+
> **Validation step:** The landing page displays **Version 1 - Landing Page**, and browsing to a nonexistent path shows your custom **404 - Page Not Found** page.
89+
90+
> [!NOTE]

0 commit comments

Comments
 (0)