AWS Project: Build a Game with a Continuous Deployment Pipeline from GitHub to S3 | AWS Tutorial

AWS CodePipeline automates building, testing and deploying your projects. Just choose where your code lives, say where you want it to be deployed to, and—MAGIC!—CodePipeline makes it happen.

In this hands-on tutorial, we’ll build a simple memory card game (using memes, no less!) using HTML, JavaScript and CSS. The code will live in GitHub (you can fork the repo provided). We’ll then create and configure an S3 bucket for static website hosting. And from there, we’ll create a CodePipeline that pulls from GitHub and deploys to the S3 bucket.
At the end, I’ll walk you through how to delete the resources (which should all be eligible for the Free Tier).

🌟***CODE AND RESOURCES USED IN THE VIDEO***🌟

🌟***OTHER AWS PROJECTS YOU MIGHT ENJOY***🌟

🌟***MY AWS COURSES***🌟
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!

🌟***TIMESTAMPS***🌟
00:00 – A preview of the completed game – a meme matching memory card game!
00:30 – Reviewing the code files – HTML, CSS, JavaScript and images
01:15 – A high-level look at the pipeline we’re building
02:10 – How much will this cost me?
02:40 – Forking the GitHub repository to get the game code
03:18 – Creating and configuring an S3 bucket for static website hosting
06:10 – Creating a new pipeline in AWS CodePipeline
07:12 – Connecting to GitHub from CodePipeline
10:13 – Monitoring the progress of the source and deploy stages of CodePipeline
10:30 – Testing that the static website is working on S3
11:16 – Committing a code change in GitHub and triggering CodePipeline
13:00 - IMPORTANT!! Delete your resources!
14:25 – Check out there other hands-on AWS projects for more practice!

[TinyTechnicalTutorials]

What else do you want to learn in AWS? Let me know below! 🤓🤓

[panagiotiskaraberis]

excellent demo, quick, accurate, with specific instructions !! I hope all video tutorials have your philosophy !!
Keep up the good work !!

[premium]

This tutorial made my day ...thanks for explaining every single steps clearly

[Matt]

Thank you for you help and quick responses! As an AWS student, having content like yours is SO valuable!

[tabtubb]

Your project videos are absolute gems! 🙏🏾🙏🏾Thanks for creating such a unique content that sets your channel apart from the rest. Your dedication and expertise shines through in every video. Keep up the fantastic work!💎✨💫

[faixan]

awesome stuff, to the point and unique quick content. just 15 mins and I got to learn how code pipeline works.

[sunil_thorat]

Nice explanation and easy to understand all the steps. thanks😊

[ibmuser]

Very nice!! Keep sharing. Appreciate it. Liked how you add a DELETE your resources section at the end of each video!!

[mohammadfakure]

That was a great deployment on static websites, thanks for sharing this valuable contained

[ricardohernandezmendez]

Thank you for this tutorial, very clear, I was able to host a static website using s3 and codePipeline.

[ThanujaP-iseh]

I really appreciate how your videos are helping me understand concepts. The explanations are clear and concise. Keep up the great work!

Could you please consider doing more projects centered around Ansible and CI/CD pipelines, particularly involving technologies such as Jenkins, Kubernetes, and Docker?

[FIBONACCIVEGA]

I really loved you video. I still learning AWS and your Channel its one of my main resources to continue my journey . GRACIAS!!

[Taha_Sumeer]

Successfully implemented. Very much helpful. Thanks for this project.

[emiliovillalba]

Muchas gracias Tiny por este laboratorio simples y práctico, esperamos que sigas subiendo mas laboratorios, de preferencia que utilice recursos relacionadas a redes. Saludos

[jessejfk]

Thanks for the tutorial Amber. I followed your tutorial on deploying a static resume website. I had a similar idea to this video, but applying that to my resume. My idea of this was having a way to just update the code of my resume without having to manually add and delete the html, css, JS files each time.

Could you possibly make a tutorial on how to make a continuous deployment infrastructure using the pipeline for the resume website?

[dnogitsune]

@TinyTechnicalTutorials, I have a question. How would this work if you have a backend to talk to? Can the same method be used, just with a few extra steps? Thank you for your time.

[kunaljha]

awesome content. Could you please also make a video including build stage.

[elzioie]

Is there any possibilities to create videos with google could or Azure too.?Thank you for sharing your work!

[oba_idan]

Very well done AMber. Thanks for all that you do for the cloud community. By the time I finished my project, my game is showing just 8 pictures, and I checked the js file and css file, everything seems to be in order. What do you think could be responsible?

[MisterC]

Thank you so much ! You just got a subscriber ! Can you please tell me how to add more images? Never mind I found how to add new pictures. Thank you so much again !