Blog
Explore our community and get access to our blog posts
-
Cloud technologies are fast becoming the mainstay of what we use to develop custom solutions for consumers. Amazon Web Services(AWS) has become the dominant player and go cloud service for developers. I particularly like the variety of services, tools, and metrics at my disposal when using AWS in comparison to other cloud options.
In this article, I’ll give you a brief overview of one of my favourite AWS Services – AWS S3. I’ll also show you how you can use an AWS S3 bucket to host your static websites.
Overview of AWS S3
Amazon S3 is one of the building blocks of AWS. It is advertised as an “infinitely scaling storage”. Amazon S3 allows people to store objects (‘files’) in “buckets” (directories).
Buckets
Buckets are defined at a region level (AWS Regions). Buckets also have a standard naming convention – they must contain no uppercase letters, no underscore, must be between 3-63 characters long, must not be an IP, and must start with lowercase or a number. One thing to note is that “buckets” must have a globally unique name.
Object
Objects have a key, and that key is what is known as the full path e.g s3://example-bucket/myfile.txt. The key is usually comprised of the prefix + Object name. The Amazon S3 Ui might trick you into believing S3 buckets are made up of ‘directories’ but that is not the case. Object values are the content of the body and have a max size of 5Terabytes (5000 Gigabytes). When uploading a file that’s greater than 5GB, you must use the multipart upload. Multi-part upload is also advised for files greater than 100MB even though it isn’t compulsory to do so.
Versioning
You can version your files on S3, and versioning is enabled at the bucket level. The same key overwrites will lead to increments in versions. It’s best practice to version your bucket so as to protect against unintended deletes and roll back to old versions. It is important to note that any file that is not versioned prior to enabling versioning will have version “null”.
Encryption
There are four methods of encrypting objects in S3:
- SSE-S3: encrypts S3 objects using keys handled & managed by AWS. The Object is encrypted server-side and uses an AES-256 encryption type. The header must be set to “x-amz-server-side-encryption”: “AES256”
- SSE-KMS: leverage AWS Key Management Service to manage encryption keys. The object is also encrypted server-side and has the advantage of having additional user controls and an audit trail for debugging purposes. The header must be set to “x-amz-server-side-encryption”: ”aws:kms”
- SSE-C: when you want to manage your own encryption keys. S3 does not store the encryption key you provide. HTTPS must be used in order to use this encryption type. This is important as the data key must be provided in the header and as such must be protected with TLS. An encryption key must be provided in HTTP headers for every HTTP request made
- Client-Side Encryption: Clients must encrypt data themselves before sending data themselves, and are also responsible for decrypting after retrieving the data from S3. The customer fully manages the keys and encryption cycle
Security
S3 has IAM policies that help determine what API calls should be allowed for a specific user from the IAM console. S3 Bucket Policies help decide bucket wide rules and also allows cross-account access.
S3 has access logs and they can be stored in an S3 bucket. API calls to S3 can be logged in AWS CloudTrail. S3 has multifactor authentication delete (MFA Delete). MFA delete can be required in versioned buckets to delete objects. Pre-Signed URL’s can also be generated to allow authenticated users to access the S3 bucket for a limited amount of time.
Now, let’s run through how to deploy our static website to AWS S3.
Deploying our Static Website to AWS S3
For the purpose of this walkthrough tutorial, we will be using a pre-built sample of a static website, which you can download using this URL from GitHub – Aeeiee-Team/Restaurant-static-website.
Step 1- Create or Sign in to AWS Account
It is important you have an AWS account but if you don’t have one, you can create a free AWS account from Amazon. Click here to create or sign in to your AWS Account. Enter your AWS username and password and it will open the AWS Management Console page. Click on All services and choose AWS S3.
Step 2- Create a Bucket
Click on the “Create bucket” button highlighted in orange colour to create a new bucket. Make sure the name of your bucket is globally unique.
Before you continue, make sure to enable versioning in order to prevent unintentional deletes and the ability to roll back.
Now you can go ahead to create a bucket by clicking the “Create bucket” button.
Step 3 – Upload our static files to the Bucket
After creating the bucket, you will see the bucket under the list of buckets.
Let’s go ahead and click on the bucket we want to host our website on. Once you do this, you should be rerouted to a page where you can upload the static files to the bucket, as shown below. Click upload.
Step 4 – Edit Access Control List (ACL) and Grant Public Access
After uploading the files/folders, you have to edit the Access Control List (ACL) and select the grant public access radio button.
Step 5: Enable Static Website Hosting
When your files are successfully uploaded, navigate to the properties tab of the bucket and scroll down to the bottom.
Click on the edit button of the static website hosting property and select the ‘enable’ radio button, then specify the home or default page of the website which in this case will be “index.html”. You can also create a page that will be displayed when an error is encountered in the error document input form. When you are done, save your changes.
Step 6: Dealing with 403 “Forbidden error”
After saving the changes, you should see a link through which the contents of the bucket will be accessible.
Now, navigate to the link in a browser. It should return a 403 “Forbidden error”, page and that’s because the bucket policy has not been changed. The next action would be to uncheck the default policy on the bucket and create our own bucket policy that grants read access to the public.
Step 7: Creating your own bucket policy
Let’s go back to the console, check our S3 bucket, and navigate to the permissions tab. You’ll see the Block public access (bucket settings). Go ahead and click on the edit button.
You can also uncheck the block public access checkbox and save changes.
You’ll get a warning after clicking “Save changes”. This is normal, so, just follow the instructions on the modal to confirm the changes.
Under the “Block public access (bucket settings)”, scroll down to the “Bucket Policy”, and click on edit.
After clicking on edit, you will get re-routed to another page where you can specify your bucket policy in JSON format.
You can either paste your pre-generated JSON code or use the policy generator to generate your bucket policy. For the purpose of this tutorial, I’m going to use the policy generator to generate a bucket policy to allow all get object requests to the object on all routes. I’ll click on the policy generator and be rerouted to another page where I can generate the policy based on my set requirements.
I am going to choose S3 as the service I want to generate a policy for, then choose “allow” as the effect. I’ll then go ahead to choose “*” as the principal which means all. Next, I’ll specify the actions I want to allow which in this case will be the “GetObject” action.
There is a need to provide the Amazon resource name (ARN) which can be found at the top of the bucket policy. For this tutorial, I’m also going to be adding a “/*” to the ARN which means anyone can do a getObject on any object of this bucket.
I’ll then go ahead to click on “Add Statement”, and “Generate policy”. This should open up a modal with a JSON Policy already generated.
{ "Id": "Policy1632752556611", "Version": "2012-10-17", "Statement": [ { "Sid": "Stmt1632752535612", "Action": [ "s3:GetObject" ], "Effect": "Allow", "Resource": "arn:aws:s3:::statics-website-example/*", "Principal": "*" } ] }
I’ll then copy this policy and paste it into my bucket policy and save the changes.
After saving the changes, I’ll go back to our link to access the website and refresh. The website should now be accessible.
In conclusion, you can see that it’s very easy and straightforward to host your static websites on AWS S3. This is a simple example of how to do it. There are more complex and exciting things that can be done using S3 as a static host. This simple tutorial would have helped you lay the foundation on which you can go on to build more exciting things.
-
How to Use AWS S3 to host your static websites
Cloud technologies are fast becoming the mainstay of what we use to develop custom solutions for consumers. Amazon Web Services(AWS) has become the dominant player and go cloud service for developers. I particularly like the variety of services, tools, and metrics at my disposal when using AWS in comparison to other cloud options. In this…
-
Deploying your Nodejs App to AWS Elastic Beanstalk from GitHub using CodePipeline
In this article, I’m going to do a walkthrough of how to deploy our Nodejs app to Elastic Beanstalk, but first I’m going to give a brief overview of the service. Overview of Elastic Beanstalk AWS Elastic beanstalk is a managed service which means AWS automatically handles capacity provisioning, load balancing, scaling, application health monitoring,…
-
An Introduction to Docker
What is Docker? “Docker is a set of platform as a service (PaaS) products that use OS-level virtualization to deliver software in packages called containers.” – Wikipedia. To begin, let’s examine each of the highlighted terms above to help us better understand the need for Docker. Platform as a service (PaaS) – PaaS are essentially…
-
Using Bull as a Priority Job Handler in Node Js
Let’s build a Node.js API that uses Bull to handle priority Jobs Why Bull? There are a wide variety of priority job queues for Node js. “A Queue is a linear structure which follows a particular order in which the operations are performed. The order is First In First Out (FIFO). A good example of…
-
How to Use Custom code snippets in WordPress
WordPress is a free and open-source content management system written in PHP and paired with a MySQL or MariaDB database. Features include a plugin architecture and a template system, referred to within WordPress as Themes. There are times when we might want to add custom code to our theme’s functions.php file or in one of…
-
How to Create Custom Taxonomies in WordPress
A WordPress taxonomy is a way to organize groups of posts and custom post types. This gives you the flexibility to group posts, pages, etc. for your site needs. Fortunately, WordPress comes with some inbuilt custom taxonomies that make it possible to organize contents and posts but unfortunately, those inbuilt taxonomies might not meet your specific need. This…
-
How to Upload Files to S3 with the AWS JavaScript SDK and WordPress
Why AWS? AWS has a ton of amazing services to help in the software development process. From services that help you cache static assets like CloudFront, to services that scale based on the traffic to your application like ElasticBeanstalk (this comes with a load balancer by default). At Aeeiee, we’re huge fans of AWS. Our…
-
Getting Started with Local by Flywheel
Developers always need a local environment to write, run, and test their code before deployment. At Aeeiee, one of the technologies we use is WordPress, but we need to be able to develop WordPress locally before pushing it to production, hence our use of Local by Flywheel. Local by Flywheel is easy to use and very…
-
#EndSARS: Seize the Moment
As a Nigerian citizen living abroad, as a Pan-Africanist, and as the leader of a company with remote workers based in Nigeria, I wish to lend my support and my voice to the #EndSARS cause. #EndSARS is a powerful movement of passionate young Nigerians putting their lives on the line to demonstrate in civil disobedience…
-
Aeeiee is hiring again!
Aeeiee is hiring again! One of our goals for 2020 is to get back on the iOS App Development train. We’ve seen a tremendous amount of success with Dress Measurement, with over 26,000 downloads from 126 different countries. Over 12,000 of those downloads were in this year alone. We’ve also maintained a 4.6/5 rating in…
-
Dress Measurement Version 1.3.1
We’re happy to announce that Dress Measurement Version 1.3.1 is live on the app store. This new version includes the following new features and fixes:
-
Dress Measurement Version 1.3
Dress Measurement version 1.3 is now on the App Store. Download it today and try out our new features! iCloud for Everyone All users can now backup their data to the cloud, and sync with multiple devices Tailor Shop Subscription Tailor Shop is a premium subscription tier with access to exclusive features like Profile Photos,…
-
We’ve Been Listening
Dress Measurement version 1.3 is about to hit the App Store. We currently have over 9000 downloads, and a 4.5/5 rating on the App Store, but we know that our app needs plenty of improvements. Before we launch, I wanted to take time to let our users know that despite our silence and despite our shifting…
-
It’s Over 9000
We’ve been quiet over at Aeeiee, but we haven’t been resting on our laurels. We’ve got a ton of updates coming for Dress Measurement, but before that, a little milestone. As of today, Dress Measurement has reached over 9000 downloads, and our app is used in 108 different countries. Our top five countries are: Notice…
-
Dress Measurement is back on track!
Back in June 2017, Aeeiee began the process of expansion and moved to a new office on 4th & Mill in Tempe, Arizona. Then came the month long process of hiring talent to fill our development needs. By August 7th, 2017 we had hired our team and began the training our devs on our various…
-
Aeeiee is hiring!
Things are moving fast here at Aeeiee. We’ve just closed on a new office in the heart of downtown Tempe, walking distance from Arizona State University. We’re hoping the downtown location and proximity to one of the best engineering colleges in the country will attract top notch software talent to work at our growing Arizona startup. We’re…
-
What’s going on with Dress Measurement?
It’s been a year since we’ve launched our first iOS app, Dress Measurement. What’s happened since then? First, we’ve reached over 4000 downloads, with no advertising (well, no advertising after the first week). This is also with no SEO, which is to my chagrin, because we’re a company that specializes in Search Engine Optimization. This…
-
Scalable Cloud Architecture
Aeeiee is proud to announce our first real-world implementation of our auto-scaling cloud hosting environment for our client, Iridium Communications Inc. Iridium is replacing its satellite constellation by sending 75 Iridium NEXT satellites into space on SpaceX’s Falon 9 rocket platform.On January 14, 2017, Space X successfully launched Iridium’s first 10 satellites into space. IridiumNext.com, a…