-
Notifications
You must be signed in to change notification settings - Fork 156
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #1181 from ArmDeveloperEcosystem/main
Merge to production
- Loading branch information
Showing
70 changed files
with
1,580 additions
and
301 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,7 +1,6 @@ | ||
--- | ||
# User change | ||
title: Demonstrate Authenticated Debug | ||
draft: true | ||
|
||
weight: 5 # 1 is first, 2 is second, etc. | ||
|
||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Binary file added
BIN
+73.8 KB
content/learning-paths/laptops-and-desktops/win_aws_iot_s3/Figures/01.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added
BIN
+284 KB
content/learning-paths/laptops-and-desktops/win_aws_iot_s3/Figures/02.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added
BIN
+220 KB
content/learning-paths/laptops-and-desktops/win_aws_iot_s3/Figures/03.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added
BIN
+74.5 KB
content/learning-paths/laptops-and-desktops/win_aws_iot_s3/Figures/04.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added
BIN
+79.8 KB
content/learning-paths/laptops-and-desktops/win_aws_iot_s3/Figures/05.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
35 changes: 35 additions & 0 deletions
35
content/learning-paths/laptops-and-desktops/win_aws_iot_s3/_index.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,35 @@ | ||
--- | ||
title: Use Amazon S3 for your IoT applications running Windows on Arm | ||
|
||
minutes_to_complete: 30 | ||
|
||
who_is_this_for: This is an advanced topic for developers who are interested in using Amazon Web Services (AWS) S3 for hosting their IoT websites. | ||
|
||
learning_objectives: | ||
- Gain familiarity with Amazon S3. | ||
- Create a static website that interacts with AWS Lambda. | ||
|
||
prerequisites: | ||
- A Windows on Arm computer such as [Windows Dev Kit 2023](https://learn.microsoft.com/en-us/windows/arm/dev-kit), a Lenovo Thinkpad X13s running Windows 11 or a Windows on Arm [virtual machine](/learning-paths/cross-platform/woa_azure/). | ||
- Any code editor. [Visual Studio Code for Arm64](https://code.visualstudio.com/docs/?dv=win32arm64user) is suitable. | ||
- Completion of the [Use AWS Lambda for IoT applications](/learning-paths/laptops-and-desktops/win_aws_iot_lambda/) Learning Path. | ||
|
||
author_primary: Dawid Borycki | ||
|
||
### Tags | ||
skilllevels: Advanced | ||
subjects: Migration to Arm | ||
armips: | ||
- Cortex-A | ||
operatingsystems: | ||
- Windows | ||
tools_software_languages: | ||
- Node.js | ||
- Visual Studio Code | ||
|
||
### FIXED, DO NOT MODIFY | ||
# ================================================================================ | ||
weight: 1 # _index.md always has weight of 1 to order correctly | ||
layout: "learningpathall" # All files under learning paths have this same wrapper | ||
learning_path_main_page: "yes" # This should be surfaced when looking for related content. Only set for _index.md of learning path content. | ||
--- |
39 changes: 39 additions & 0 deletions
39
content/learning-paths/laptops-and-desktops/win_aws_iot_s3/_next-steps.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,39 @@ | ||
--- | ||
# ================================================================================ | ||
# Edit | ||
# ================================================================================ | ||
|
||
next_step_guidance: > | ||
You have learned how to use Amazon S3 for an IoT solution. You can now learn how to develop IoT applications with .NET 8 on Windows on Arm. | ||
# 1-3 sentence recommendation outlining how the reader can generally keep learning about these topics, and a specific explanation of why the next step is being recommended. | ||
|
||
recommended_path: "/learning-paths/laptops-and-desktops/win_net8" | ||
# Link to the next learning path being recommended(For example this could be /learning-paths/servers-and-cloud-computing/mongodb). | ||
|
||
|
||
# further_reading links to references related to this path. Can be: | ||
# Manuals for a tool / software mentioned (type: documentation) | ||
# Blog about related topics (type: blog) | ||
# General online references (type: website) | ||
|
||
further_reading: | ||
- resource: | ||
title: Amazon S3 | ||
link: https://aws.amazon.com/s3/ | ||
type: documentation | ||
- resource: | ||
title: Hosting a static website using Amazon S3 | ||
link: https://docs.aws.amazon.com/AmazonS3/latest/userguide/WebsiteHosting.html | ||
type: documentation | ||
- resource: | ||
title: Developing with Amazon S3 | ||
link: https://docs.aws.amazon.com/AmazonS3/latest/userguide/developing-s3.html | ||
type: documentation | ||
|
||
# ================================================================================ | ||
# FIXED, DO NOT MODIFY | ||
# ================================================================================ | ||
weight: 21 # set to always be larger than the content in this path, and one more than 'review' | ||
title: "Next Steps" # Always the same | ||
layout: "learningpathall" # All files under learning paths have this same wrapper | ||
--- |
51 changes: 51 additions & 0 deletions
51
content/learning-paths/laptops-and-desktops/win_aws_iot_s3/_review.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,51 @@ | ||
--- | ||
# ================================================================================ | ||
# Edit | ||
# ================================================================================ | ||
|
||
# Always 3 questions. Should try to test the reader's knowledge, and reinforce the key points you want them to remember. | ||
# question: A one sentence question | ||
# answers: The correct answers (from 2-4 answer options only). Should be surrounded by quotes. | ||
# correct_answer: An integer indicating what answer is correct (index starts from 0) | ||
# explanation: A short (1-3 sentence) explanation of why the correct answer is correct. Can add additional context if desired | ||
|
||
|
||
review: | ||
- questions: | ||
question: > | ||
What is the Amazon S3? | ||
answers: | ||
- "A part of the AWS IoT Core to process and route data between IoT devices and other AWS services." | ||
- "A scalable, high-speed, web-based cloud storage service designed for online backup and archiving of data." | ||
- "An engine for accelerating database access." | ||
correct_answer: 2 | ||
explanation: > | ||
Amazon S3 (Simple Storage Service) is a scalable, high-speed, web-based cloud storage service designed for online backup and archiving of data and applications on Amazon Web Services (AWS). | ||
- questions: | ||
question: > | ||
Does Amazon S3 require you to set up the archive server? | ||
answers: | ||
- "No" | ||
- "Yes" | ||
correct_answer: 1 | ||
explanation: > | ||
Amazon S3 is a managed service, so you don't have to worry about hardware provisioning, setup and configuration, replication, software patching, or cluster scaling. | ||
- questions: | ||
question: > | ||
Can you use Amazon S3 for static website hosting? | ||
answers: | ||
- "Yes" | ||
- "No" | ||
correct_answer: 1 | ||
explanation: > | ||
Amazon S3 can also be used for static website hosting. This feature allows users to host static web pages directly from an S3 bucket, making it a cost-effective and simple solution for serving static content such as HTML, CSS, JavaScript, and images. | ||
# ================================================================================ | ||
# FIXED, DO NOT MODIFY | ||
# ================================================================================ | ||
title: "Review" # Always the same title | ||
weight: 20 # Set to always be larger than the content in this path | ||
layout: "learningpathall" # All files under learning paths have this same wrapper | ||
--- |
46 changes: 46 additions & 0 deletions
46
content/learning-paths/laptops-and-desktops/win_aws_iot_s3/add-lambda.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,46 @@ | ||
--- | ||
# User change | ||
title: "Add AWS Lambda Endpoint" | ||
|
||
weight: 4 | ||
|
||
layout: "learningpathall" | ||
--- | ||
|
||
### AWS Lambda | ||
|
||
You will now use the AWS Lambda console to retrieve the AWS Lambda endpoint for the static website. Before you begin make sure to prepare the `GetAverageTemperature` AWS Lambda function as explained in this [Learning Path](/learning-paths/laptops-and-desktops/win_aws_iot_lambda_dynamodb/). Then proceed as follows: | ||
1. Go to the AWS Lambda console, and click the `GetAverageTemperature` Lambda function. | ||
2. In the Lambda function dashboard, click the **Configuration** tab and then the **Function URL** as shown below: | ||
|
||
![fig2](Figures/02.png) | ||
|
||
3. Under the Function URL, click the **Create Function URL** button. | ||
4. In the window that appears select NONE, scroll down to Additional Settings, and check **Configure cross-origin resource sharing (CORS)**. | ||
5. Click the **Save** button | ||
|
||
The function URL will appear as follows: | ||
|
||
![fig3](Figures/03.png) | ||
|
||
Copy the link, and use it to replace the YOUR_API_GATEWAY_ENDPOINT_URL placeholder in the **index.js** file as follows: | ||
|
||
```JavaScript | ||
document.getElementById('fetchTemperatureButton').addEventListener('click', function() { | ||
fetch('YOUR_API_GATEWAY_ENDPOINT_URL') | ||
.then(response => response.json()) | ||
.then(data => { | ||
const temperature = data.average.toFixed(2); | ||
document.getElementById('temperatureDisplay').innerText = `Average Temperature: ${temperature} °C`; | ||
}) | ||
.catch(error => { | ||
console.error('Error fetching temperature:', error); | ||
document.getElementById('temperatureDisplay').innerText = 'Error fetching temperature'; | ||
}); | ||
}); | ||
``` | ||
|
||
Save the file, and open **index.html**. Then, click the **Get temperature button** and the average temperature will appear as shown below: | ||
|
||
![fig4](Figures/04.png) | ||
|
17 changes: 17 additions & 0 deletions
17
content/learning-paths/laptops-and-desktops/win_aws_iot_s3/background.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
--- | ||
# User change | ||
title: "Background" | ||
|
||
weight: 2 | ||
|
||
layout: "learningpathall" | ||
--- | ||
### What is Amazon S3? | ||
|
||
Amazon Simple Storage Service (S3) is a scalable, high-speed, web-based cloud storage service designed for online backup and archiving of data and applications on Amazon Web Services (AWS). It provides developers and IT teams with secure, durable, and highly-scalable object storage. It also offers a simple web service interface that can be used to store and retrieve any amount of data from anywhere on the web, making it ideal for data storage, distribution, and computation tasks. It supports a range of use cases, including big data analytics, content distribution, disaster recovery, and serverless computing. With features like lifecycle management, versioning, and access controls, Amazon S3 helps organizations manage data at scale while maintaining security and compliance. | ||
|
||
In addition to its core storage capabilities, Amazon S3 can also be used for static website hosting. This feature allows users to host static web pages directly from an S3 bucket, making it a cost-effective and simple solution for serving content such as HTML, CSS, JavaScript, and images. By configuring the bucket for website hosting, users can define index and error documents, and take advantage of S3’s high availability and scalability to ensure their website is accessible and performant. This makes Amazon S3 an excellent choice for personal blogs, company websites, and landing pages that do not require server-side scripting. | ||
|
||
Amazon S3 provides Software Development Kits (SDKs) that simplify the integration of S3 into applications by providing comprehensive APIs that facilitate file uploads, downloads, and management directly from the codebase. The AWS CLI allows developers and administrators to interact with S3 from the command line, accelerating many programming and administrative tasks. | ||
|
||
In this Learning Path, you will learn how to use Amazon S3 to host a static website that interacts with AWS Lambda. Specifically, the Lambda function will consume data from a DynamoDB table, which is populated by a hypothetical IoT device streaming data to the cloud as explained in this [Learning Path](/learning-paths/laptops-and-desktops/win_aws_iot_lambda/). This setup not only demonstrates the seamless connectivity between various AWS services but also serves as a foundation for building an efficient dashboard for IoT solutions, providing real-time insights and data visualization. |
93 changes: 93 additions & 0 deletions
93
content/learning-paths/laptops-and-desktops/win_aws_iot_s3/deploy.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,93 @@ | ||
--- | ||
# User change | ||
title: "Deploy website to Amazon S3" | ||
|
||
weight: 5 | ||
|
||
layout: "learningpathall" | ||
--- | ||
### Deploy to Amazon S3 | ||
|
||
In this section you will deploy the website to Amazon S3 using the Amazon Command Line interface (AWS CLI) version 2. If you don't already have it, start by [installing AWS CLI](/install-guides/aws-cli/). | ||
### AWS CLI | ||
To configure the AWS CLI you first need to create the [AWS CLI user](https://docs.aws.amazon.com/IAM/latest/UserGuide/id_users_create.html#id_users_create_console). Then, you need to generate the access keys by following this [tutorial](https://docs.aws.amazon.com/cli/v1/userguide/cli-authentication-user.html). | ||
|
||
Once you have the access key, go to the Command Prompt and type the following: | ||
|
||
```console | ||
aws configure | ||
``` | ||
|
||
The command will prompt for the following: | ||
1. AWS Access Key ID [None]: **paste in your Access Key ID** | ||
2. AWS Secret Access Key [None]: **paste in your Access Key** | ||
3. Default region name [None]: **type your region** | ||
4. Default output format [None]: **press enter** | ||
|
||
Ensure that AWS CLI can communicate with AWS. To do so, type the following command (replace eu-central-1 with the region code you are using): | ||
``` | ||
console | ||
aws lambda list-functions --region eu-central-1 --output table | ||
``` | ||
|
||
The command will display the AWS Lambda functions in a table. | ||
|
||
### S3 bucket | ||
You are now ready to deploy the website to AWS S3. To do this, you will first create the S3 bucket. Then, you will upload the website files, and finally you will configure the S3 bucket for static website hosting. | ||
|
||
Proceed as follows: | ||
1. Create the bucket by typing the placeholder with the unique bucket name (remember to replace <unique-bucket-name>), and the <region> with the AWS region code you're using, as shown below: | ||
``` | ||
console | ||
aws s3api create-bucket --bucket <unique-bucket-name> --region <region> --create-bucket-configuration LocationConstraint=<region> --object-ownership BucketOwnerPreferred | ||
``` | ||
|
||
2. Upload the following files: | ||
```console | ||
aws s3 cp index.html s3://<unique-bucket-name>/ | ||
aws s3 cp styles.css s3://<unique-bucket-name>/ | ||
aws s3 cp index.js s3://<unique-bucket-name>/ | ||
``` | ||
|
||
3. Configure the bucket policy to enable public read of the files: | ||
```console | ||
cat > policy.json << EOL | ||
{ | ||
"Version": "2012-10-17", | ||
"Statement": [ | ||
{ | ||
"Sid": "PublicReadGetObject", | ||
"Effect": "Allow", | ||
"Principal": "*", | ||
"Action": "s3:GetObject", | ||
"Resource": "arn:aws:s3:::<unique-bucket-name>/*" | ||
} | ||
] | ||
} | ||
EOL | ||
``` | ||
|
||
4. Remove the public access block on the bucket: | ||
``` | ||
console | ||
aws s3api delete-public-access-block --bucket db-iot-bucket | ||
``` | ||
|
||
5. Apply the policy as follows: | ||
```console | ||
ws s3api put-bucket-policy --bucket <unique-bucket-name> --policy file://policy.json | ||
``` | ||
|
||
6. Enable static website hosting by: | ||
```console | ||
aws s3 website s3://<unique-bucket-name>/ --index-document index.html | ||
``` | ||
|
||
Finally, access the website by typing **http://<unique-bucket-name>.s3-website-<region>.amazonaws.com**, where <unique-bucket-name> is the name of your bucket and <region> stands for the region you're using (here that is eu-central-1): | ||
|
||
![fig5](Figures/05.png) | ||
|
||
## Summary | ||
In this learning path you have learned how to create a simple static website that fetches and displays temperature data from an AWS Lambda function. The website consists of an HTML file (**index.html**), a CSS file (**styles.css**), and a JavaScript file (**index.js**). The JavaScript code within the website sends an HTTP request to an AWS Lambda function, which processes the request and returns the temperature data in a JSON format. This data is then displayed on the webpage. | ||
|
||
After developing the website, you deployed it to Amazon S3 for static website hosting. You created an S3 bucket, disabled the default block public access settings, and uploaded the website files to the bucket. You then applied a bucket policy to allow public read access to the objects, and configured the bucket to serve as a static website. Finally, you accessed the website using the S3 static website endpoint, successfully integrating the web application with AWS Lambda and deploying it to the cloud. |
Oops, something went wrong.