Reference Projects

AWS Cloud-Based Portfolio Website with ChatGPT Integration

This project houses the Infrastructure as Code (IaC) necessary for deploying a personal portfolio website on AWS. It employs an array of AWS services and incorporates a real-time chat interface powered by OpenAI's ChatGPT.

image of portfolio website infrastructure

Overview

The portfolio website, aside from showcasing work, includes a contact form and a real-time chat interface. Both functionalities are achieved through AWS services, providing a serverless, scalable, and secure solution. Notably, the website caters to both 'www' and non-www redirections through a separate S3 bucket and CloudFront distribution. All buckets are private, with access limited to specific identities and roles.

Privacy and Implementation

The design of the website prioritizes user privacy, with no cookies being stored during site usage. This ensures user data privacy and GDPR compliance. Technically, the website's frontend is hosted on an Amazon S3 bucket, with a separate S3 bucket managing redirection for 'www' and non-'www' traffic. All buckets are private and accessible only via specific access identities and roles. The website utilizes AWS services for functionalities like email forwarding and chatbot operation.

Architecture

The architecture comprises the following AWS services:

  • S3 Buckets: Host the static website and manage redirections.
  • CloudFront Distributions: Cater to content delivery, caching, and HTTPS requests.
  • Route 53: Links domain names to the respective resources.
  • API Gateway: Triggers the Lambda function corresponding to the request's resource path.
  • Lambda Functions: Handles chat interactions (via ChatGPT integration) and forwards emails.
  • SES (Simple Email Service): Facilitates email forwarding from the contact form to a personal email account.
  • Secrets Manager: Safeguards the ChatGPT API key.

You can access the associated Terraform code in this GitHub repository.

Professional Portfolio Website

This project encompasses the codebase for a professional portfolio website designed to effectively showcase the individual's background, skills, projects, and provide an intuitive contact form. The aim is to deliver a user-friendly and engaging platform to highlight the professional journey and accomplishments.

Structure and Content

The website is organized into five main sections:

  • Home: Presents a brief introduction and primary career highlights.
  • About: Provides detailed insight into the individual's background, skills, qualifications, and unique value proposition.
  • Resume: Offers a comprehensive account of academic history, professional experience, certifications, and other relevant details.
  • Projects: Showcases a variety of projects executed, demonstrating practical experience and expertise.
  • Contact: Allows visitors to get in touch via a form, which triggers an automated email through AWS Simple Email Service (SES) upon submission.

An integrated chat interface, powered by OpenAI's GPT-4 model, enhances the user experience by offering a dynamic way to learn more about the individual's profile. The website design is clean, modern, and user-friendly, providing a seamless experience across various devices and platforms.

Source Files

For the website's source files (HTML, CSS, JS, etc.), please refer to this Portfolio Page Repository.

Logo by Wikimedia Commons is licensed under CC BY-SA 4.0