amedpal

Personal website

amedpal.com is my personal website, and although it is quite simple, I leverage several AWS services behind the scenes to keep everything running smoothly. In this little document I'll be showing you how is this website built, what techonolgies, services, and architectures I used and why.

Lighthouse report

Lighthouse is an open-source, automated tool for measuring the quality of web pages by Google. I wanted to start with this and show the score of amedpal.com because I think there's no point in showcasing how this website was built if it has a low performance, it is not SEO compatible, etc.

Lighthouse report

I'm always working on keeping the website optimized and aiming to a 100 score in all metrics. The screenshot above was taken on November 4th, 2020 on desktop view.

AWS Services

The whole website is built around several AWS services including S3, Lambda, and CodePipeline. I'll start talking more about each one, the role they play in my personal site, and how they work toegether to make amedpal.com 100% serverless.

S3 & CloudFront

S3 stands for Simple Storage Service and is bascially where all the files my website needs to work live in. Since I don't use any framework like React or Angular, I don't need to run a rebuild of the website with every update; I use vanilla HTML, CSS and JS. This decision gives me a little more flexibility if I want a specific page to look or work differently. Also, the reason I went this way instead of using something more modern and that I already know like React is because I wanted to keep things rather simple and I don't mind working vanilla.

CloudFront is a content-delivery network, which basically allows me to distribute my website globally more easily and rapidly. I chose CloudFront because it is part of AWS so I have everything in one place, it complements S3 very well, and it also allows me to distribute my files using https, which should be a must for every website today.

Lambda

Lambda allows me to run code withour setting up any servers. So why would I use Lambda if I already said that this website is meant to be as simple as possible and I'm only working with vanilla JavaScript at most? Well, I decided to implement a Lambda function for my contact page. Bascially I use it to recieve the contact information and send it to my email. I actually wrote a mini tutorial on the topic, you can read more about it here.

CodePipeline

I use CodePipeline to easily keep my webiste updated. All my website files are obviously in a git repository, and with CodePipeline every time I push changes to the master branch, all the files are uploaded directly to S3. It's pretty straigh-forward, simple, and it helps me quite a bit.

Route 53

Route53 is my DNS provider. I actually bought the domain amedpal.com originally through Namecheap, which is absolutely a great provider, but I made the change over to Route53 because it was part of the AWS ecosystem and I wanted everything in one place. So far it has worked great for me and it is actually very useful when you are working with other AWS services becuase it will auto create all the records you need with a few clicks.

WorkMail

About my email, I use WorkMail as my email and calendar service. There's not a lot to talk about here, just that it gets the job done and it is not that expensive. It was kind of weird at first because I was used to use Gmail, Outlook, and ThunderBird, but once you get the hang out of it it's really good. The interface is clean it just works.

Cost of operation

Keeping my website running is actually very cheap, I just pay $0.5 dollars for the Route53 hosted zone and $4.00 for WorkMail for a total of $4.50 each month. All the other services incur charges too, obviously, but in my case they are still on the AWS free tier or, my websiste recieves so little traffic that it is not enough to make a difference in my monthly billing.

Other

As I said earlier, this webiste is built mostly using vanilla CSS and JS, but I do use one library for the base look & feel and responsiveness: Bootstrap.

Future

I'll keep this document updated, but if you want to know something more about other projects I've done, things I only brushed on, or just say hi, feel free to email me.