Skip to content

Commit

Permalink
Recent Changes to Cloud Resume Challenge
Browse files Browse the repository at this point in the history
  • Loading branch information
@Mohid314
Mohid314 committed Jan 3, 2024
1 parent 999b0c4 commit eff358e
Show file tree
Hide file tree
Showing 2 changed files with 22 additions and 19 deletions.
Binary file added website/assets/images/AWS.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
41 changes: 22 additions & 19 deletions website/cloud-resume.html
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<!doctype html>
+<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
Expand Down Expand Up @@ -37,7 +37,7 @@
<li><a href="https://www.linkedin.com/in/mohid-/" target="_blank"><i class="ri-linkedin-fill"></i></a></li>
</ul>
<!-- social -->
</div>
/ </div>*/
</div>
</header>
<!-- header -->
Expand All @@ -62,25 +62,28 @@ <h1 class="ds-work-det-title">AWS Cloud Resume Challenge</h1>

<p>I Envisoned myself to Apply my development knowledge </p>

<h2>Sub Title for project</h2>
<p>Phasellus non faucibus purus, a venenatis diam. In faucibus orci mauris, porttitor egestas diam elementum non. Vestibulum non metus tempus, sagittis libero sed, euismod purus. Cras dolor nulla, hendrerit vitae libero eu, finibus ultricies dolor. Vestibulum non metus tempus, sagittis libero sed, euismod purus. Cras dolor nulla, hendrerit vitae libero eu, finibus ultricies dolor.</p>

<ul>
<li>Phasellus non faucibus purus, a venenatis diam. In faucibus orci mauris, porttitor egestas diam elementum non.</li>
<li>Vestibulum non metus tempus, sagittis libero sed, euismod purus.</li>
<li>Vestibulum non metus tempus, sagittis libero sed, euismod purus. Cras dolor nulla, hendrerit vitae libero eu, finibus ultricies dolor. Vestibulum non metus tempus.</li>
</ul>
</div>
</div>
</div>
<figure><img src="assets/images/work-details-image-2.jpg"></figure>
<div class="ds-work-content-sec">
<div class="row justify-content-center">
<div class="col-12 col-sm-12 col-md-8 col-lg-8 col-xl-8 col-xxl-8">
<p>Phasellus non faucibus purus, a venenatis diam. In faucibus orci mauris, porttitor egestas diam elementum non. Vestibulum non metus tempus, sagittis libero sed, euismod purus. Cras dolor nulla, hendrerit vitae libero eu, finibus ultricies dolor. Vestibulum non metus tempus, sagittis libero sed, euismod purus. Cras dolor nulla, hendrerit vitae libero eu, finibus ultricies dolor.</p>
<h2>Setting up the frontend</h2>
<p>
Next, I made an AWS account. The first service I used was S3, where I created a bucket to try to get a feel for it. Once I felt comfortable I made my real S3 bucket and hosted my frontend content as a static website. Once the site was hosted I purchased a domain name (chadiamond.io) in Route53. After purchasing the domain on Route53, I used Amazon Certificate Manager to get the certificates needed to secure the site. Once the certificates were created I used Amazon CloudFront to secure the site (over HTTPS).
</p>
<h2>Setting up the backend</h2>
<p>I spent a few days clicking around in AWS IAM, Lambda, DynamoDB and API Gateway. This is a good way to get to know the service and what it does. Once I felt comfortable, I set up a Visitor count function that my frontend would use to track the amount of visitors who visit my site. To start, I created all of these resources using the console. By the time I got it working I had encountered dozens of errors. First, I had to figure out how I wanted to store my visitor count in DynamoDB. This was fairly easy since I decided I only needed to read and write the same record. Next, I used Lambda to write the code needed to read and write from my DynamoDB table. It took me a few days, but I finally got this working (although I created all the resources manually). I also created my python tests using pytest. It was a simple test that just looked for a successful response (more on this and CICD later). At this point I only knew how to use the unittest library, but I came to find it was much easier and faster to use pytest (because of the tutorials I found for SAM) instead.
</p>
<h2>Connecting the two</h2>
<p>After my Lambda function, DynamoDB table and API Gateway were able to work together I was ready to write the JavaScript needed to display my visitor count. The flow needed was Fronted (S3) -> API Gateway -> Lambda -> DyanmoDB. Once I was able to get Javascript to hit an API and update the screen, my website kept giving me a CORS error. I copied my a bunch of variations of my error message into google to find the resources I needed to fix this error. The problem ended up being related to enabling CORS in API Gateway AND returning an appropriate response from Lambda.
</p>
<h2>Infrastructure as Code (IAC)</h2>
<p>Now that I had everything working, It was time to work with SAM to deploy the resources I needed for the project as infrastructure as code. This was my favorite part because SAM makes it extremely easy to deploy your services using infrastructure as code (AWS CloudFormation behind the scenes). Again, I deployed a practice project first because I was not confident using SAM, and I did not want to mess-up my working web-app. Now I can honestly say this was not an easy one and done as I made quite a few errors. YAML Indentation was one of the hardest things for me when it came to deployment. I realized that although SAM generated alot of the started code for me, undersatnding it would be necessary to add more resources such as a DynamoDB table. I kept receiving error message after error message but I was persistent and finally got it right. When the time came to SAM deploy my project I was ready and confident it would work, and the cool thing is now that I had it as IAC I could create and delete the resources at will. This is when the real usefulness of IAC was clear to me.
</p>
<h2>CI/CD</h2>
<p>Finally, after my project was fully functioning I used GitHub Actions to set up CI/CD. I have a few projects hosted on GitHub but I had never worked with or heard of GitHub Actions. The first thing I did was read GitHub's documentation to see how everything should be set up. Next, I had followed their docs and made my backend redeploy (using a cool SAM Github Action) once the tests were passed. Next, and this is the most useful part, I setup my frontend GitHub repo to automatically push to s3! This was really cool if you are anything like me and like to change things often. This was a game changer because now if I want to edit my website, I just make the change locally, commit to GitHub and the change will be live!
</p>
<h2>Getting Certified</h2>
<p>Lastly, I created a study guide and studied about 2 weeks for the cloud practitioner certification exam and passed! This was a fun project and I've aquired skills that I will continue to develop. I highly recommend this challenge to anyone who is learning to code or learning cloud development. Please reach out to me on LinkedIn or via email if you have any questions! P.S I am happy to share my study guide if anyone is interested.</p>
</div>
</div>
</div>
<figure><img src="assets/images/AWS.png"></figure>
</div>
</div>
</div>
Expand All @@ -96,7 +99,7 @@ <h4>Ready to talk?</h4>
<p>Feel free to contact us</p>
<a href="mailto:test@test.com" class="ds-button">Lets Talk</a>
</section>
<span class="ds-copyright">© 2022 All rights reserved. Free minimal bootstrap template by <a href="https://designstub.com/" target="_blank">Designstub</a>.</span>

</div>
</footer>

Expand Down

0 comments on commit eff358e

Please sign in to comment.