A lightning-fast, SEO-optimized portfolio website with automated AWS deployment

• David's Portfolio Template
  • Links
  • Overview
    • ⚡️ Performance
    • 🎨 Design & Accessibility
    • 🚀 API & Deployment
  • Key Technologies
  • License
  • Contributing

About | Setup Guide | Deployment Guide | Analytics | Live Demo | Use This Template

• Thank you for checking out my portfolio template! It's built in Astro with vanilla HTML, JS, and Tailwind CSS.
• The site is deployed using Terraform, GitHub Actions, and AWS.
• This site includes its own optional contact form API with anti-spam protection and a simple analytics API with a local dashboard to visualize analytics data.
• Click "use this template" and follow the instructions in the Setup Guide if you'd like to set up a copy of this website for yourself! Optionally, use the Deployment Guide to deploy to AWS.
• Want to learn more about the reasoning behind the implementation of this portfolio, other helpful context, or FAQs? See the About page
• Need help or have a suggestion? Please create a GitHub issue.
• This is an ongoing project being actively updated

ℹ️ Note: This portfolio is an experimental testbed and proof of concept for my very specific use-case. It is subject to change abruptly.

• Statically rendered with deeply customizable CMS content (Entire site is under 30KB compressed)
• CDN-powered global delivery
• Functional without Javascript
• CSS/JS is built into the html file to reduce network requests
• Only 15 KB of JS uncompressed
• 100/100 Lighthouse score

• Modern glassmorphic design
• Responsive down to 320 pixel width
• Easy content customization through a single file (content/index.ts)
• Fully accessible. Reads well with screen readers, can zoom to 200%, high contrast, large clickable regions, semantic HTML and aria attributes. Working towards WCAG 2.2 AA conformance
• Eye-catching animations, disabled if user prefers reduced motion

• Automated, low-cost, and secure AWS deployment (less than $2 per month) using Terraform for easy setup
• GitHub Actions for CI/CD when code changes
• CloudFormation script for bootstrapping Terraform state storage in AWS S3 & DynamoDB
• Contact form and analytics APIs with abuse protection

• Astro
  • Library for building the static generated site
• Tailwind CSS
  • Utility-first CSS styling
• TypeScript
  • Type safety for the site
• PNPM
  • Efficient package manager
• ESLint
  • Code linter
• Prettier
  • Code formatting
• Vite
  • Build tool used by Astro
• Node.js
  • JavaScript runtime for Lambda functions
• AWS
  • Cloud provider for the site and APIs
• Terraform
  • Infrastructure as Code library that deploys the site and manages resources
• GitHub Actions
  • Automates the deployment of the site to AWS using Terraform and Linux
• CloudFormation
  • Bootstraps the Terraform state backend in AWS
• Next.js
  • Used for the local analytics dashboard
• DuckDB
  • Database for analytics report generation
• Recharts
  • Simple charting library for analytics dashboard
• Shadcn/ui
  • Component library for analytics dashboard
• Tanstack Table
  • Table library for analytics dashboard

This project is licensed under the MIT License. You are free to use, modify, and distribute this code as you see fit. See the LICENSE file for more information.

If you have any suggestions, improvements, or issues, please create a GitHub issue or a pull request. Feedback welcome!

Analytics Dashboard

Lighthouse Score