Overview

This article discusses the use of 11ty-aws11ty, Alpine, and Tailwind on AWS to create a full-stack JavaScript application. The stack aims to minimize context switching and provide a unified ingress for both the static site and API Gateway using CloudFront. The article also includes instructions for getting started with the stack, suggestions for VSCode plugins, and a flow diagram.

Features

• Full-stack JavaScript development
• Minimal context switching
• CloudFront as a unified ingress for static site and API Gateway
• Support for API integration
• Use of AWS CDK (Cloud Development Kit) for infrastructure deployment
• Integration with 11ty, Alpine, and Tailwind

Installation

To install this stack, follow these steps:

1. Configure your awscli.
2. Update the file cdk/bin/static-site.ts with your domain name(s).
3. Update the domain name(s) in cloudfront/static-rewrite.js.
4. Run the command cd cdk && npm run cdk deploy StaticSiteInfra to deploy the infrastructure.
5. Run the command npm run build to build the project.
6. Run the command cd cdk && npm run cdk deploy StaticSiteDeploy to deploy the static site.
7. Follow the provided 11ty and aws-cdk commands for further development and deployment.

Summary

This article introduces the use of 11ty-aws11ty, Alpine, and Tailwind on AWS for full-stack JavaScript development. The stack aims to reduce context switching and provides a unified ingress for both the static site and API Gateway using CloudFront. The article includes instructions for installation and deployment, as well as suggestions for VSCode plugins.