How to Share your Notebooks as static websites with AWS S3

Data Scientists use to work with notebooks like Jupyter and RMarkdown. Through notebooks, they can easily share their analysis in HTML format. But what about when there is a need to share the notebooks publicly? In this case, the most convenient way is to configure an Amazon S3 bucket to function as a static website. In this tutorial, we will provide you a walkthrough example of how you can share your notebooks as a static website with AWS S3.

Create your Report

The report should be in HTML format. Let’s create a dummy report in R using RMarkdown. Let’s create the Rmd report:

---
title: "Cars Report"
output: html_document
---

```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = FALSE, warning = FALSE, message = FALSE)
```


# This is a DT datatable 

```{r}
# Load the libraries
library(DT)
library(tidyverse)
library(plotly)


DT::datatable(mtcars, options=list(
    pageLength = 10))
```


# This is a Plotly Chart

```{r}
my_plot <- ggplot(mtcars,aes(x=wt,y=mpg)) + geom_point()+ ggtitle("Miles Per Gallon vs Weight") +
  xlab('Weight (x 1000lbs)') + ylab('Miles per Gallon') + geom_smooth() 
ggplotly(my_plot)

```
 

Finally, we knit it as HTML and we store it locally.

Create your S3 Bucket

Now you have to log-in to the AWS Console and to create a new bucket. In my case I created the predictive-hacks-eg-static-html

Then, you need to upload your html report, called “index.html” and an “error” to be returned in case there is an error. In my case, I called it “error.html“

Now, you need to go to the S3 Bucket and to go to properties and to edit the Static website hosting.

You enable the website hosting and you specify the Index and Error documents respectively.

Then, you need to go to the bucket Permissions and to uncheck the “Block all public access” and then click “Save changes”

Then, you will need to edit the bucket policy by entering:

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "PublicReadGetObject",
            "Effect": "Allow",
            "Principal": "*",
            "Action": [
                "s3:GetObject"
            ],
            "Resource": [
                "arn:aws:s3:::predictive-hacks-eg-static-html/*"
            ]
        }
    ]
}

Where predictive-hacks-eg-static-html is my bucket. You should write yours.

Now you should be ready. If you go down to the bucket properties you will see your public URL link

In my case it is http://predictive-hacks-eg-static-html.s3-website-eu-west-1.amazonaws.com. If you click on the link you should be able to see my report.

Finally, note that Amazon S3 does not support HTTPS access to the website. If you want to use HTTPS, you can use Amazon CloudFront to serve a static website hosted on Amazon S3.