AI Assisted Web Development

Role
Gen AI assisted progarmming
Year
2025

Overview

In this capstone “AI-Assisted Web Development” project, I partnered with ChatGPT to architect, prototype, and refine my personal engineering portfolio site. Leveraging conversational prompts, I sketched the site map (Home, Projects, About, Contact), iterated on responsive layouts using CSS flex and grid, and honed interactive components—countdown timers, image galleries, and GitHub-embed sections. AI guidance streamlined critical decisions (e.g., centering buttons, tuning max-widths for readability), suggested semantic HTML structures (header/nav/main/section), and provided concise copy for project overviews.

Webots Maze Simulation

How It Was Built

With no prior HTML or CSS experience, I leveraged ChatGPT (o4-mini) to generate every line of code and asset for this site in just over one day. Here’s my streamlined process:

  1. Outline Requirements: Drafted a spec for an “About Me” page, “Projects” gallery, and contact form.
  2. Precision Prompting: Crafted targeted prompts to produce semantic HTML, responsive CSS, and JavaScript utilities.
  3. Iterative Refinement: Reviewed drafts across sessions, requested tweaks, and merged updates in VS Code.
  4. Version Control: Committed each change to GitHub using Git fundamentals learned in programming courses.
  5. Deployment: Configured Netlify (custom domain, SSL) for live hosting under ChatGPT’s guidance.

While AI wrote the core code, I reviewed and adjusted every snippet, quickly mastering web fundamentals. This rapid, AI-driven workflow delivered a polished portfolio in one day and is a model I’ll apply to future projects.

View the Code on GitHub