This is the static website for iporaitech.com, styled with TailwindCSS and bundled with Webpack.
NOTICE: Iporaitech is currently out-of-service, but this is a very simple example to showcase how to build an static website without a framework, and deploy it to AWS.
It features English/Spanish content by using the HtmlWebpackPlugin to generate the index.html and the es/index.html files based on a template file and partial content embedded in the template for each language.
The language switcher works with a cookie (that doesn't need GDPR banner) and JavaScript.
Caveat, tests nor code quality checks are included in this project.
Install dependencies with yarn install
Start development server with yarn dev
Build for production with yarn build:prod
This is an static website hosted in a private S3 bucket and distributed by CloudFront. These and other related resources are provided by the following Terraform modules:
The AWS account where these resources live is part of an AWS Control Tower landing zone, and it was provisioned using the aws-afc-terraform-s3-backend-blueprint.
For convenience, the Route53 hosted zone for the iporaitech.com domain name as well as the Google site-verification and Gmail related DNS records are also defined in this repository and are created in the same AWS account as the rest of the resources in this repo.
Check the terraform directory for more info.
TODO: add terraform-docs
The CloudFront distribution is configured with cdn_request_handler.js to redirect root domain requests to www (e.g., domain.com -> www.domain.com). This is possible because www is added as an alias to the distribution and as a subject alternative name (SAN) to the ACM Certificate.
The handler also takes care of requests to /es. This is needed because CloudFront doesn't resolve index.html files in subdirectories, and /es is a subdirectory.
When you create a Route53 hosted zone for your domain, you have to update the name servers (NS) on the domain's registrar with the NS records assigned to the hosted zone by Route53.
You can use the dig command to verify the name servers have been propagated (at least to your location). For example, the following command should return the same NS as the ones shown in the Route53 hosted zone:
dig NS mydomain.com +short
Operations that require Route53 DNS records will timeout if the NS records returned by the DNS query are not the same as the ones in the hosted zone, for example, the ACM certificate validation from the terraform-aws-route53-cert module.
In my experience, with US and PY based DNS registrars, ACM (us-east-1) was able to validate certificates ~1 hour or so after updating the NS in the registrar ... maybe affected by me running
digfrom my side to get the expected CNAME answer (?) 🤔.
A single string in a TXT record has a 255-character limit, but the 2048-bit DKIM value from Gmail can be around 400 characters.
The aws_route53_record.dkim created in this repository is an example of how to workaround this limit.
Essentially, the process is:
- Deploy the AWS infra with Terraform
- Build for production
- Sync the build output to its S3 bucket
- Invalidate CloudFront cache
In the implementation, this is optimized with caching and by running first the infra and production build in parallel jobs, and when these job finish, a job for the sync and cache invalidation.
Check the Build and deploy GitHub Actions workflow for implementation details.
NOTICE: the workflow expects secrets.AWS_ROLE to be set with the ARN of the GithubActionsRole created by the aws-afc-terraform-s3-backend-blueprint, or an equivalent role that can authenticate via OIDC to the AWS account.