Skip to content

Commit

Permalink
update documentation
Browse files Browse the repository at this point in the history
  • Loading branch information
cornelcroi committed Aug 18, 2024
1 parent d918409 commit 2dbf470
Show file tree
Hide file tree
Showing 27 changed files with 690 additions and 418 deletions.
11 changes: 0 additions & 11 deletions bin/cli/shared/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -39,17 +39,6 @@ export type HostingConfiguration = (
} & CommonAttributes
);

/*export interface IConfiguration {
repoUrl?: string;
branchName?: string;
framework?: string;
s3bucket?: string;
s3path?: string;
domainName?: string;
hostedZoneId?: string;
}*/



export interface IChoice {
title: string;
Expand Down
31 changes: 18 additions & 13 deletions docs/astro.config.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -44,35 +44,40 @@ export default defineConfig({
"label": "User Guide",
"items": [
{ "label": "CLI Guide", "link": "/user-guide/cli-guide" },
{ "label": "CDK Integration", "link": "/user-guide/cdk-integration" }
{
label: 'CDK Guide',
items: [
{ label: 'Overview', link: '/user-guide/cdk-guide' },
{ label: 'CDK Construct', link: '/user-guide/cdk-construct' },
{ label: 'CDK Source code', link: '/user-guide/cdk-source-code' },
{ label: 'Configuration guide', link: '/user-guide/cdk-configuration' },
]
},
]
},
{
"label": "Features",
"items": [
{ "label": "Overview", "link": "/features/overview" },
{ "label": "Self-paced Setup Wizard", "link": "/features/setup-wizard" },
{ "label": "Instant Deployment", "link": "/features/instant-deployment" },
{ "label": "GitHub Integration", "link": "/features/github-integration" },
{ "label": "Optimized Caching", "link": "/features/optimized-caching" },
{ "label": "Enhanced Security Headers", "link": "/features/security-headers" },
{ "label": "Custom Domain Support", "link": "/features/custom-domains" },
{ "label": "SSL/TLS Management", "link": "/features/ssl-tls-management" }
{ "label": "Self-paced wizard", "link": "/features/setup-wizard" },
{ "label": "Instant deployment", "link": "/features/instant-deployment" },
{ "label": "GitHub integration", "link": "/features/github-integration" },
{ "label": "Optimized caching", "link": "/features/optimized-caching" },
{ "label": "Security headers", "link": "/features/security-headers" },
{ "label": "Custom domain support", "link": "/features/custom-domains" }
]
},
{
"label": "Advanced Usage",
"items": [
{ "label": "Advanced Configuration", "link": "/advanced/configuration" },
{ "label": "Custom Frameworks", "link": "/advanced/custom-frameworks" },
{ "label": "Bring Your Own Framework", "link": "/advanced/bring-your-own-framework" },
{ "label": "Manual Deployment", "link": "/advanced/manual-deployment" }
{ "label": "Advanced configuration", "link": "/advanced/configuration" },
{ "label": "Bring your own framework", "link": "/advanced/bring-your-own-framework" }
]
},
{
"label": "Troubleshooting",
"items": [
{ "label": "Troubleshooting Guide", "link": "/troubleshooting/guide" }
{ "label": "Troubleshooting guide", "link": "/troubleshooting/guide" }
]
},
{
Expand Down
Binary file removed docs/public/demo-app.gif
Binary file not shown.
Binary file removed docs/public/flow.jpg
Binary file not shown.
Binary file added docs/public/img/architecture.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/public/img/deploy.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/public/img/init.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
49 changes: 38 additions & 11 deletions docs/src/content/docs/advanced/bring-your-own-framework.md
Original file line number Diff line number Diff line change
@@ -1,18 +1,45 @@
---
title: Bring Your Own Framework
title: Custom Frameworks
---

This feature allows you to use CloudFront Hosting Toolkit with any custom framework or build process.
While CloudFront Hosting Toolkit supports many popular frameworks out-of-the-box, you can configure it for custom frameworks.

## Steps:
## Steps to Integrate Your Framework

1. Create a custom build script that outputs your site to a directory.
2. Configure the `cloudfront-hosting-toolkit-config.yml` to use your custom build script.
3. If needed, create a custom CloudFront Function for URL rewriting.
4. Use the `cloudfront-hosting-toolkit init` command to set up your project with these custom configurations.
1. Create a custom build configuration file named `hosting_YOURFRAMEWORKNAME.yml` in the `cloudfront-hosting-toolkit` folder.
2. Create a custom CloudFront Function file named `index_YOURFRAMEWORKNAME.js` in the same folder.
3. Run `cloudfront-hosting-toolkit init` again and select your custom framework when prompted.

## Best Practices:
## Example: Custom Static Site Generator

- Test your build script locally before integrating with the toolkit.
- Ensure your CloudFront Function handles all necessary URL rewriting scenarios.
- Document any special requirements or steps for your custom framework.
For a custom static site generator called "MySSG":

1. Create `hosting_myssg.yml`:

```yaml
version: 0.2
phases:
install:
runtime-versions:
nodejs: 18
build:
commands:
- npm run generate
artifacts:
base-directory: output
files:
- '**/*'
```
2. Create `index_myssg.js`:

```javascript
function handler(event) {
var request = event.request;
var uri = request.uri;
// Custom URL rewriting logic here
return request;
}
```
45 changes: 0 additions & 45 deletions docs/src/content/docs/advanced/custom-frameworks.md

This file was deleted.

26 changes: 0 additions & 26 deletions docs/src/content/docs/advanced/manual-deployment.md

This file was deleted.

62 changes: 52 additions & 10 deletions docs/src/content/docs/architecture/overview.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,18 +2,60 @@
title: Architecture Overview
---

CloudFront Hosting Toolkit leverages several AWS services to create a robust, scalable, and efficient hosting infrastructure for your web applications.
CloudFront Hosting Toolkit leverages several AWS services to create a robust, scalable, and efficient hosting infrastructure for your web applications. The architecture is designed to support both GitHub-based and S3-based source code repositories, ensuring flexibility in your deployment workflow.

![Technical diagram](img/architecture.jpg)
<img src="/cloudfront-hosting-toolkit/img/architecture.jpg" alt="CloudFront Hosting Toolkit Architecture Diagram">

## Key Components
1. **AWS CodePipeline**: Manages the overall deployment process.
2. **AWS CodeBuild**: Handles the build process for your web application.
3. **Amazon S3**: Stores your website files and deployment artifacts.
4. **Amazon CloudFront**: Serves as the content delivery network (CDN) for your website.
5. **AWS Lambda**: Powers the CloudFront Functions for request handling.
6. **AWS Step Functions**: Orchestrates the deployment process.
7. **Amazon DynamoDB**: Stores key-value pairs for routing information.

This architecture ensures rapid, consistent deployments and optimal performance for your web applications.
1. **Source Code Management**:
- **GitHub Repository**: For Git-based workflows.
- **Amazon S3 (Source Code Repository)**: For S3-based workflows, allowing ZIP file uploads.

2. **Deployment Pipeline**:
- **AWS CodePipeline**: Manages the overall deployment process, orchestrating the flow from source to production.
- **AWS CodeBuild**: Handles the build process for your web application, compiling code and creating artifacts.
- **Amazon S3 (Artifacts)**: Stores deployment artifacts during the pipeline process.

3. **Hosting Infrastructure**:
- **Amazon S3 (Static files)**: Stores your website files for serving.
- **Amazon CloudFront**: Serves as the content delivery network (CDN) for your website, ensuring fast global access.
- **CloudFront Function**: Handles request routing to serve the latest version of your site.
- **Amazon Route 53**: Manages DNS routing for your custom domain (if configured).

4. **Security and SSL**:
- **AWS Certificate Manager (ACM)**: Provisions and manages SSL/TLS certificates for secure HTTPS connections.

5. **Deployment Orchestration**:
- **AWS Step Functions**: Orchestrates the deployment process, ensuring proper sequencing of tasks.
- **AWS Lambda**: Triggers the pipeline for S3-based deployments and potentially other serverless operations.

6. **State Management**:
- **Key Value Store (DynamoDB)**: Stores routing information to direct traffic to the latest deployed version.

## Workflow Overview

1. **Code Push/Upload**:
- Developers push code to GitHub or upload a ZIP file to the S3 source code repository.

2. **Pipeline Triggering**:
- GitHub pushes or S3 uploads trigger the AWS CodePipeline, either directly or via AWS Lambda.

3. **Build and Artifact Creation**:
- AWS CodeBuild compiles the code and creates deployment artifacts.
- Artifacts are stored in an S3 bucket.

4. **Deployment**:
- AWS Step Functions orchestrate the deployment process.
- Static files are copied to the hosting S3 bucket.
- The Key Value Store is updated with the latest deployment information.

5. **Content Delivery**:
- CloudFront serves the website content globally.
- CloudFront Functions use the Key Value Store to route requests to the latest version.
- Amazon Route 53 handles DNS routing for custom domains.

6. **Security**:
- AWS Certificate Manager provides SSL/TLS certificates for secure connections.

This architecture ensures rapid, consistent deployments, optimal performance, and high availability for your web applications. It leverages AWS's global infrastructure to deliver content quickly to users worldwide while maintaining the flexibility to deploy from various source repositories.
76 changes: 52 additions & 24 deletions docs/src/content/docs/features/custom-domains.md
Original file line number Diff line number Diff line change
@@ -1,36 +1,64 @@
---
title: Custom Domain Support
title: Custom domain support
---

The Custom Domain Support feature of CloudFront Hosting Toolkit allows you to easily configure and use your own domain names for your deployed websites, ensuring a professional and branded online presence.
The CloudFront Hosting Toolkit supports custom domain configuration for both Amazon Route 53 users and those using other DNS providers. This flexibility ensures that regardless of your DNS management solution, you can easily set up a custom domain for your CloudFront-hosted website.

## Key Features
## Route 53 Users vs. Non-Route 53 Users

- **Simple Domain Configuration**: Streamlined process for adding custom domains to your CloudFront distribution.
- **Automatic DNS Setup**: (When using Amazon Route 53) Automatically configures DNS records for your domain.
- **Support for Apex and Subdomains**: Allows use of both root domains (e.g., example.com) and subdomains (e.g., www.example.com).
- **Integration with Existing Domains**: Works with domains you already own, regardless of where they're registered.
1. **Route 53 Users**
- Benefit from a more automated process
- The CLI can directly interact with your Route 53 hosted zones
- Automatic creation of necessary DNS records

## How It Works
2. **Non-Route 53 Users**
- Receive guided instructions for manual DNS configuration
- Need to create DNS records with their respective DNS providers
- Still benefit from automated certificate management and CloudFront configuration

1. **Domain Input**: During the setup process, you specify your custom domain name.
2. **DNS Verification**: The toolkit verifies domain ownership and DNS configuration.
3. **CloudFront Configuration**: Updates the CloudFront distribution to include your custom domain.
4. **SSL/TLS Certificate**: Automatically requests and associates an SSL/TLS certificate for your domain (see [SSL/TLS Management](/features/ssl-tls-management)).
5. **DNS Record Creation**: If using Route 53, creates necessary DNS records; otherwise, provides instructions for manual DNS configuration.
## The Process

## Benefits
Regardless of your DNS provider, the CLI handles the following steps:

1. **SSL/TLS Certificate Management**
- Checks for an existing certificate in AWS Certificate Manager (ACM)
- Creates a new certificate if one doesn't exist
- Waits for the certificate to be issued and validated

2. **CloudFront Distribution Configuration**
- Integrates your custom domain with the CloudFront distribution

3. **DNS Configuration**
- This step differs based on your DNS provider:

### For Route 53 Users:

1. The CLI detects that you're using Route 53 based on the provided hosted zone ID
2. After deploying the CloudFront distribution, it checks if a CNAME record already exists
3. If no record exists, it prompts you to confirm the creation of a new CNAME record
4. Upon confirmation, it automatically creates the CNAME record in your Route 53 hosted zone

- **Professional Branding**: Use your own domain name instead of the default CloudFront URL.
- **Improved SEO**: Custom domains can positively impact your search engine rankings.
- **Flexibility**: Easily switch between different domains or add multiple domains to a single distribution.
- **Seamless User Experience**: Provides a consistent URL for your users, regardless of backend changes.
### For Non-Route 53 Users:

## Best Practices
1. The CLI recognizes that you're not using Route 53 (no hosted zone ID provided)
2. After deploying the CloudFront distribution, it provides detailed instructions for manual DNS configuration
3. You receive step-by-step guidance on how to create a CNAME record with your DNS provider, including:
- The record type (CNAME)
- The host name (your custom domain)
- The target (the CloudFront distribution domain)

## User Interaction

- **Route 53 Users**: You'll be prompted to confirm the creation of the DNS record. The process is largely automated after your confirmation.
- **Non-Route 53 Users**: You'll need to manually create the DNS record with your provider using the instructions provided by the CLI.

In both cases, the CLI handles the complex tasks of certificate management and CloudFront configuration, simplifying the process of setting up a custom domain for your static website.

## Benefits

- Secure your domain with HTTPS by using the toolkit's SSL/TLS management feature.
- If not using Route 53, ensure you have access to modify DNS records for your domain.
- Consider using www and non-www versions of your domain for better user accessibility.
- Regularly verify that your domain is correctly pointing to your CloudFront distribution.
- Supports users of all DNS providers
- Automates certificate management and CloudFront configuration
- Provides a guided experience for non-Route 53 users
- Offers a near-fully automated process for Route 53 users

Custom Domain Support enhances your website's professional appearance and brand consistency, providing a seamless experience for your users while leveraging the power of CloudFront's global content delivery network.
By accommodating both Route 53 and non-Route 53 users, the CloudFront Hosting Toolkit ensures a smooth custom domain setup process, regardless of your DNS management solution.
Loading

0 comments on commit 2dbf470

Please sign in to comment.