Colin Knapp Portfolio Resume

A professional portfolio website with accessibility features and automated testing.

Features

• Responsive design for all device sizes
• Light/dark mode toggle with system preference detection
• High contrast accessible design
• Keyboard navigable interface
• WCAG 2.1 Level AA+ compliant

Development

Prerequisites

• Node.js (v14 or higher)
• npm (v6 or higher)

Setup

1. Clone the repository:

   git clone git@git.nixc.us:colin/resume.git
   cd resume
   

2. Install dependencies:

   npm install
   

3. Set up Playwright browsers:

   npm run setup
   

Local Development

To serve the site locally for development:

npm run serve

This will start a local development server at http://localhost:8080.

Testing

The project includes automated testing using Playwright for functional tests and Lighthouse for performance and accessibility audits.

Running all tests

npm test

Running only Playwright tests

npm run test:playwright

Running only Lighthouse tests

npm run test:lighthouse

Docker Deployment

The site is deployed using Docker and Caddy. The deployment configuration is in the docker directory.

To build and run the Docker container locally:

cd docker
docker build -t resume:latest ./resume/
docker run -p 8080:8080 resume:latest

Accessibility

This site is designed to meet WCAG 2.1 Level AA+ standards. Key accessibility features include:

• Proper heading hierarchy
• Keyboard navigable interface with visible focus states
• Color contrast ratios that exceed WCAG AA requirements
• Semantic HTML structure
• Accessible form controls and ARIA attributes
• Light/dark mode support with system preference detection
• Responsive design for all device sizes

License

ISC © Colin Knapp