AWS Project: Architect and Build an End-to-End AWS Web Application from Scratch, Step by Step
ฝัง
- เผยแพร่เมื่อ 15 พ.ค. 2024
- When you’re first learning AWS, it’s sometimes hard to know how to put all the “pieces” together-how to use the various services to create an actual application that you could use in the real world. I felt the same way when I started!
In this hands-on tutorial, I’ll walk you through how to design and build a simple web application from scratch. We’ll pick five different services-Amplify, Lambda, IAM, API Gateway and DynamoDB-and talk about why/where to use them, and how to get them to work with each other. As we go, we’ll build out each of the services, resulting in a fully-functional math web application.
To follow along, you’ll need:
• A text editor (such as Notepad or Notepad++)
• An AWS account and access to the Console (video here if you need help: • Create a Free AWS Acco... ). NOTE: You'll need administrator permissions to follow along.
• Some basic knowledge of AWS is preferable, but you can still follow along if you’re an absolute newbie
Here’s all the code you’ll need to build the application:
• index-ORIGINAL.html: drive.google.com/file/d/1D4GF...
• PowerOfMathFunction - Lambda-ORIGINAL.txt: drive.google.com/file/d/1ak_o...
• Execution Role Policy JSON.txt: drive.google.com/file/d/1xdko...
• PowerOfMathFunction - Lambda-FINAL.txt: drive.google.com/file/d/1ao_8...
• index.html: drive.google.com/file/d/1fCFD...
🤓 For another fun (even more comprehensive) project, check out this other video: • AWS Portfolio Project:...
Some code was re-used from this AWS walk-through: aws.amazon.com/getting-starte...
🌟🌟If you’re interested in getting AWS certifications, check out these full courses. They include lots of hands-on demos, quizzes and full practice exams. Use FRIENDS10 for a 10% discount!
- AWS Certified Cloud Practitioner: academy.zerotomastery.io/a/af...
- AWS Certified Solutions Architect Associate: academy.zerotomastery.io/a/af...
Timestamps
00:00 - Let me tell you a story…
01:07 - Overviewing the services and application we’ll be building in this video
01:56 - Architecting the web application from scratch
02:28 - What you’ll need to follow along with this video
03:02 - How to create and host a web page for our web application
03:37 - Creating an index.html page from scratch in a text editor
04:09 - Where to download the code used in this video
04:27 - Deploying and hosting a web page with AWS Amplify
06:14 - How to do math calculations in our web application
06:56 - Creating a Python Lambda function to implement our math functionality
08:44 - Testing our Lambda function
10:21 - How to invoke our Lambda function
10:54 - Creating a REST API for our Lambda function using API Gateway
14:53 - How to persist our math result to a database, and also handle permissions
15:44 - Creating a new DynamoDB table to store our math result
16:37 - Giving Lambda permission to write to the DynamoDB table
18:23 - Updating the Lambda function code to write to the DynamoDB table
20:49 - Invoking the API Gateway endpoint from the index.html page in Amplify
21:08 - Updating the index.html page to call API Gateway
23:03 - Re-deploying our index.html page using Amplify
23:33 - Admiring our completed web application!
24:32 - IMPORTANT!! Delete your resources (I’ll show you how) - วิทยาศาสตร์และเทคโนโลยี
![[TH] 2024 PMSL SEA W2D1 | Summer | ถ้าไม่พร้อมลุย ได้ไปคุยกับรากมะม่วง](http://i.ytimg.com/vi/XlkKtVvBxac/mqdefault.jpg)
while deploying the html app using amplify im getting error access denied can anyone help me with this
Hi Arti! 😊 Thanks for watching! This is likely due to the "level" of the file zipping. Be sure to not zip the folder that it's in. For example, if index.html is in "project," don't zip "project," but only zip the index.html file. Also, if you pulled the files from the links in the description, be sure you rename them to "index.html" (rather than "index-ORIGINAL.html). I named them that just to distinguish between the "before" and "after" files. Lastly, you'll need to be running as the root user or an IAM user with admin privileges. Hope that helps!
@@TinyTechnicalTutorials Thanks for the solution
@@TinyTechnicalTutorials can u make certain big projects on Aws so that it will be helpful to build resume?
Yes! I definitely want to do more "project" videos. In the meantime, maybe check out cloudresumechallenge.dev. I've only skimmed through it (no affiliation), but it seems like a good approach for building out some resume projects (costs $20 for the ebook).
@@TinyTechnicalTutorials okay thanks
This is by far the best channel for AWS beginner content I've come across on TH-cam. Please keep up the amazing work!
Awwww, shucks! Thanks for such a nice comment! Made my day. 😊
Brilliant session , explained all the complex services, in very simple terms.
I'm so glad it helped! Thank you for watching! :)
Great video. I love the fact you show how to tie all the AWS services together. Thank you
I'm so glad you liked it! Thanks for watching! 😊
Thank you so much! I saw this video and expected it to be well over an hour, so I was amazed when you concisely explained everything in under 30 minutes!
Hi John - I'm so glad it was helpful! Thanks for watching! 😊
I can't thank you enough! I followed through and it helped to get my feet wet with this Solutions Architect type of exercise. MORE PLEASE! I'm still struggling with the coding part, but this is the best way to slowly understand how the features work together around the AWS territory. I will probably have to this again a couple more times :)
Oh, I'm so glad!!! Comments like this make me so happy! 😊 I definitely plan to do more of these end-to-end multi-service types of apps/videos in the future, so stay tuned!
This is top tier. If you are just starting out in aws start with this. The explanation from start to finish is perfect.
Oh, thank you SO much! Your comment made my day! 😊
One of the best tutorials I have ever seem - short, simple and on to the point
Awesome! So glad it was helpful. Thanks for watching! 🙏😊
What an amazing tutorial and you can hear the passion in your voice with every step. Keep up the great work!
Wow, such a nice comment!! 🥰 Glad it was helpful. Thanks for watching! 🙏🤓🌟
Such a simple and amazing demo introducing to the world of AWS ! You are an exceptional teacher. Thanks a lot for keeping this content free.
A very belated thank you!! Really appreciate it! 🥰🙏🌟
I still can’t believe this quality content is on TH-cam for free. I really enjoy the way you walk through the solution by telling a story. Hope to continue to see more from you! Keep up the awesome work!
I would love to see an ending section that talks about real-world examples if possible? Such as other websites or companies that employ these techniques/architectures. I always find it helpful to link the two as I go through any lab.
Thanks again for this great content.
Thanks for the kind words, @AdrianKeith! 🥰 I'm so glad you're enjoying the content. And this is awesome feedback. I always find real-world examples helpful too. Noted for future videos! 🤓
Simple, yet instrumental demo to learn the AWS services. Very well built. Thank you @Tiny Technical Tutorials!! This has been a fantastic experience for me
Oh, I'm so glad!! Really appreciate you supporting the channel! 😊
I've been looking for a quick overview of making serverless AWS apps and this video hit the nail on the head. :) Excellent!
Oh, fantastic!! I'm so glad it helped. Thanks for watching! 🔥🌟😊
Thanks so much for making these videos. You are an excellent teacher with very clear instructions. I've earned my AWS Cloud Practitioner certification and I'm working towards the Solutions Architect cert. This was a great project to get some hands-on experience with building a simple web app. Next... I plan to play with it to see if I can change the function to do some different calculations. :) For future tutorials, I would love to see something using Rekognition. I've been thinking about trying to build a couple of facial recognition based cat feeders for my 2 fur babies. I would love to learn anything about how to integrate Rekognition with an API. :)
Thanks for the nice comment, mblackonline! :) And congrats on the Cloud Practitioner cert! I do have a short video on Rekognition that might help you get started: th-cam.com/video/PyjDVZ--cfs/w-d-xo.html. (Love the project idea for the fur babies!!) :)
@@TinyTechnicalTutorials - Cool! I didn't see that in the list. I'll check it out. Thanks!
What else do you want to learn in AWS? Let me know below in the comments!
What are your thoughts on the Cloud Resume Challenge ?
Hey Jay-Jay! I actually hadn't heard of the Cloud Resume Challenge before. I'm checking it out! But in general, I think any kind of hands-on practice is good. Having an actual project to show is a great way to differentiate yourself when it comes to getting a job. So without knowing all the specifics, it seems like a good idea to me. Thanks for letting me know about it! :)
terraform
Thanks for the suggestion, bennyedu41! I've got Terraform on my list. :)
Excellent Video! I would like to see videos on using SCT and DMS for database migrations and how to develop AWS architectures for on-premise migration.
Brilliant teaching, subscribed! Thank you!
Just loved the content. I have never seen anyone explaining theory as well as practical at the same place.
Oh, you're too kind!!! Really appreciate the nice comment, and thanks for watching! 😊
Hi mam after the deployment of the web application it's showing this XML file does not appear to have any style information associated with it.The document tree is shown below
AccessDenied
Access Denied
ZKZ5M2R9VJY20B2S
5LQ0VgkD8MdDQK47xI33y7lbn2uFYNnP1Qyo1cdpb2J8hlCjB+7ynO9Hd8LFWz9l5N/4eGcwFNA=
What should I do now
yes mam same issue I am facing
What's your problems
Hi Lucifer! You'll need administrator-level access in order to complete this. I'd suggest checking that first.
@@TinyTechnicalTutorials ok
@@TinyTechnicalTutorials hi administration level access means we should login from iam user but after iam user login it's shows same
Thanks a million, maam! This is super clear, and the short, yet rich and informative videos make the subject at hand so much easier to understand. I cannot thank you enough!
Oh yay! I'm so glad it helped. Thanks for watching, Miguel! 😊
Amazing step-by-step instructions. Great video. Thank you so much for this practical hands on.
You bet! Glad it was helpful!! Thanks for watching. 🌟🤓🙏
I go through from beginning to end and you save my life. Thanks so much! and also subscribed.
Oh, I'm so glad!! Welcome to the channel, and thanks for watching! 😊
This is so helpful. So far the best explanation of each step. I am thankful to you
Oh, I'm so glad! Thanks for watching! 😊🙏
Thank you, Amber! As always, your content is cutting-edge and insightful. Keep up the fantastic work! Big fan of your courses on ZTM.
Thanks for the kind words and support, @Andromeda26_! Much appreciated! 🙏🤓🌟
This was a great video, thank you so much for making it! It was so well explained and walked through that I used it for a lab in my Cloud Architechture class and my students found it extremely helpful as well.
Oh, how wonderful!! I'm so glad it was helpful. Thanks for watching and sharing! 😊
The best Amplify tutorial I’ve seen so far
Wow, thanks! Much appreciated!! 🙏😊🌟
Nice quick tutorial connecting these service’s together.. wish more tutorials on AWS were like this.
Thanks for the kind words!! 🙏🌟😊 So glad it helped!
Thanks a lot for making videos on AWS. It's really easy to understand and follow for beginners. 🙂
Oh, I'm so glad!! Thanks for watching! 😊
Phenomenal. Great learner tutorial
Amazing explanation! One of the best video teaching cloud that I have seen.
Wow, thanks so much!! Glad it was helpful! 🤓🌟🙏
you're the absolute best! you just made learning about this services fun easy and fun
No, YOU'RE the best for leaving such a nice comment!!! Thank you! 🙏🌟🤓
It is so excitingly beginner friendly! I was very straightforward and clear
Oh yay!!! I'm so glad it helped. Thanks for watching! 🌟😊🙏
Thank you for this video! This was one of the most enjoyable tutorials to follow along to. 😀
Awww, thanks! So glad you enjoyed it! :)
OMG.... I just subscribed to your channel before even watching it, I will watch each and every video, i like that they are short and straight to the point.
Wow, what a nice comment!! Welcome to the channel, sibusiso, and thanks for watching!! 🤓🙏🌟
This is the most grateful LIKE I have ever given. (And I am already subscribed). Thank you for so simple explanations.
Thanks for the kind words, Richard!!! This made my day! 🥰🌟🙏
I must say that this is the best video you have made on this channel. please continue to make similar videos of building simple projects and solutions using AWS services or other online services and this method helps learners put their knowledge into practice. Excellent job!
Wow, thanks SO much!! Yes, this is one of my favorites too! And I definitely want to do more like this. Stay tuned! 😊🔥
I cannot thank you enough for this. As someone who is complete beginner to coding and AWS, this has helped me understand how to deploy things so well. Thank you so much for this!
You're very welcome! I'm so glad it helped! 🙏😎🌟
I loved this tutorial, clear and simple.
I'm so glad you liked it! Thanks for watching! 🙏
Fantastic video, very easy to follow steps ! Thanks. Subscribed and looking forward to the other videos.
Welcome to the channel, Rob BlueMug! Great to have you! 😊
Thanks for the tutorial. Really helped to cement the mental model.
Awesome--thanks, Andrew! :)
This has been the most practical and hands on ways to get started with AWS! In fact you should ask AWS to make this as default training video as starter kit!
Awwww, shucks!! You're too kind, Praveen! 🙏 Really appreciate the nice comment and the support of the channel!! 😊
Your Teaching Method is so amazing Please continue to make more tutorials!!!!!
I'm so glad it's helpful! Thanks for watching!! 😊
Simple, quick and powerful! Thanks ❤
Yay! I'm so glad you liked it! Thanks for watching! 🌟🙏🤓
Best tutorial I've watched so far of an AWS service. Thank you so much. Ots going to help me with my project.🎉🎉❤
You're very welcome! Thanks for the kind words!! 🤓🙏🥰
Hey Maam , I was trying to get started with AWS and I found this video very effective rather than going through the documentation to get some handson , thanks alot , god bless !
Yay! I'm so glad it was helpful! Thanks for watching! 🙏🤓🌟
Best channel for AWS beginners! Subscribed!
Awwww, thanks!!! 🌟🙏🤓 Welcome to the channel!
Really I love this type of explanation. Thank you
Thank you so much!! Really appreciate it! 🥰🙏🌟
You're a life saver. Thanks for such beautiful content
I'm so glad it was helpful! Thanks for watching! 😊
I never comment on videos, but this was the one that finally helped me break through with AWS! I've been reading all about it, but whenever I log into the console I have no idea what to do. This video solved that for me, thank you!!!
This is the nicest comment EVER!!! Thanks so much. I'm glad it helped! 💪😎🔥
Hey there,
Thank you for the amazing content. Was able to follow from start to finish with just some little troubleshooting due to my customization.
Cheers ❤
Nice work...that's great to hear! Thanks for watching! 🙏🌟🤓
Brilliant Demo 👍🏻
Thanks for building up my confidence ❤
Awwww...you're very welcome! Thanks for taking the time to drop the nice comment! 🥰
Wow, it was really awesome! This is the easiest way to learn what is behind the AWS!
Yay!! I'm so glad it helped! Thanks for watching. 😊
thanks for your wonderfully designed vdos..they are like laser pointers for those in the dark, the light is small but precise and point exactly to where they need to go..I can feel your love in your beautifully crafted vdos..no GPT can do this..thank you.
That's so nice of you--thanks! And good to know I won't be replaced by GPT (at least not yet!). 🥰
Thank you so much this was very insightful I followed through it so well. Thank you once more!!!
I'm so glad it helped! Thanks for watching! 🤓🙏🌟
This was so easy yet informative! thanks a lot!
I'm so glad it was helpful! Thanks for watching! 🙏🌟😊
As someone who has been learning AWS for a few months now and have designed a few EC2 architecture, coming across your TH-cam profile was definitely a blessing. As for all my missing and needed skills, your videos have been super helpful. Thank you for helping me to build my foundation with creating severless architecture.
Oh, I'm so glad!! I just love hearing stuff like this. Thanks for watching, and for such a nice comment! 🙏🤓🌟
I was unable to get hold of aws now i am sure i will be able to nail it Thanks a lot
Awesome!! You got this!! 💪🔥😎
Liked and Subscribed - Second fabulous lecture by you that I have seen. Your knowledge, your delivery are both great. Thank you very much!
Awwww, shucks!! You're very kind. Welcome to the channel!! 🤓🌟🥰
Thank you!! i wanted that walkthrough so much.
Glad you enjoyed it! Thanks for watching! 😊🌟🙏
Good presentation with clear end to end example
I'm glad it helped! Thanks for watching, and for such a nice comment! 🙏🤓🌟
That was brilliant! Thank you. I took notes. There are a lot of pieces to creating a web application with a backend. I will be ablt to use this going forward. I "liked and subscribed."
Awesome! Welcome to the channel, @NoirRobert! I'm so glad it helped. 🥰💪🌟
I'm learning AWS and I'm going through the same issues. It feels so nice to know it's a common problem and that other people go through the same thing bc it's normal.
Yes, very normal! Glad the video helped! 😊💪🌟
The best video... Helps me boost my confidence
Yay! I'm so glad it helped. Thanks for watching! 🤓🌟🙏
Thank you very much for putting this together. I was able to follow along taking careful note on the back and forth between the different sections of AWS (API Gateway, Lambda, etc.). While my project inverted and burst into flames, this is more of a limitation on my part concerning writing code and setting up the Dynamo DB as I deviated from your tutorial. However, your step-by-step was invaluable for giving me the basic framework for everything. Once I rewrite the code, I should be able to see it work. Again, thank you for this great video.
Hi Paul! 👋 I actually laughed out loud when you said your project inverted and burst into flames! 🔥😂 I hope you're able to repair the damage. Thanks for taking the time to drop such a nice note, and good luck...you got this!! 🤓💪
Thank you@@TinyTechnicalTutorials I'll keep on it and something useful will be the end result. On to S3 videos (like yours)...
such an interesting way aws in a nutshell.. appreciate you and thanks for this video.
For sure!! Thanks for watching! 🤓🌟🙏
Hitting that like button is an involuntary action even before you asked. Thanks for the amazing video. I am sorry I am late to find the video. I wish TH-cam's algorithm were half as good in recommending this video to me while i was struggling to understand the concept until like 30 mins ago
Haha! The algorithm works in mysterious ways. 😊 Glad you eventually found it! 🤓
@@TinyTechnicalTutorials Me too. Thanks again, for the others I already watched and for those I am about to watch and Share
Great approach and quality content ! THANKS
I appreciate the comment! Thanks so much for watching! 😊
thanks for this insight video for AWS ... I was looking for something like this since ages.
Oh, I'm so glad!! Thanks for watching! 😊🌟🙏
You're awesome. Thank you for doing these.
Thank YOU for watching! 🙏🌟🤓
Wow! Thanks for this. I too was struggling with learning the pieces but couldn't seem to put things together. Especially on the web integration to the AWS services...
Yay! I'm so glad it was helpful! 😊
You explain it so nicely that I immediately subscribed to it. I hope to learn a lot from you.
Awesome, thank you! Welcome to the channel! 😊🔥🌟
@@TinyTechnicalTutorials - Can you please cover real-time projects using ECS, ECR etc.?
I've added this to my list for future videos. Thanks, Jasper! 😎🌟🔥
@@TinyTechnicalTutorials - You are so prompt and kind! I will recommend this channel to all my friends.
No, YOU are kind! 😊😁
Great tutorial, nicely introduces the AWS services in a simple and straightforward way.
I'm gonna have fun playing with these tools. :D
Awesome--glad it helped! Have fun! 😊🤓
Very helpful for the beginners in this ocean of theoretical world.
Yay! I'm so glad it was helpful. Thanks for watching! 😊
Great to visit again.
Welcome back! 😊
Loved how you went through this lab 🧪, definitely liked and subscribed . Will be looking forward to more of your videos so I can build some projects for my portfolio. Great job 👏🏽
And again! Welcome to the channel! 🌟
Thank you very much. Great effort and nice explanation specially for cloud beginners. Keep going......
You're very welcome! Thanks for the nice comment! 😊
Brilliantly explained cuz man AWS is overly complex for the newbie, well done, everything about this was awesome! Subscribed, thanks!
Yay! I'm so glad it was helpful! Thanks for watching! 😊
Great tutorial for a simple app deployment
Glad you think so! Thanks for watching, and for such a nice comment! 🙏🤓🌟
Very helpful, thank you for sharing!
You bet! Thank YOU for watching! 🙏🤓🌟
Thank you for this valuable content. It helped me to connect the dots. Keep posting these fantastic videos. Wishing you all the best! :)
So nice of you! Really appreciate the support! 🙏🌟🤓
the best video i found!!!! thank you....need more of this, pls
More to come! Thanks for watching! 🌟😊🙏
Thank you so much for such an easy to understand video. I am new to all this and your video made it really very easy.✌
Oh wonderful! I'm so glad it helped. Thanks for watching! 😊
You are really good with teaching and conveying things so simply. I am impressed, very good content.
Glad you think so! Thanks for the support!! 🙏😊🌟
I was facing error this page doesn't exist when deploying on amplify any suggestions.
Hi Mayank! 👋 If you're still facing this error, check out the pinned comment on the video...there are some common troubleshooting tips in there. 😊
beautiful tutorial. Thank you so much!
Awwww, thanks so much! Glad it helped! 😊💪
Great quick lab =) Thank you TTT!
You bet! Thanks for watching! 🙏🌟🤓
Thanks for the tutorial..Explained in a simplified way..
Glad it was helpful! Thanks for watching! 🌟🙏🤓
Thanks again! Keep them coming please...
Oh my goodness...my biggest donation EVER!!! This made my day, @samisosa9105!! Really appreciate the support!! 🔥🙏🤓🌟😎💪❤
You are most welcome! And I was simply just stating facts in my comments, while trying to show gratitude. You have no idea how hard it is for me to stay awake watching other AWS videos much less learn anything. With you, it's hard not to do both! Thank you again. May the wind always be at your back..........
Great tutorial - only had to do a bit of research on the API Gateway as the UI has changed a bit. Keep up the great content.
Glad it helped! Yeah, the AWS UI changes constantly...it's impossible to keep up! Glad you were still able to figure it out. 💪 Thanks for watching! 🙏🤓🌟
@@TinyTechnicalTutorials I found the CORS part had me make an additional EndPoint/Path before I could enable the CORS button. I like your solutions/example is enough to get a feel without having to build the Front-End pieces/parts allowing me to focus on the high-level flow and connection
Seriously thankyou so much, I was really struggling. But now I can build my own thankyou
Oh, I'm so glad! Thanks for watching! 😊
Thank you, this was very insightful!
I'm so glad! Thanks for watching! 😊
just found your channel, and walk through was great thank you! I have my CCP exam in DEC (coming up) this helps a lot! thank you!!
I'm so glad! Welcome to the channel!! :)
Also, no pressure, but since you mentioned CCP, I do have a full CCP certification prep course on Udemy if you use them: www.udemy.com/course/aws-certified-cloud-practitioner-master-aws-fundamentals. Either way, good luck with your studies!
@@TinyTechnicalTutorials yea I just finished stephane maarek course, but I'll definitely look into yours! Thank you!
i subscribed to this channel just by seeing this video alone. your voice is awesome and great
Awwww...thanks so much! Welcome to the channel! 😊
Amazing work it was my first time doing this and i have learned alot, thanks
A very belated thank you!! Really appreciate it! 🥰🙏🌟
Thank you, so much for sharing.
I can't wait to subscribe to your channel!!!
Good teacher!!!
Thank you so much, Mielushe! 😃 Welcome to the channel!!
Wow, I feel like a 6 year old who knows how to build a full stack application and I just learned that in just 26 minutes... Thank you for your super simple explanation
Haha!! A very belated thank you!! Really appreciate it! 🥰🙏🌟
Your teaching style is impeccable, to say the very least. The transition of your voice-tone, as well as your consistent gregariousness made it that much more interesting and easy to follow along. This is coming from a guy with serious ADHD issues (squirrel!)... But seriously, thank you so very much for an awesome video. You are a selfless person who belongs to an extinct breed.
Wow, a donation AND a super-super nice comment! You're quickly becoming my favorite Super Fan!! 🥰😊 Seriously...REALLY appreciate the support!!! 🙏🔥
great quick demo. thank you so much.
You bet! Thanks for watching! 😊
This video help me a lot , now I have an idea on how to implement my project. Thanks
Oh, I'm so glad it helped!! Thanks for watching! 🌟🙏🤓
Amber's AWS solutions architect course on the teaching platform (zero to mastery) is so well put together. It helped me tremendously when preparing for the exam. I have recommended to my colleagues and my friends. 10/10
WOW, thanks so much!!! Really appreciate the up-vote! 🙏🌟🤓
This was a great video for me to learn on AWS, Thank you Team
Glad it was helpful! Thanks for watching! 😊