The Ultimate Guide to Static Websites with S3 and Terraform

This page summarizes the projects mentioned and recommended in the original post on dev.to

Our great sponsors
  • Appwrite - The Open Source Firebase alternative introduces iOS support
  • Scout APM - Less time debugging, more time building
  • JetBrains - Developer Ecosystem Survey 2022
  • SonarQube - Static code analysis for 29 languages.
  • static-website-boilerplate

    Boilerplate for a serverless static website project - deployed to AWS using CloudFront and AWS.

    In the following, I will discuss various aspects of hosting static website with S3 that we need to be aware of to enable all of the above. This article has a companion project on GitHub: static-website-boilerplate. Examples will refer to this project. The project is implemented using TypeScript and Terraform.

  • goldstack

    Templates and boilerplates for fullstack projects customised to your needs.

    Consider helping out making this template better for others by raising an issue in GitHub if you encounter any problems or have questions or ideas.

  • Appwrite

    Appwrite - The Open Source Firebase alternative introduces iOS support . Appwrite is an open source backend server that helps you build native iOS applications much faster with realtime APIs for authentication, databases, files storage, cloud functions and much more!

  • light-server

    A lightweight cli static http server and it can watch files, execute commands and trigger livereload

    The for the template (and in turn the boilerplate project), I decided to use the light-server library which among other features offers hot reload. In the template, you can simply run yarn watch to start the local development server.

  • Gatsby

    Build blazing fast, modern apps and websites with React

    Other frameworks that generate static files such as Gatsby also generate pages that can easily be uploaded to S3.

  • Next.js

    The React Framework

    Next.js offers an option to generate a static HTML export for Next.js applications. Such an export can be uploaded as is to an S3 bucket configured as suggested here to serve a Next.js application through AWS. This is the approach I have used for the Next.js + Bootstrap and Next.js templates.

  • nextjs-bootstrap-boilerplate

    Boilerplate for a Next.js Project using Bootstrap Styling. Configured for TypeScript and Terraform.

    Next.js offers an option to generate a static HTML export for Next.js applications. Such an export can be uploaded as is to an S3 bucket configured as suggested here to serve a Next.js application through AWS. This is the approach I have used for the Next.js + Bootstrap and Next.js templates.

  • amplify-hosting

    AWS Amplify Hosting provides a Git-based workflow for deploying and hosting fullstack serverless web applications.

    Hosting a simple static website is one of those things one would expect to be easier on AWS (it is by far from the only one). AWS seem to have recognised this and now offer the AWS Amplify Hosting service. I have not used this service myself but like other services branded under the Amplify umbrella it will come with the usual trade-off: a quicker setup for less flexibility.

  • Scout APM

    Less time debugging, more time building. Scout APM allows you to find and fix performance issues with no hassle. Now with error monitoring and external services monitoring, Scout is a developer's best friend when it comes to application development.

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts